Merge feature/mobile-settings to develop

apps/common/mobile/resources/less/ios/_collaboration.less

@@ -0,0 +1,59 @@
+.page-change {
+  .block-description {
+    background-color: #fff;
+    padding-top: 15px;
+    padding-bottom: 15px;
+    margin: 0;
+  }
+  #user-name {
+    font-size: 17px;
+    line-height: 22px;
+    color: #000000;
+    margin: 0;
+  }
+  #date-change {
+    font-size: 14px;
+    line-height: 18px;
+    color: #6d6d72;
+    margin: 0;
+    margin-top: 3px;
+  }
+  #text-change {
+    color: #000000;
+    font-size: 15px;
+    line-height: 18px;
+    margin: 0;
+    margin-top: 10px;
+  }
+  .block-btn {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    margin: 26px 0;
+
+    #btn-next-change, #btn-reject-change {
+      margin-left: 20px;
+    }
+
+    .link {
+      height: 48px;
+      width: 48px;
+      display: inline-block;
+      .icon {
+        background-position: center;
+        height: 48px;
+        width: 48px;
+      }
+    }
+  }
+}
+.navbar .center-collaboration {
+  display: flex;
+  justify-content: space-around;
+}
+.container-collaboration {
+  .navbar .right.close-collaboration {
+    position: absolute;
+    right: 10px;
+  }
+}

apps/common/mobile/resources/less/ios/_color-schema.less

@@ -0,0 +1,25 @@
+.color-schemes-menu {
+  cursor: pointer;
+  display: block;
+  background-color: #fff;
+  .item-content {
+    padding-left: 0;
+  }
+  .item-inner {
+    justify-content: flex-start;
+    padding-left: 16px;
+  }
+  .color-schema-block {
+    display: flex;
+  }
+  .color {
+    min-width: 26px;
+    min-height: 26px;
+    margin: 0 2px 0 0;
+    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
+  }
+  .text {
+    margin-left: 20px;
+    color: #212121;
+  }
+}

apps/common/mobile/resources/less/material/_collaboration.less

@@ -0,0 +1,59 @@
+.page-change {
+  .block-description {
+    background-color: #fff;
+    padding-top: 15px;
+    padding-bottom: 15px;
+    margin: 0;
+  }
+  #user-name {
+    font-size: 17px;
+    line-height: 22px;
+    color: #000000;
+    margin: 0;
+  }
+  #date-change {
+    font-size: 14px;
+    line-height: 18px;
+    color: #6d6d72;
+    margin: 0;
+    margin-top: 3px;
+  }
+  #text-change {
+    color: #000000;
+    font-size: 15px;
+    line-height: 18px;
+    margin: 0;
+    margin-top: 10px;
+  }
+  .block-btn {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    margin: 0;
+    padding: 26px 0;
+    background-color: #EFEFF4;
+
+    #btn-next-change, #btn-reject-change {
+      margin-left: 20px;
+    }
+
+    .link {
+      display: inline-block;
+
+      .icon {
+        background-position: center;
+        height: 48px;
+        width: 48px;
+      }
+    }
+  }
+}
+.navbar .center-collaboration {
+  text-align: center;
+}
+.container-collaboration {
+  .navbar .right.close-collaboration {
+    position: absolute;
+    right: 5px;
+  }
+}

apps/common/mobile/resources/less/material/_color-schema.less

@@ -0,0 +1,25 @@
+.color-schemes-menu {
+  cursor: pointer;
+  display: block;
+  background-color: #fff;
+  .item-content {
+    padding-left: 0;
+  }
+  .item-inner {
+    justify-content: flex-start;
+    padding-left: 16px;
+  }
+  .color-schema-block {
+    display: flex;
+  }
+  .color {
+    min-width: 26px;
+    min-height: 26px;
+    margin: 0 2px 0 0;
+    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
+  }
+  .text {
+    margin-left: 20px;
+    color: #212121;
+  }
+}

apps/documenteditor/mobile/app-dev.js

@@ -149,7 +149,8 @@ require([
             'AddTable',
             'AddShape',
             'AddImage',
-            'AddOther'
+            'AddOther',
+            'Collaboration'
         ]
     });
 
@@ -218,7 +219,8 @@ require([
         'documenteditor/mobile/app/controller/add/AddTable',
         'documenteditor/mobile/app/controller/add/AddShape',
         'documenteditor/mobile/app/controller/add/AddImage',
-        'documenteditor/mobile/app/controller/add/AddOther'
+        'documenteditor/mobile/app/controller/add/AddOther',
+        'documenteditor/mobile/app/controller/Collaboration'
     ], function() {
         window.compareVersions = true;
         app.start();

apps/documenteditor/mobile/app.js

@@ -160,7 +160,8 @@ require([
             'AddTable',
             'AddShape',
             'AddImage',
-            'AddOther'
+            'AddOther',
+            'Collaboration'
         ]
     });
 
@@ -229,7 +230,8 @@ require([
         'documenteditor/mobile/app/controller/add/AddTable',
         'documenteditor/mobile/app/controller/add/AddShape',
         'documenteditor/mobile/app/controller/add/AddImage',
-        'documenteditor/mobile/app/controller/add/AddOther'
+        'documenteditor/mobile/app/controller/add/AddOther',
+        'documenteditor/mobile/app/controller/Collaboration'
     ], function() {
         app.start();
     });

apps/documenteditor/mobile/app/controller/Collaboration.js

@@ -0,0 +1,594 @@
+/*
+ *
+ * (c) Copyright Ascensio System SIA 2010-2019
+ *
+ * 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 20A-12 Ernesta Birznieka-Upisha
+ * street, Riga, Latvia, EU, LV-1050.
+ *
+ * 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
+ *
+ */
+
+/**
+ *  Collaboration.js
+ *  Document Editor
+ *
+ *  Created by Julia Svinareva on 14/5/19
+ *  Copyright (c) 2019 Ascensio System SIA. All rights reserved.
+ *
+ */
+define([
+    'core',
+    'jquery',
+    'underscore',
+    'backbone',
+    'documenteditor/mobile/app/view/Collaboration'
+], function (core, $, _, Backbone) {
+    'use strict';
+
+    DE.Controllers.Collaboration = Backbone.Controller.extend(_.extend((function() {
+        // Private
+        var _settings = [],
+            _headerType = 1,
+             rootView,
+            displayMode = "Markup",
+            arrChangeReview = [],
+            dateChange = [],
+            _fileKey;
+
+        return {
+            models: [],
+            collections: [],
+            views: [
+                'Collaboration'
+            ],
+
+            initialize: function() {
+                var me = this;
+                me.addListeners({
+                    'Collaboration': {
+                        'page:show' : me.onPageShow
+                    }
+                });
+            },
+
+            setApi: function(api) {
+                this.api = api;
+                this.api.asc_registerCallback('asc_onShowRevisionsChange', _.bind(this.changeReview, this));
+            },
+
+            onLaunch: function () {
+                this.createView('Collaboration').render();
+            },
+
+            setMode: function(mode) {
+                this.appConfig = mode;
+                _fileKey = mode.fileKey;
+                return this;
+            },
+
+
+            showModal: function() {
+                var me = this,
+                    isAndroid = Framework7.prototype.device.android === true,
+                    modalView,
+                    mainView = DE.getController('Editor').getView('Editor').f7View;
+
+                uiApp.closeModal();
+
+                if (Common.SharedSettings.get('phone')) {
+                    modalView = $$(uiApp.pickerModal(
+                        '<div class="picker-modal settings container-collaboration">' +
+                        '<div class="view collaboration-root-view navbar-through">' +
+                        this.getView('Collaboration').rootLayout() +
+                        '</div>' +
+                        '</div>'
+                    )).on('opened', function () {
+                        if (_.isFunction(me.api.asc_OnShowContextMenu)) {
+                            me.api.asc_OnShowContextMenu()
+                        }
+                    }).on('close', function (e) {
+                        mainView.showNavbar();
+                    }).on('closed', function () {
+                        if (_.isFunction(me.api.asc_OnHideContextMenu)) {
+                            me.api.asc_OnHideContextMenu()
+                        }
+                    });
+                    mainView.hideNavbar();
+                } else {
+                    modalView = uiApp.popover(
+                        '<div class="popover settings container-collaboration">' +
+                        '<div class="popover-angle"></div>' +
+                        '<div class="popover-inner">' +
+                        '<div class="content-block">' +
+                        '<div class="view popover-view collaboration-root-view navbar-through">' +
+                        this.getView('Collaboration').rootLayout() +
+                        '</div>' +
+                        '</div>' +
+                        '</div>' +
+                        '</div>',
+                        $$('#toolbar-collaboration')
+                    );
+                }
+
+                if (Framework7.prototype.device.android === true) {
+                    $$('.view.collaboration-root-view.navbar-through').removeClass('navbar-through').addClass('navbar-fixed');
+                    $$('.view.collaboration-root-view .navbar').prependTo('.view.collaboration-root-view > .pages > .page');
+                }
+
+                rootView = uiApp.addView('.collaboration-root-view', {
+                    dynamicNavbar: true,
+                    domCache: true
+                });
+
+                Common.NotificationCenter.trigger('collaborationcontainer:show');
+                this.onPageShow(this.getView('Collaboration'));
+
+                DE.getController('Toolbar').getView('Toolbar').hideSearch();
+            },
+
+            rootView : function() {
+                return rootView;
+            },
+
+            onPageShow: function(view, pageId) {
+                var me = this;
+
+                if ('#reviewing-settings-view' == pageId) {
+                    me.initReviewingSettingsView();
+                    Common.Utils.addScrollIfNeed('.page[data-page=reviewing-settings-view]', '.page[data-page=reviewing-settings-view] .page-content');
+                } else if ('#display-mode-view' == pageId) {
+                    me.initDisplayMode();
+                    Common.Utils.addScrollIfNeed('.page[data-page=display-mode-view]', '.page[data-page=display-mode-view] .page-content');
+                } else if('#change-view' == pageId) {
+                    me.initChange();
+                    Common.Utils.addScrollIfNeed('.page[data-page=change-view]', '.page[data-page=change-view] .page-content');
+                } else {
+                    if(!this.appConfig.canReview) {
+                        $('#reviewing-settings').hide();
+                    }
+                }
+            },
+
+            initReviewingSettingsView: function () {
+                var me = this;
+                $('#settings-review input:checkbox').attr('checked', this.appConfig.isReviewOnly || Common.localStorage.getBool("de-mobile-track-changes-" + (_fileKey || '')));
+                $('#settings-review input:checkbox').single('change', _.bind(me.onTrackChanges, me));
+                $('#settings-accept-all').single('click', _.bind(me.onAcceptAllClick, me));
+                $('#settings-reject-all').single('click', _.bind(me.onRejectAllClick, me));
+                if(this.appConfig.isReviewOnly || displayMode == "Final" || displayMode == "Original" ) {
+                    $('#settings-accept-all').addClass('disabled');
+                    $('#settings-reject-all').addClass('disabled');
+                    $('#settings-review').addClass('disabled');
+                } else {
+                    $('#settings-accept-all').removeClass('disabled');
+                    $('#settings-reject-all').removeClass('disabled');
+                    $('#settings-review').removeClass('disabled');
+                }
+            },
+
+            onTrackChanges: function(e) {
+                var $checkbox = $(e.currentTarget),
+                    state = $checkbox.is(':checked');
+                if ( this.appConfig.isReviewOnly ) {
+                    $checkbox.attr('checked', true);
+                } else {
+                    this.api.asc_SetTrackRevisions(state);
+                    Common.localStorage.setItem("de-mobile-track-changes-" + (_fileKey || ''), state ? 1 : 0);
+                }
+            },
+
+            onAcceptAllClick: function() {
+                if (this.api) {
+                   this.api.asc_AcceptAllChanges();
+                }
+            },
+
+            onRejectAllClick: function() {
+                if (this.api) {
+                    this.api.asc_RejectAllChanges();
+                }
+            },
+
+            initDisplayMode: function() {
+                var me = this;
+                $('input:radio').single('change', _.bind(me.onReviewViewClick, me));
+                var value = displayMode;
+                if (value == null || value === "Markup") {
+                    $('input[value="Markup"]').attr('checked', true);
+                } else if (value === 'Final') {
+                    $('input[value="Final"]').attr('checked', true);
+                } else if (value === 'Original') {
+                    $('input[value="Original"]').attr('checked', true);
+                }
+            },
+
+            getDisplayMode: function() {
+                return displayMode;
+            },
+
+            onReviewViewClick: function(event) {
+                var value = $(event.currentTarget).val();
+                this.turnDisplayMode(value);
+            },
+
+            turnDisplayMode: function(value) {
+                displayMode = value;
+                if (this.api) {
+                    if (value === 'Final')
+                        this.api.asc_BeginViewModeInReview(true);
+
+                    else if (value === 'Original')
+                        this.api.asc_BeginViewModeInReview(false);
+                    else
+                        this.api.asc_EndViewModeInReview();
+                }
+                this.initReviewingSettingsView();
+                DE.getController('Toolbar').setDisplayMode(value);
+            },
+
+
+            initChange: function() {
+                if(arrChangeReview.length == 0) {
+                    this.api.asc_GetNextRevisionsChange();
+                }
+                if(arrChangeReview.length == 0) {
+                    $('#current-change').css('display','none');
+                } else {
+                    $('#current-change #date-change').html(arrChangeReview[0].date);
+                    $('#current-change #user-name').html(arrChangeReview[0].user);
+                    $('#current-change #text-change').html(arrChangeReview[0].changetext);
+                }
+                $('#btn-prev-change').single('click', _.bind(this.onPrevChange, this));
+                $('#btn-next-change').single('click', _.bind(this.onNextChange, this));
+                $('#btn-accept-change').single('click', _.bind(this.onAcceptCurrentChange, this));
+                $('#btn-reject-change').single('click', _.bind(this.onRejectCurrentChange, this));
+                if(this.appConfig.isReviewOnly) {
+                    $('#btn-accept-change').remove();
+                    $('#btn-reject-change').remove();
+                    $('.accept-reject').html('<div id="btn-delete-change"><i class="icon icon-review"></i></div>');
+                    $('#btn-delete-change').single('click', _.bind(this.onDeleteChange, this));
+                }
+                if(displayMode == "Final" || displayMode == "Original") {
+                    $('#btn-accept-change').addClass('disabled');
+                    $('#btn-reject-change').addClass('disabled');
+                    $('#btn-prev-change').addClass('disabled');
+                    $('#btn-next-change').addClass('disabled');
+                }
+
+            },
+
+            onPrevChange: function() {
+                this.api.asc_GetPrevRevisionsChange();
+            },
+
+            onNextChange: function() {
+                this.api.asc_GetNextRevisionsChange();
+            },
+
+            onAcceptCurrentChange: function() {
+                if (this.api) {
+                    this.api.asc_AcceptChanges(dateChange[0]);
+                }
+                this.api.asc_GetNextRevisionsChange();
+            },
+
+            onRejectCurrentChange: function() {
+                if (this.api) {
+                    this.api.asc_RejectChanges(dateChange[0]);
+                }
+                this.api.asc_GetNextRevisionsChange();
+            },
+
+            updateInfoChange: function() {
+                if($("[data-page=change-view]").length > 0) {
+                    if (arrChangeReview.length == 0) {
+                        $('#current-change #date-change').empty();
+                        $('#current-change #user-name').empty();
+                        $('#current-change #text-change').empty();
+                        $('#current-change').css('display', 'none');
+                    } else {
+                        $('#current-change').css('display', 'block');
+                        this.initChange();
+                    }
+                }
+            },
+
+            changeReview: function (data) {
+                if (data && data.length>0) {
+                    var me = this, arr = [];
+                    _.each(data, function (item) {
+                        var changetext = '', proptext = '',
+                            value = item.get_Value(),
+                            settings = false;
+                        switch (item.get_Type()) {
+                            case Asc.c_oAscRevisionsChangeType.TextAdd:
+                                changetext = me.textInserted;
+                                if (typeof value == 'object') {
+                                    _.each(value, function (obj) {
+                                        if (typeof obj === 'string')
+                                            changetext += (' ' + Common.Utils.String.htmlEncode(obj));
+                                        else {
+                                            switch (obj) {
+                                                case 0:
+                                                    changetext += (' &lt;' + me.textImage + '&gt;');
+                                                    break;
+                                                case 1:
+                                                    changetext += (' &lt;' + me.textShape + '&gt;');
+                                                    break;
+                                                case 2:
+                                                    changetext += (' &lt;' + me.textChart + '&gt;');
+                                                    break;
+                                                case 3:
+                                                    changetext += (' &lt;' + me.textEquation + '&gt;');
+                                                    break;
+                                            }
+                                        }
+                                    })
+                                } else if (typeof value === 'string') {
+                                    changetext += (' ' + Common.Utils.String.htmlEncode(value));
+                                }
+                                break;
+                            case Asc.c_oAscRevisionsChangeType.TextRem:
+                                changetext = me.textDeleted;
+                                if (typeof value == 'object') {
+                                    _.each(value, function (obj) {
+                                        if (typeof obj === 'string')
+                                            changetext += (' ' + Common.Utils.String.htmlEncode(obj));
+                                        else {
+                                            switch (obj) {
+                                                case 0:
+                                                    changetext += (' &lt;' + me.textImage + '&gt;');
+                                                    break;
+                                                case 1:
+                                                    changetext += (' &lt;' + me.textShape + '&gt;');
+                                                    break;
+                                                case 2:
+                                                    changetext += (' &lt;' + me.textChart + '&gt;');
+                                                    break;
+                                                case 3:
+                                                    changetext += (' &lt;' + me.textEquation + '&gt;');
+                                                    break;
+                                            }
+                                        }
+                                    })
+                                } else if (typeof value === 'string') {
+                                    changetext += (' ' + Common.Utils.String.htmlEncode(value));
+                                }
+                                break;
+                            case Asc.c_oAscRevisionsChangeType.ParaAdd:
+                                changetext = me.textParaInserted;
+                                break;
+                            case Asc.c_oAscRevisionsChangeType.ParaRem:
+                                changetext = me.textParaDeleted;
+                                break;
+                            case Asc.c_oAscRevisionsChangeType.TextPr:
+                                changetext = '<b>' + me.textFormatted;
+                                if (value.Get_Bold() !== undefined)
+                                    proptext += ((value.Get_Bold() ? '' : me.textNot) + me.textBold + ', ');
+                                if (value.Get_Italic() !== undefined)
+                                    proptext += ((value.Get_Italic() ? '' : me.textNot) + me.textItalic + ', ');
+                                if (value.Get_Underline() !== undefined)
+                                    proptext += ((value.Get_Underline() ? '' : me.textNot) + me.textUnderline + ', ');
+                                if (value.Get_Strikeout() !== undefined)
+                                    proptext += ((value.Get_Strikeout() ? '' : me.textNot) + me.textStrikeout + ', ');
+                                if (value.Get_DStrikeout() !== undefined)
+                                    proptext += ((value.Get_DStrikeout() ? '' : me.textNot) + me.textDStrikeout + ', ');
+                                if (value.Get_Caps() !== undefined)
+                                    proptext += ((value.Get_Caps() ? '' : me.textNot) + me.textCaps + ', ');
+                                if (value.Get_SmallCaps() !== undefined)
+                                    proptext += ((value.Get_SmallCaps() ? '' : me.textNot) + me.textSmallCaps + ', ');
+                                if (value.Get_VertAlign() !== undefined)
+                                    proptext += (((value.Get_VertAlign() == 1) ? me.textSuperScript : ((value.Get_VertAlign() == 2) ? me.textSubScript : me.textBaseline)) + ', ');
+                                if (value.Get_Color() !== undefined)
+                                    proptext += (me.textColor + ', ');
+                                if (value.Get_Highlight() !== undefined)
+                                    proptext += (me.textHighlight + ', ');
+                                if (value.Get_Shd() !== undefined)
+                                    proptext += (me.textShd + ', ');
+                                if (value.Get_FontFamily() !== undefined)
+                                    proptext += (value.Get_FontFamily() + ', ');
+                                if (value.Get_FontSize() !== undefined)
+                                    proptext += (value.Get_FontSize() + ', ');
+                                if (value.Get_Spacing() !== undefined)
+                                    proptext += (me.textSpacing + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_Spacing()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
+                                if (value.Get_Position() !== undefined)
+                                    proptext += (me.textPosition + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_Position()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
+                                if (value.Get_Lang() !== undefined)
+                                    proptext += (Common.util.LanguageInfo.getLocalLanguageName(value.Get_Lang())[1] + ', ');
+
+                                if (!_.isEmpty(proptext)) {
+                                    changetext += ': ';
+                                    proptext = proptext.substring(0, proptext.length - 2);
+                                }
+                                changetext += '</b>';
+                                changetext += proptext;
+                                break;
+                            case Asc.c_oAscRevisionsChangeType.ParaPr:
+                                changetext = '<b>' + me.textParaFormatted;
+                                if (value.Get_ContextualSpacing())
+                                    proptext += ((value.Get_ContextualSpacing() ? me.textContextual : me.textNoContextual) + ', ');
+                                if (value.Get_IndLeft() !== undefined)
+                                    proptext += (me.textIndentLeft + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_IndLeft()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
+                                if (value.Get_IndRight() !== undefined)
+                                    proptext += (me.textIndentRight + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_IndRight()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
+                                if (value.Get_IndFirstLine() !== undefined)
+                                    proptext += (me.textFirstLine + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_IndFirstLine()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
+                                if (value.Get_Jc() !== undefined) {
+                                    switch (value.Get_Jc()) {
+                                        case 0:
+                                            proptext += (me.textRight + ', ');
+                                            break;
+                                        case 1:
+                                            proptext += (me.textLeft + ', ');
+                                            break;
+                                        case 2:
+                                            proptext += (me.textCenter + ', ');
+                                            break;
+                                        case 3:
+                                            proptext += (me.textJustify + ', ');
+                                            break;
+
+                                    }
+                                }
+                                if (value.Get_KeepLines() !== undefined)
+                                    proptext += ((value.Get_KeepLines() ? me.textKeepLines : me.textNoKeepLines) + ', ');
+                                if (value.Get_KeepNext())
+                                    proptext += ((value.Get_KeepNext() ? me.textKeepNext : me.textNoKeepNext) + ', ');
+                                if (value.Get_PageBreakBefore())
+                                    proptext += ((value.Get_PageBreakBefore() ? me.textBreakBefore : me.textNoBreakBefore) + ', ');
+                                if (value.Get_SpacingLineRule() !== undefined && value.Get_SpacingLine() !== undefined) {
+                                    proptext += me.textLineSpacing;
+                                    proptext += (((value.Get_SpacingLineRule() == c_paragraphLinerule.LINERULE_LEAST) ? me.textAtLeast : ((value.Get_SpacingLineRule() == c_paragraphLinerule.LINERULE_AUTO) ? me.textMultiple : me.textExact)) + ' ');
+                                    proptext += (((value.Get_SpacingLineRule() == c_paragraphLinerule.LINERULE_AUTO) ? value.Get_SpacingLine() : Common.Utils.Metric.fnRecalcFromMM(value.Get_SpacingLine()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName()) + ', ');
+                                }
+                                if (value.Get_SpacingBeforeAutoSpacing())
+                                    proptext += (me.textSpacingBefore + ' ' + me.textAuto + ', ');
+                                else if (value.Get_SpacingBefore() !== undefined)
+                                    proptext += (me.textSpacingBefore + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_SpacingBefore()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
+                                if (value.Get_SpacingAfterAutoSpacing())
+                                    proptext += (me.textSpacingAfter + ' ' + me.textAuto + ', ');
+                                else if (value.Get_SpacingAfter() !== undefined)
+                                    proptext += (me.textSpacingAfter + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_SpacingAfter()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
+                                if (value.Get_WidowControl())
+                                    proptext += ((value.Get_WidowControl() ? me.textWidow : me.textNoWidow) + ', ');
+                                if (value.Get_Tabs() !== undefined)
+                                    proptext += proptext += (me.textTabs + ', ');
+                                if (value.Get_NumPr() !== undefined)
+                                    proptext += proptext += (me.textNum + ', ');
+                                if (value.Get_PStyle() !== undefined) {
+                                    var style = me.api.asc_GetStyleNameById(value.Get_PStyle());
+                                    if (!_.isEmpty(style)) proptext += (style + ', ');
+                                }
+
+                                if (!_.isEmpty(proptext)) {
+                                    changetext += ': ';
+                                    proptext = proptext.substring(0, proptext.length - 2);
+                                }
+                                changetext += '</b>';
+                                changetext += proptext;
+                                break;
+
+                        }
+                        var date = (item.get_DateTime() == '') ? new Date() : new Date(item.get_DateTime()),
+                            user = item.get_UserName();
+                        date = me.dateToLocaleTimeString(date);
+
+
+                        arr.push({date: date, user: user, changetext: changetext});
+                    });
+                    arrChangeReview = arr;
+                    dateChange = data;
+                } else {
+                    arrChangeReview = [];
+                    dateChange = [];
+                }
+                this.updateInfoChange();
+            },
+
+            dateToLocaleTimeString: function (date) {
+                function format(date) {
+                    var strTime,
+                        hours = date.getHours(),
+                        minutes = date.getMinutes(),
+                        ampm = hours >= 12 ? 'pm' : 'am';
+
+                    hours = hours % 12;
+                    hours = hours ? hours : 12; // the hour '0' should be '12'
+                    minutes = minutes < 10 ? '0'+minutes : minutes;
+                    strTime = hours + ':' + minutes + ' ' + ampm;
+
+                    return strTime;
+                }
+
+                // MM/dd/yyyy hh:mm AM
+                return (date.getMonth() + 1) + '/' + (date.getDate()) + '/' + date.getFullYear() + ' ' + format(date);
+            },
+
+            onDeleteChange: function() {
+                if (this.api) {
+                    this.api.asc_RejectChanges(dateChange[0]);
+                }
+            },
+
+
+
+
+            textInserted: '<b>Inserted:</b>',
+            textDeleted: '<b>Deleted:</b>',
+            textParaInserted: '<b>Paragraph Inserted</b> ',
+            textParaDeleted: '<b>Paragraph Deleted</b> ',
+            textFormatted: 'Formatted',
+            textParaFormatted: '<b>Paragraph Formatted</b>',
+            textNot: 'Not ',
+            textBold: 'Bold',
+            textItalic: 'Italic',
+            textStrikeout: 'Strikeout',
+            textUnderline: 'Underline',
+            textColor: 'Font color',
+            textBaseline: 'Baseline',
+            textSuperScript: 'Superscript',
+            textSubScript: 'Subscript',
+            textHighlight: 'Highlight color',
+            textSpacing: 'Spacing',
+            textDStrikeout: 'Double strikeout',
+            textCaps: 'All caps',
+            textSmallCaps: 'Small caps',
+            textPosition: 'Position',
+            textShd: 'Background color',
+            textContextual: 'Don\'t add interval between paragraphs of the same style',
+            textNoContextual: 'Add interval between paragraphs of the same style',
+            textIndentLeft: 'Indent left',
+            textIndentRight: 'Indent right',
+            textFirstLine: 'First line',
+            textRight: 'Align right',
+            textLeft: 'Align left',
+            textCenter: 'Align center',
+            textJustify: 'Align justify',
+            textBreakBefore: 'Page break before',
+            textKeepNext: 'Keep with next',
+            textKeepLines: 'Keep lines together',
+            textNoBreakBefore: 'No page break before',
+            textNoKeepNext: 'Don\'t keep with next',
+            textNoKeepLines: 'Don\'t keep lines together',
+            textLineSpacing: 'Line Spacing: ',
+            textMultiple: 'multiple',
+            textAtLeast: 'at least',
+            textExact: 'exactly',
+            textSpacingBefore: 'Spacing before',
+            textSpacingAfter: 'Spacing after',
+            textAuto: 'auto',
+            textWidow: 'Widow control',
+            textNoWidow: 'No widow control',
+            textTabs: 'Change tabs',
+            textNum: 'Change numbering',
+            textEquation: 'Equation',
+            textImage: 'Image',
+            textChart: 'Chart',
+            textShape: 'Shape'
+
+        }
+    })(), DE.Controllers.Collaboration || {}))
+});

apps/documenteditor/mobile/app/controller/DocumentHolder.js

@@ -123,8 +123,15 @@ define([
                     me.api.Copy();
                 } else if ('paste' == eventName) {
                     me.api.Paste();
+                } else if ('merge' == eventName) {
+                    me.api.MergeCells();
+                } else if ('split' == eventName) {
+                    _view.hideMenu();
+                    me.showSplitModal();
                 } else if ('delete' == eventName) {
                     me.api.asc_Remove();
+                } else if('deletetable' == eventName) {
+                    me.api.remTable();
                 } else if ('edit' == eventName) {
                     _view.hideMenu();
 
@@ -141,26 +148,10 @@ define([
                             return true;
                         }
                     });
-                } else if ('accept' == eventName) {
-                    me.api.asc_GetNextRevisionsChange();
-                    me.api.asc_AcceptChanges();
-                } else if ('acceptall' == eventName) {
-                    me.api.asc_AcceptAllChanges();
-                } else if ('reject' == eventName) {
-                    me.api.asc_GetNextRevisionsChange();
-                    me.api.asc_RejectChanges();
-                } else if ('rejectall' == eventName) {
-                    me.api.asc_RejectAllChanges();
                 } else if ('review' == eventName) {
-                    if (Common.SharedSettings.get('phone')) {
+                    var getCollaboration = DE.getController('Collaboration');
-                        _actionSheets = me._initReviewMenu();
+                    getCollaboration.showModal();
-                        me.onContextMenuClick(view, 'showActionSheet');
+                    getCollaboration.getView('Collaboration').showPage('#reviewing-settings-view', false);
-                    } else {
-                        _.delay(function () {
-                            _view.showMenu(me._initReviewMenu(), _menuPos[0] || 0, _menuPos[1] || 0);
-                            _timer = (new Date).getTime();
-                        }, 100);
-                    }
                 } else if ('showActionSheet' == eventName && _actionSheets.length > 0) {
                     _.delay(function () {
                         _.each(_actionSheets, function (action) {
@@ -182,6 +173,55 @@ define([
                 _view.hideMenu();
             },
 
+            showSplitModal: function() {
+                var me = this,
+                    picker;
+                uiApp.modal({
+                    title   : me.menuSplit,
+                    text: '',
+                    afterText:
+                        '<div class="content-block">' +
+                        '<div class="row no-gutter" style="text-align: center;">' +
+                        '<div class="col-50 size-columns">' + me.textColumns + '</div>' +
+                        '<div class="col-50 size-rows">' + me.textRows + '</div>' +
+                        '</div>' +
+                        '<div id="picker-split-size"></div>' +
+                        '</div>',
+                    buttons: [
+                        {
+                            text: me.textCancel
+                        },
+                        {
+                            text: 'OK',
+                            bold: true,
+                            onClick: function () {
+                                var size = picker.value;
+                                if (me.api) {
+                                    me.api.SplitCell(parseInt(size[0]), parseInt(size[1]));
+                                }
+                            }
+                        }
+                    ]
+                });
+
+                picker = uiApp.picker({
+                    container: '#picker-split-size',
+                    toolbar: false,
+                    rotateEffect: true,
+                    value: [3, 3],
+                    cols: [{
+                        textAlign: 'center',
+                        width: '100%',
+                        values: [1,2,3,4,5,6,7,8,9,10]
+                    }, {
+                        textAlign: 'center',
+                        width: '100%',
+                        values: [1,2,3,4,5,6,7,8,9,10]
+                    }]
+                });
+
+            },
+
             // API Handlers
 
             onEditorResize: function(cmp) {
@@ -351,15 +391,25 @@ define([
                     isImage = false,
                     isChart = false,
                     isShape = false,
-                    isLink = false;
+                    isLink = false,
+                    lockedText = false,
+                    lockedTable = false,
+                    lockedImage = false,
+                    lockedHeader = false;
 
                 _.each(stack, function (item) {
                     var objectType = item.get_ObjectType(),
                         objectValue = item.get_ObjectValue();
 
+                    if (objectType == Asc.c_oAscTypeSelectElement.Header) {
+                        lockedHeader = objectValue.get_Locked();
+                    }
+
                     if (objectType == Asc.c_oAscTypeSelectElement.Text) {
                         isText = true;
+                        lockedText = objectValue.get_Locked();
                     } else if (objectType == Asc.c_oAscTypeSelectElement.Image) {
+                        lockedImage = objectValue.get_Locked();
                         if (objectValue && objectValue.get_ChartProperties()) {
                             isChart = true;
                         } else if (objectType && objectValue.get_ShapeProperties()) {
@@ -369,22 +419,20 @@ define([
                         }
                     } else if (objectType == Asc.c_oAscTypeSelectElement.Table) {
                         isTable = true;
+                        lockedTable = objectValue.get_Locked();
                     } else if (objectType == Asc.c_oAscTypeSelectElement.Hyperlink) {
                         isLink = true;
                     }
                 });
 
                 if (stack.length > 0) {
-                    var topObject = _.find(stack.reverse(), function(obj){ return obj.get_ObjectType() != Asc.c_oAscTypeSelectElement.SpellCheck; }),
-                        topObjectValue = topObject.get_ObjectValue(),
-                        objectLocked = _.isFunction(topObjectValue.get_Locked) ? topObjectValue.get_Locked() : false;
 
                     var swapItems = function(items, indexBefore, indexAfter) {
                         items[indexAfter] = items.splice(indexBefore, 1, items[indexAfter])[0];
                     };
 
-                    if (!objectLocked && _isEdit && !me.isDisconnected) {
+                    if (_isEdit && !me.isDisconnected) {
-                        if (canCopy) {
+                        if (!lockedText && !lockedTable && !lockedImage && !lockedHeader && canCopy) {
                             menuItems.push({
                                 caption: me.menuCut,
                                 event: 'cut'
@@ -394,22 +442,49 @@ define([
                             swapItems(menuItems, 0, 1);
                         }
 
+                        if (!lockedText && !lockedTable && !lockedImage && !lockedHeader) {
                             menuItems.push({
                                 caption: me.menuPaste,
                                 event: 'paste'
                             });
+                        }
 
+                        if(isTable && me.api.CheckBeforeMergeCells() && !lockedTable && !lockedHeader) {
+                            menuItems.push({
+                                caption: me.menuMerge,
+                                event: 'merge'
+                            });
+                        }
+
+                        if(isTable && me.api.CheckBeforeSplitCells() && !lockedTable && !lockedHeader) {
+                            menuItems.push({
+                                caption: me.menuSplit,
+                                event: 'split'
+                            });
+                        }
+
+                        if(!lockedText && !lockedTable && !lockedImage && !lockedHeader) {
                             menuItems.push({
                                 caption: me.menuDelete,
                                 event: 'delete'
                             });
+                        }
 
+                        if(isTable && !lockedTable && !lockedText && !lockedHeader) {
+                            menuItems.push({
+                                caption: me.menuDeleteTable,
+                                event: 'deletetable'
+                            });
+                        }
+
+                        if(!lockedText && !lockedTable && !lockedImage && !lockedHeader){
                             menuItems.push({
                                 caption: me.menuEdit,
                                 event: 'edit'
                             });
+                        }
 
-                        if (!_.isEmpty(me.api.can_AddHyperlink())) {
+                        if (!_.isEmpty(me.api.can_AddHyperlink()) && !lockedHeader) {
                             menuItems.push({
                                 caption: me.menuAddLink,
                                 event: 'addlink'
@@ -445,38 +520,14 @@ define([
                 return menuItems;
             },
 
-            _initReviewMenu: function (stack) {
-                var me = this,
-                    menuItems = [];
-
-                menuItems.push({
-                    caption: me.menuAccept,
-                    event: 'accept'
-                });
-
-                menuItems.push({
-                    caption: me.menuReject,
-                    event: 'reject'
-                });
-
-                menuItems.push({
-                    caption: me.menuAcceptAll,
-                    event: 'acceptall'
-                });
-
-                menuItems.push({
-                    caption: me.menuRejectAll,
-                    event: 'rejectall'
-                });
-
-                return menuItems;
-            },
-
             onCoAuthoringDisconnect: function() {
                 this.isDisconnected = true;
             },
 
             textGuest: 'Guest',
+            textCancel: 'Cancel',
+            textColumns: 'Columns',
+            textRows: 'Rows',
             menuCut: 'Cut',
             menuCopy: 'Copy',
             menuPaste: 'Paste',
@@ -487,10 +538,9 @@ define([
             menuMore: 'More',
             sheetCancel: 'Cancel',
             menuReview: 'Review',
-            menuAccept: 'Accept',
+            menuMerge: 'Merge Cells',
-            menuAcceptAll: 'Accept All',
+            menuSplit: 'Split Cell',
-            menuReject: 'Reject',
+            menuDeleteTable: 'Delete Table'
-            menuRejectAll: 'Reject All'
         }
     })(), DE.Controllers.DocumentHolder || {}))
 });

apps/documenteditor/mobile/app/controller/Main.js

@@ -541,6 +541,12 @@ define([
 
                 me.api.SetTextBoxInputMode(Common.localStorage.getBool("de-settings-inputmode"));
 
+                value = Common.localStorage.getItem("de-mobile-no-characters");
+                me.api.put_ShowParaMarks((value!==null) ? eval(value) : false);
+
+                value = Common.localStorage.getItem("de-mobile-hidden-borders");
+                me.api.put_ShowTableEmptyLine((value!==null) ? eval(value) : true);
+
                 /** coauthoring begin **/
                 if (me.appOptions.isEdit && me.appOptions.canLicense && !me.appOptions.isOffline && me.appOptions.canCoAuthoring) {
                     // Force ON fast co-authoring mode
@@ -761,11 +767,11 @@ define([
             applyModeEditorElements: function() {
                 if (this.appOptions.isEdit) {
                     var me = this;
-//
+
-//                    var value = Common.localStorage.getItem('de-settings-unit');
+                   var value = Common.localStorage.getItem('de-mobile-settings-unit');
-//                    value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
+                   value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
-//                    Common.Utils.Metric.setCurrentMetric(value);
+                    Common.Utils.Metric.setCurrentMetric(value);
-//                    me.api.asc_SetDocumentUnits((value==Common.Utils.Metric.c_MetricUnits.inch) ? Asc.c_oAscDocumentUnits.Inch : ((value==Common.Utils.Metric.c_MetricUnits.pt) ? Asc.c_oAscDocumentUnits.Point : Asc.c_oAscDocumentUnits.Millimeter));
+                    me.api.asc_SetDocumentUnits((value==Common.Utils.Metric.c_MetricUnits.inch) ? Asc.c_oAscDocumentUnits.Inch : ((value==Common.Utils.Metric.c_MetricUnits.pt) ? Asc.c_oAscDocumentUnits.Point : Asc.c_oAscDocumentUnits.Millimeter));
 
                     me.api.asc_registerCallback('asc_onDocumentModifiedChanged', _.bind(me.onDocumentModifiedChanged, me));
                     me.api.asc_registerCallback('asc_onDocumentCanSaveChanged',  _.bind(me.onDocumentCanSaveChanged, me));

apps/documenteditor/mobile/app/controller/Settings.js

@@ -46,7 +46,8 @@ define([
     'jquery',
     'underscore',
     'backbone',
-    'documenteditor/mobile/app/view/Settings'
+    'documenteditor/mobile/app/view/Settings',
+    'documenteditor/mobile/app/controller/Collaboration'
 ], function (core, $, _, Backbone) {
     'use strict';
 
@@ -82,7 +83,9 @@ define([
             _licInfo,
             _canReview = false,
             _isReviewOnly = false,
-            _fileKey;
+            _fileKey,
+            templateInsert,
+            _metricText = Common.Utils.Metric.getCurrentMetricName();
 
         var mm2Cm = function(mm) {
             return parseFloat((mm/10.).toFixed(2));
@@ -114,7 +117,7 @@ define([
                     }
                 });
 
-                uiApp.onPageAfterBack('settings-document-view', function (page) {
+                uiApp.onPageAfterBack('margin-view', function (page) {
                     me.applyPageMarginsIfNeed()
                 });
             },
@@ -130,6 +133,7 @@ define([
                 me.api.asc_registerCallback('asc_onDocumentName',       _.bind(me.onApiDocumentName, me));
                 me.api.asc_registerCallback('asc_onDocSize',            _.bind(me.onApiPageSize, me));
                 me.api.asc_registerCallback('asc_onPageOrient',         _.bind(me.onApiPageOrient, me));
+                me.api.asc_registerCallback('asc_onSendThemeColorSchemes', _.bind(me.onSendThemeColorSchemes, me));
             },
 
             onLaunch: function () {
@@ -221,34 +225,63 @@ define([
                     // About
                     me.setLicInfo(_licInfo);
                     Common.Utils.addScrollIfNeed('.page[data-page=settings-about-view]', '.page[data-page=settings-about-view] .page-content');
+                } else if ('#settings-advanced-view' == pageId) {
+                    me.initPageAdvancedSettings();
+                    $('#settings-spellcheck input:checkbox').attr('checked', Common.localStorage.getBool("de-mobile-spellcheck", false));
+                    $('#settings-spellcheck input:checkbox').single('change',   _.bind(me.onSpellcheck, me));
+                    $('#settings-no-characters input:checkbox').attr('checked', (Common.localStorage.getItem("de-mobile-no-characters") == 'true') ? true : false);
+                    $('#settings-no-characters input:checkbox').single('change',   _.bind(me.onNoCharacters, me));
+                    $('#settings-hidden-borders input:checkbox').attr('checked', (Common.localStorage.getItem("de-mobile-hidden-borders") == 'true') ? true : false);
+                    $('#settings-hidden-borders input:checkbox').single('change',   _.bind(me.onShowTableEmptyLine, me));
+                    $('#settings-orthography').single('click',                  _.bind(me.onOrthographyCheck, me));
+                    Common.Utils.addScrollIfNeed('.page[data-page=settings-advanced-view]', '.page[data-page=settings-advanced-view] .page-content');
+                } else if ('#color-schemes-view' == pageId) {
+                    me.initPageColorSchemes();
+                    Common.Utils.addScrollIfNeed('.page[data-page=color-schemes-view]', '.page[data-page=color-schemes-view] .page-content');
+                } else if ('#margins-view' == pageId) {
+                    me.initPageMargin();
+                    Common.Utils.addScrollIfNeed('.page[data-page=margin-view]', '.page[data-page=margin-view] .page-content');
                 } else {
                     $('#settings-readermode input:checkbox').attr('checked', Common.SharedSettings.get('readerMode'));
-                    $('#settings-spellcheck input:checkbox').attr('checked', Common.localStorage.getBool("de-mobile-spellcheck", false));
-                    $('#settings-review input:checkbox').attr('checked', _isReviewOnly || Common.localStorage.getBool("de-mobile-track-changes-" + (_fileKey || '')));
                     $('#settings-search').single('click',                       _.bind(me.onSearch, me));
                     $('#settings-readermode input:checkbox').single('change',   _.bind(me.onReaderMode, me));
-                    $('#settings-spellcheck input:checkbox').single('change',   _.bind(me.onSpellcheck, me));
-                    $('#settings-orthography').single('click',                  _.bind(me.onOrthographyCheck, me));
-                    $('#settings-review input:checkbox').single('change',       _.bind(me.onTrackChanges, me));
                     $('#settings-help').single('click',                         _.bind(me.onShowHelp, me));
                     $('#settings-download').single('click',                     _.bind(me.onDownloadOrigin, me));
                     $('#settings-print').single('click',                        _.bind(me.onPrint, me));
+                    $('#settings-collaboration').single('click',                _.bind(me.clickCollaboration, me));
+                    var _stateDisplayMode = DE.getController('Collaboration').getDisplayMode();
+                    if(_stateDisplayMode == "Final" || _stateDisplayMode == "Original") {
+                        $('#settings-document').addClass('disabled');
+                    }
+                    if(!_canReview) {
+                        $('#settings-collaboration').hide();
+                    }
                 }
             },
 
-            initPageDocumentSettings: function () {
+            clickCollaboration: function() {
+                DE.getController('Collaboration').showModal();
+            },
+
+            onNoCharacters: function(e) {
+                var me = this;
+                var $checkbox = $(e.currentTarget),
+                    state = $checkbox.is(':checked');
+                Common.localStorage.setItem("de-mobile-no-characters", state);
+                me.api.put_ShowParaMarks(state);
+            },
+
+            onShowTableEmptyLine: function(e) {
                 var me = this,
-                    $pageOrientation = $('.page[data-page=settings-document-view] input:radio[name=doc-orientation]'),
+                    $checkbox = $(e.currentTarget),
-                    $pageSize = $('#settings-document-format'),
+                    state = $checkbox.is(':checked');
-                    txtCm = Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.cm);
+                Common.localStorage.setItem("de-mobile-hidden-borders", state);
+                me.api.put_ShowTableEmptyLine(state);
+            },
 
-                // Init orientation
+            initPageMargin: function() {
-                $pageOrientation.val([_isPortrait]);
+                var me = this;
-                $pageOrientation.single('change', _.bind(me.onOrientationChange, me));
+                _metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
-
-                // Init format
-                $pageSize.find('.item-title').text(_pageSizes[_pageSizesIndex]['caption']);
-                $pageSize.find('.item-subtitle').text(_pageSizes[_pageSizesIndex]['subtitle']);
 
                 // Init page margins
                 me.localSectionProps = me.api.asc_GetSectionProps();
@@ -257,10 +290,15 @@ define([
                     me.maxMarginsH = me.localSectionProps.get_H() - 26;
                     me.maxMarginsW = me.localSectionProps.get_W() - 127;
 
-                    $('#document-margin-top .item-after label').text(mm2Cm(me.localSectionProps.get_TopMargin()) + ' ' + txtCm);
+                    var top = parseFloat(Common.Utils.Metric.fnRecalcFromMM(me.localSectionProps.get_TopMargin()).toFixed(2)),
-                    $('#document-margin-bottom .item-after label').text(mm2Cm(me.localSectionProps.get_BottomMargin()) + ' ' + txtCm);
+                        bottom = parseFloat(Common.Utils.Metric.fnRecalcFromMM(me.localSectionProps.get_BottomMargin()).toFixed(2)),
-                    $('#document-margin-left .item-after label').text(mm2Cm(me.localSectionProps.get_LeftMargin()) + ' ' + txtCm);
+                        left = parseFloat(Common.Utils.Metric.fnRecalcFromMM(me.localSectionProps.get_LeftMargin()).toFixed(2)),
-                    $('#document-margin-right .item-after label').text(mm2Cm(me.localSectionProps.get_RightMargin()) + ' ' + txtCm);
+                        right = parseFloat(Common.Utils.Metric.fnRecalcFromMM(me.localSectionProps.get_RightMargin()).toFixed(2));
+
+                    $('#document-margin-top .item-after label').text(top + ' ' + _metricText);
+                    $('#document-margin-bottom .item-after label').text(bottom + ' ' + _metricText);
+                    $('#document-margin-left .item-after label').text(left + ' ' + _metricText);
+                    $('#document-margin-right .item-after label').text(right + ' ' + _metricText);
                 }
 
                 _.each(["top", "left", "bottom", "right"], function(align) {
@@ -268,6 +306,64 @@ define([
                 })
             },
 
+            initPageColorSchemes: function() {
+                $('#color-schemes-content').html(templateInsert);
+                $('.color-schemes-menu').on('click', _.bind(this.onColorSchemaClick, this));
+            },
+
+            onSendThemeColorSchemes: function (schemas) {
+                templateInsert = "";
+                _.each(schemas, function (schema, index) {
+                    var colors = schema.get_colors();//schema.colors;
+                    templateInsert = templateInsert + "<a class='color-schemes-menu item-link no-indicator'><input type='hidden' value='" + index + "'><div class='item-content'><div class='item-inner'><span class='color-schema-block'>";
+                    for (var j = 2; j < 7; j++) {
+                        var clr = '#' + Common.Utils.ThemeColor.getHexColor(colors[j].get_r(), colors[j].get_g(), colors[j].get_b());
+                        templateInsert =  templateInsert + "<span class='color' style='background: " + clr + ";'></span>"
+                    }
+                    templateInsert =  templateInsert + "</span><span class='text'>" + schema.get_name() + "</span></div></div></a>";
+                }, this);
+            },
+
+            onColorSchemaClick: function(event) {
+                if (this.api) {
+                    var ind = $(event.currentTarget).children('input').val();
+                    this.api.ChangeColorScheme(ind);
+                }
+            },
+
+            initPageAdvancedSettings: function() {
+                var me = this,
+                    $unitMeasurement = $('.page[data-page=settings-advanced-view] input:radio[name=unit-of-measurement]');
+                $unitMeasurement.single('change', _.bind(me.unitMeasurementChange, me));
+                var value = Common.localStorage.getItem('de-mobile-settings-unit');
+                    value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
+                $unitMeasurement.val([value]);
+                var _stateDisplayMode = DE.getController('Collaboration').getDisplayMode();
+                if(_stateDisplayMode == "Final" || _stateDisplayMode == "Original") {
+                    $('#settings-no-characters').addClass('disabled');
+                    $('#settings-hidden-borders').addClass('disabled');
+                }
+            },
+
+            initPageDocumentSettings: function () {
+                var me = this,
+                    $pageOrientation = $('.page[data-page=settings-document-view] input:radio[name=doc-orientation]'),
+                    $pageSize = $('#settings-document-format');
+
+                // Init orientation
+                $pageOrientation.val([_isPortrait]);
+                $pageOrientation.single('change', _.bind(me.onOrientationChange, me));
+
+                // Init format
+                $pageSize.find('.item-title').text(_pageSizes[_pageSizesIndex]['caption']);
+                var curMetricName = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric()),
+                    sizeW = parseFloat(Common.Utils.Metric.fnRecalcFromMM(_pageSizes[_pageSizesIndex]['value'][0]).toFixed(2)),
+                    sizeH = parseFloat(Common.Utils.Metric.fnRecalcFromMM(_pageSizes[_pageSizesIndex]['value'][1]).toFixed(2));
+
+                var pageSizeTxt = sizeW + ' ' + curMetricName + ' x ' + sizeH + ' ' + curMetricName;
+                $pageSize.find('.item-subtitle').text(pageSizeTxt);
+            },
+
             initPageInfo: function () {
                 var me = this;
 
@@ -384,17 +480,6 @@ define([
                 this.api && this.api.asc_pluginRun("asc.{B631E142-E40B-4B4C-90B9-2D00222A286E}", 0);
             },
 
-            onTrackChanges: function(e) {
-                var $checkbox = $(e.currentTarget),
-                    state = $checkbox.is(':checked');
-                if ( _isReviewOnly ) {
-                    $checkbox.attr('checked', true);
-                } else if ( _canReview ) {
-                    this.api.asc_SetTrackRevisions(state);
-                    Common.localStorage.setItem("de-mobile-track-changes-" + (_fileKey || ''), state ? 1 : 0);
-                }
-            },
-
             onShowHelp: function () {
                 window.open('{{SUPPORT_URL}}', "_blank");
                 this.hideModal();
@@ -462,12 +547,27 @@ define([
                 }, 300);
             },
 
+            unitMeasurementChange: function (e) {
+                var value = $(e.currentTarget).val();
+                value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
+                Common.Utils.Metric.setCurrentMetric(value);
+                Common.localStorage.setItem("de-mobile-settings-unit", value);
+                this.api.asc_SetDocumentUnits((value==Common.Utils.Metric.c_MetricUnits.inch) ? Asc.c_oAscDocumentUnits.Inch : ((value==Common.Utils.Metric.c_MetricUnits.pt) ? Asc.c_oAscDocumentUnits.Point : Asc.c_oAscDocumentUnits.Millimeter));
+
+            },
+
             onPageMarginsChange: function (align, e) {
                 var me = this,
                     $button = $(e.currentTarget),
-                    step = 1, // mm
+                    step,
                     txtCm = Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.cm),
                     marginValue = null;
+                if(Common.Utils.Metric.getCurrentMetric() == Common.Utils.Metric.c_MetricUnits.pt) {
+                    step = 1;
+                } else {
+                    step = 0.1;
+                }
+                step = Common.Utils.Metric.fnRecalcToMM(step);
 
                 switch (align) {
                     case 'left': marginValue = me.localSectionProps.get_LeftMargin(); break;
@@ -489,7 +589,8 @@ define([
                     case 'bottom': me.localSectionProps.put_BottomMargin(marginValue); break;
                 }
 
-                $(Common.Utils.String.format('#document-margin-{0} .item-after label', align)).text(mm2Cm(marginValue) + ' ' + txtCm);
+                var valueCurrentMetric = parseFloat(Common.Utils.Metric.fnRecalcFromMM(marginValue).toFixed(2));
+                $(Common.Utils.String.format('#document-margin-{0} .item-after label', align)).text(valueCurrentMetric + ' ' + _metricText);
 
                 me.applyPageMarginsIfNeed()
             },

apps/documenteditor/mobile/app/controller/Toolbar.js

@@ -51,7 +51,8 @@ define([
 
     DE.Controllers.Toolbar = Backbone.Controller.extend(_.extend((function() {
         // private
-        var _backUrl;
+        var _backUrl,
+            stateDisplayMode = false;
 
         return {
             models: [],
@@ -149,6 +150,12 @@ define([
                 }
             },
 
+            setDisplayMode: function(displayMode) {
+                stateDisplayMode = displayMode == "Final" || displayMode == "Original" ? true : false;
+                var selected = this.api.getSelectedElements();
+                this.onApiFocusObject(selected);
+            },
+
             onApiFocusObject: function (objects) {
                 if (this.isDisconnected) return;
 
@@ -159,7 +166,7 @@ define([
                         topObjectValue = topObject.get_ObjectValue(),
                         objectLocked = _.isFunction(topObjectValue.get_Locked) ? topObjectValue.get_Locked() : false;
 
-                    $('#toolbar-add, #toolbar-edit').toggleClass('disabled', objectLocked);
+                    $('#toolbar-add, #toolbar-edit').toggleClass('disabled', objectLocked || stateDisplayMode);
                 }
             },
 

apps/documenteditor/mobile/app/controller/edit/EditChart.js

@@ -171,7 +171,7 @@ define([
 
             initSettings: function (pageId) {
                 var me = this;
-
+                _metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
                 if (_chartObject) {
                     if (pageId == '#edit-chart-wrap') {
                         me._initWrapView();
@@ -222,6 +222,7 @@ define([
                     paletteFillColor = me.getView('EditChart').paletteFillColor,
                     paletteBorderColor = me.getView('EditChart').paletteBorderColor;
 
+
                 // Style
 
                 var type = chartProperties.getType();
@@ -232,7 +233,7 @@ define([
                 var borderSize = shapeProperties.get_stroke().get_width() * 72.0 / 25.4;
                 var borderType = shapeProperties.get_stroke().get_type();
                 $('#edit-chart-bordersize input').val([(borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.indexSizeByValue(borderSize)]);
-                $('#edit-chart-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + _metricText);
+                $('#edit-chart-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
 
                 paletteFillColor && paletteFillColor.on('select',       _.bind(me.onFillColor, me));
                 paletteBorderColor && paletteBorderColor.on('select',   _.bind(me.onBorderColor, me));
@@ -426,6 +427,7 @@ define([
                     properties = new Asc.asc_CImgProperty(),
                     paddings = new Asc.asc_CPaddings();
 
+
                 $('.chart-wrap .distance .item-after').text(value + ' ' + _metricText);
 
                 value = Common.Utils.Metric.fnRecalcToMM(parseInt(value));
@@ -475,7 +477,7 @@ define([
 
             onBorderSizeChanging: function (e) {
                 var $target = $(e.currentTarget);
-                $('#edit-chart-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + _metricText);
+                $('#edit-chart-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
             },
 
             onFillColor: function(palette, color) {

apps/documenteditor/mobile/app/controller/edit/EditImage.js

@@ -142,6 +142,8 @@ define([
             initSettings: function (pageId) {
                 var me = this;
 
+                _metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
+
                 if (_imageObject) {
                     if (pageId == '#edit-image-wrap-view') {
                         me._initWrapView();

apps/documenteditor/mobile/app/controller/edit/EditParagraph.js

@@ -129,6 +129,7 @@ define([
             initSettings: function () {
                 var me = this;
 
+                metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
                 var selectedElements = me.api.getSelectedElements();
                 if (selectedElements && _.isArray(selectedElements)) {
                     for (var i = selectedElements.length - 1; i >= 0; i--) {
@@ -143,14 +144,17 @@ define([
                     if (_paragraphProperty.get_Ind()===null || _paragraphProperty.get_Ind()===undefined) {
                         _paragraphProperty.get_Ind().put_FirstLine(0);
                     }
-                    $('#paragraph-spin-first-line .item-after label').text(_paragraphProperty.get_Ind().get_FirstLine() + ' ' + metricText);
+                    var firstLineFix = parseFloat(Common.Utils.Metric.fnRecalcFromMM(_paragraphProperty.get_Ind().get_FirstLine()).toFixed(2));
+                    $('#paragraph-spin-first-line .item-after label').text(firstLineFix + ' ' + metricText);
                 }
 
                 if (_paragraphObject) {
                     _paragraphInfo.spaceBefore = _paragraphObject.get_Spacing().get_Before() < 0 ? _paragraphObject.get_Spacing().get_Before() : Common.Utils.Metric.fnRecalcFromMM(_paragraphObject.get_Spacing().get_Before());
                     _paragraphInfo.spaceAfter  = _paragraphObject.get_Spacing().get_After() < 0 ? _paragraphObject.get_Spacing().get_After() : Common.Utils.Metric.fnRecalcFromMM(_paragraphObject.get_Spacing().get_After());
-                    $('#paragraph-distance-before .item-after label').text(_paragraphInfo.spaceBefore < 0 ? 'Auto' : _paragraphInfo.spaceBefore + ' ' + metricText);
+                    var distanceBeforeFix = parseFloat(_paragraphInfo.spaceBefore.toFixed(2));
-                    $('#paragraph-distance-after .item-after label').text(_paragraphInfo.spaceAfter < 0 ? 'Auto' : _paragraphInfo.spaceAfter + ' ' + metricText);
+                    var distanceAfterFix = parseFloat(_paragraphInfo.spaceAfter.toFixed(2));
+                    $('#paragraph-distance-before .item-after label').text(_paragraphInfo.spaceBefore < 0 ? 'Auto' : distanceBeforeFix + ' ' + metricText);
+                    $('#paragraph-distance-after .item-after label').text(_paragraphInfo.spaceAfter < 0 ? 'Auto' : distanceAfterFix + ' ' + metricText);
 
                     $('#paragraph-space input:checkbox').prop('checked', _paragraphObject.get_ContextualSpacing());
                     $('#paragraph-page-break input:checkbox').prop('checked', _paragraphObject.get_PageBreakBefore());
@@ -231,51 +235,98 @@ define([
 
             onDistanceBefore: function (e) {
                 var $button = $(e.currentTarget),
-                    distance = _paragraphInfo.spaceBefore;
+                    distance = _paragraphInfo.spaceBefore,
+                    step,
+                    maxValue;
+
+                if (Common.Utils.Metric.getCurrentMetric() == Common.Utils.Metric.c_MetricUnits.pt) {
+                    step = 1;
+                } else {
+                    step = 0.01;
+                }
+
+                maxValue = Common.Utils.Metric.fnRecalcFromMM(558.8);
 
                 if ($button.hasClass('decrement')) {
-                    distance = Math.max(-1, --distance);
+                    distance = Math.max(-1, distance - step);
                 } else {
-                    distance = Math.min(100, ++distance);
+                    distance = Math.min(maxValue, distance + step);
                 }
 
+                var distanceFix = parseFloat(distance.toFixed(2));
+
                 _paragraphInfo.spaceBefore = distance;
 
-                $('#paragraph-distance-before .item-after label').text(_paragraphInfo.spaceBefore < 0 ? 'Auto' : (_paragraphInfo.spaceBefore) + ' ' + metricText);
+                $('#paragraph-distance-before .item-after label').text(_paragraphInfo.spaceBefore < 0 ? 'Auto' : distanceFix + ' ' + metricText);
 
                 this.api.put_LineSpacingBeforeAfter(0, (_paragraphInfo.spaceBefore < 0) ? -1 : Common.Utils.Metric.fnRecalcToMM(_paragraphInfo.spaceBefore));
             },
 
             onDistanceAfter: function (e) {
                 var $button = $(e.currentTarget),
-                    distance = _paragraphInfo.spaceAfter;
+                    distance = _paragraphInfo.spaceAfter,
+                    step,
+                    maxValue;
+
+                if (Common.Utils.Metric.getCurrentMetric() == Common.Utils.Metric.c_MetricUnits.pt) {
+                    step = 1;
+                } else {
+                    step = 0.01;
+                }
+
+                maxValue = Common.Utils.Metric.fnRecalcFromMM(558.8);
 
                 if ($button.hasClass('decrement')) {
-                    distance = Math.max(-1, --distance);
+                    distance = Math.max(-1, distance - step);
                 } else {
-                    distance = Math.min(100, ++distance);
+                    distance = Math.min(maxValue, distance + step);
                 }
 
+                var distanceFix = parseFloat(distance.toFixed(2));
+
                 _paragraphInfo.spaceAfter = distance;
 
-                $('#paragraph-distance-after .item-after label').text(_paragraphInfo.spaceAfter < 0 ? 'Auto' : (_paragraphInfo.spaceAfter) + ' ' + metricText);
+                $('#paragraph-distance-after .item-after label').text(_paragraphInfo.spaceAfter < 0 ? 'Auto' : distanceFix + ' ' + metricText);
                 this.api.put_LineSpacingBeforeAfter(1, (_paragraphInfo.spaceAfter < 0) ? -1 : Common.Utils.Metric.fnRecalcToMM(_paragraphInfo.spaceAfter));
             },
 
             onSpinFirstLine: function(e) {
                 var $button = $(e.currentTarget),
-                    distance = _paragraphProperty.get_Ind().get_FirstLine();
+                    distance = _paragraphProperty.get_Ind().get_FirstLine(),
+                    step,
+                    minValue,
+                    maxValue;
 
-                if ($button.hasClass('decrement')) {
+                distance = Common.Utils.Metric.fnRecalcFromMM(distance);
-                    distance = Math.max(-999, --distance);
+
+                if (Common.Utils.Metric.getCurrentMetric() == Common.Utils.Metric.c_MetricUnits.pt) {
+                    step = 1;
                 } else {
-                    distance = Math.min(999, ++distance);
+                    step = 0.1;
                 }
 
-                _paragraphProperty.get_Ind().put_FirstLine(distance)
+                minValue = Common.Utils.Metric.fnRecalcFromMM(-558.7);
+                maxValue = Common.Utils.Metric.fnRecalcFromMM(558.7);
 
-                $('#paragraph-spin-first-line .item-after label').text(distance + ' ' + metricText);
+                if ($button.hasClass('decrement')) {
-                this.api.paraApply(_paragraphProperty);
+                    distance = Math.max(minValue, distance - step);
+                } else {
+                    distance = Math.min(maxValue, distance + step);
+                }
+
+                var distanceFix = parseFloat(distance.toFixed(2));
+
+                $('#paragraph-spin-first-line .item-after label').text(distanceFix + ' ' + metricText);
+
+                distance = Common.Utils.Metric.fnRecalcToMM(distance);
+
+                var newParagraphProp = new Asc.asc_CParagraphProperty();
+
+                _paragraphProperty.get_Ind().put_FirstLine(distance);
+
+                newParagraphProp.get_Ind().put_FirstLine(distance);
+
+                this.api.paraApply(newParagraphProp);
             },
 
             onSpaceBetween: function (e) {

apps/documenteditor/mobile/app/controller/edit/EditShape.js

@@ -171,7 +171,7 @@ define([
                 var me = this;
 
                 // me.api && me.api.UpdateInterfaceState();
-
+                _metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
                 if (_shapeObject) {
                     if (pageId == '#edit-shape-wrap') {
                         me._initWrapView();
@@ -224,7 +224,7 @@ define([
                 var borderSize = shapeProperties.get_stroke().get_width() * 72.0 / 25.4;
                 var borderType = shapeProperties.get_stroke().get_type();
                 $('#edit-shape-bordersize input').val([(borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.indexSizeByValue(borderSize)]);
-                $('#edit-shape-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + _metricText);
+                $('#edit-shape-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
 
                 // Init style opacity
                 $('#edit-shape-effect input').val([shapeProperties.get_fill().asc_getTransparent() ? shapeProperties.get_fill().asc_getTransparent() / 2.55 : 100]);
@@ -444,7 +444,7 @@ define([
 
             onBorderSizeChanging: function (e) {
                 var $target = $(e.currentTarget);
-                $('#edit-shape-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + _metricText);
+                $('#edit-shape-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
             },
 
             onOpacity: function (e) {

apps/documenteditor/mobile/app/controller/edit/EditTable.js

@@ -185,6 +185,7 @@ define([
 
             initSettings: function (pageId) {
                 var me = this;
+                _metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
 
                 if (_tableObject) {
                     if (pageId == '#edit-table-wrap') {
@@ -336,7 +337,7 @@ define([
                 // }
 
                 $('#edit-table-bordersize input').val([borderSizeTransform.indexSizeByValue(_cellBorderWidth)]);
-                $('#edit-table-bordersize .item-after').text(borderSizeTransform.sizeByValue(_cellBorderWidth) + ' ' + _metricText);
+                $('#edit-table-bordersize .item-after').text(borderSizeTransform.sizeByValue(_cellBorderWidth) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
 
                 var borderPalette = me.getView('EditTable').paletteBorderColor;
 
@@ -613,6 +614,7 @@ define([
                 me.api.tblApply(properties);
             },
 
+
             onBorderSize: function (e) {
                 var $target = $(e.currentTarget),
                     value = $target.val();
@@ -622,7 +624,7 @@ define([
 
             onBorderSizeChanging: function (e) {
                 var $target = $(e.currentTarget);
-                $('#edit-table-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + _metricText);
+                $('#edit-table-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
             },
 
             // API handlers

apps/documenteditor/mobile/app/template/Collaboration.template

@@ -0,0 +1,195 @@
+<!-- Root view -->
+<div id="collaboration-root-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="center sliding categories center-collaboration"><%= scope.textCollaboration %></div>
+            <div class="right sliding close-collaboration"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="collaboration-root-view">
+            <div class="page-content">
+                <div class="list-block">
+                    <ul>
+                        <li>
+                            <a id="reviewing-settings" class="item-link" data-page="#reviewing-settings-view">
+                                <div class="item-content">
+                                    <div class="item-media">
+                                        <i class="icon icon-doc-setup"></i>
+                                    </div>
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textReviewing %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Reviewing Settings view -->
+<div id="reviewing-settings-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textReviewing %></div>
+            <div class="right sliding"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="reviewing-settings-view">
+            <div class="page-content">
+                <div class="list-block">
+                    <ul>
+                        <li>
+                            <div id="settings-review" class="item-content">
+                                <div class="item-media">
+                                    <i class="icon icon-review"></i>
+                                </div>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textReview %></div>
+                                    <div class="item-after">
+                                        <label class="label-switch">
+                                            <input type="checkbox">
+                                            <div class="checkbox"></div>
+                                        </label>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                        <li>
+                            <a id="display-mode-settings" class="item-link" data-page="#display-mode-view">
+                                <div class="item-content">
+                                    <div class="item-media">
+                                        <i class="icon icon-doc-setup"></i>
+                                    </div>
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textDisplayMode %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                        <li>
+                            <a id="change-settings" class="item-link" data-page="#change-view">
+                                <div class="item-content">
+                                    <div class="item-media">
+                                        <i class="icon icon-doc-setup"></i>
+                                    </div>
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textChange %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                        <li>
+                            <div id="settings-accept-all" class="item-content">
+                                <div class="item-media">
+                                    <i class="icon icon-review"></i>
+                                </div>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textAcceptAllChanges %></div>
+                                </div>
+                            </div>
+                        </li>
+                        <li>
+                            <div id="settings-reject-all" class="item-content">
+                                <div class="item-media">
+                                    <i class="icon icon-review"></i>
+                                </div>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textRejectAllChanges %></div>
+                                </div>
+                            </div>
+                        </li>
+
+                    </ul>
+                </div>
+
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Display Mode view -->
+<div id="display-mode-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textDisplayMode %></div>
+            <div class="right sliding"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="display-mode-view">
+            <div class="page-content">
+                <div class="list-block">
+                    <ul>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="doc-orientation" value="Markup">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textMarkup %></div>
+                                </div>
+                            </label>
+                        </li>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="doc-orientation" value="Final">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textFinal %></div>
+                                </div>
+                            </label>
+                        </li>
+                        <li>
+                             <label class="label-radio item-content">
+                                 <input type="radio" name="doc-orientation" value="Original">
+                                 <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                 <div class="item-inner">
+                                     <div class="item-title"><%= scope.textOriginal %></div>
+                                 </div>
+                             </label>
+                         </li>
+                    </ul>
+                </div>
+
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Change view -->
+<div id="change-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textChange %></div>
+            <div class="right sliding"><% if (phone) { %><a href="#" class="link icon-only close-picker"><i class="icon icon-expand-down"></i></a><% } %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page page-change" data-page="change-view">
+            <div class="page-content">
+                <div class="content-block block-btn">
+                <span class="next-prev">
+                <a href="#" id="btn-prev-change" class="link icon-only"><i class="icon icon-review"></i></a>
+                <a href="#" id="btn-next-change" class="link icon-only"><i class="icon icon-review"></i></a>
+                </span>
+                <span class="accept-reject">
+                <a href="#" id="btn-accept-change" class="link icon-only"><i class="icon icon-review"></i></a>
+                <a href="#" id="btn-reject-change" class="link icon-only"><i class="icon icon-review"></i></a>
+                </span>
+                </div>
+                <div id="current-change" class="content-block block-description">
+                    <p id="user-name"></p>
+                    <p id="date-change"></p>
+                    <p id="text-change"></p>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

apps/documenteditor/mobile/app/template/Settings.template

@@ -41,22 +41,6 @@
                                 </div>
                             </div>
                         </li>
-                        <li>
-                            <div id="settings-spellcheck" class="item-content">
-                                <div class="item-media">
-                                    <i class="icon icon-spellcheck"></i>
-                                </div>
-                                <div class="item-inner">
-                                    <div class="item-title"><%= scope.textSpellcheck %></div>
-                                    <div class="item-after">
-                                        <label class="label-switch">
-                                            <input type="checkbox">
-                                            <div class="checkbox"></div>
-                                        </label>
-                                    </div>
-                                </div>
-                            </div>
-                        </li>
                         <% if (orthography) { %>
                         <li>
                             <a id="settings-orthography" class="item-link no-indicator">
@@ -71,22 +55,18 @@
                             </a>
                         </li>
                         <% } %>
+                        <% if(phone) {%>
                         <li>
-                            <div id="settings-review" class="item-content">
+                            <div id="settings-collaboration" class="item-content">
                                 <div class="item-media">
                                     <i class="icon icon-review"></i>
                                 </div>
                                 <div class="item-inner">
-                                    <div class="item-title"><%= scope.textReview %></div>
+                                    <div class="item-title"><%= scope.textCollaboration %></div>
-                                    <div class="item-after">
-                                        <label class="label-switch">
-                                            <input type="checkbox">
-                                            <div class="checkbox"></div>
-                                        </label>
-                                    </div>
                                 </div>
                             </div>
                         </li>
+                        <% } %>
                         <li>
                             <a id="settings-document" class="item-link" data-page="#settings-document-view">
                                 <div class="item-content">
@@ -99,6 +79,18 @@
                                 </div>
                             </a>
                         </li>
+                        <li>
+                            <a id="settings-advanced" class="item-link" data-page="#settings-advanced-view">
+                                <div class="item-content">
+                                    <div class="item-media">
+                                        <i class="icon icon-doc-setup"></i>
+                                    </div>
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textAdvancedSettings %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
                         <li>
                             <a id="settings-download-as" class="item-link" data-page="#settings-download-view">
                                 <div class="item-content">
@@ -237,70 +229,27 @@
                                 </div>
                             </a>
                         </li>
+                        <li>
+                            <a id="margin-settings" class="item-link item-content" data-page="#margins-view">
+                                <div class="item-inner">
+                                    <div class="item-title-row">
+                                        <div class="item-title"><%= scope.textMargins %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
                    </ul>
                 </div>
-                <div class="content-block-title"><%= scope.textMargins %></div>
+                <div class="list-block media-list">
-                <div class="list-block">
                     <ul>
-                        <li id="document-margin-top">
+                        <li>
-                            <div class="item-content">
+                            <a id="color-schemes" class="item-link item-content" data-page="#color-schemes-view">
                                 <div class="item-inner">
-                                    <div class="item-title"><%= scope.textTop %></div>
+                                    <div class="item-title-row">
-                                    <div class="item-after splitter">
+                                        <div class="item-title"><%= scope.textColorSchemes %></div>
-                                        <% if (!android) { %><label></label><% } %>
-                                        <p class="buttons-row">
-                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
-                                            <% if (android) { %><label></label><% } %>
-                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
-                                        </p>
-                                    </div>
-                                </div>
-                            </div>
-                        </li>
-                        <li id="document-margin-bottom">
-                            <div class="item-content">
-                                <div class="item-inner">
-                                    <div class="item-title"><%= scope.textBottom %></div>
-                                    <div class="item-after splitter">
-                                        <% if (!android) { %><label></label><% } %>
-                                        <p class="buttons-row">
-                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
-                                            <% if (android) { %><label></label><% } %>
-                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
-                                        </p>
-                                    </div>
-                                </div>
-                            </div>
-                        </li>
-                        <li id="document-margin-left">
-                            <div class="item-content">
-                                <div class="item-inner">
-                                    <div class="item-title"><%= scope.textLeft %></div>
-                                    <div class="item-after splitter">
-                                        <% if (!android) { %><label></label><% } %>
-                                        <p class="buttons-row">
-                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
-                                            <% if (android) { %><label></label><% } %>
-                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
-                                        </p>
-                                    </div>
-                                </div>
-                            </div>
-                        </li>
-                        <li id="document-margin-right">
-                            <div class="item-content">
-                                <div class="item-inner">
-                                    <div class="item-title"><%= scope.textRight %></div>
-                                    <div class="item-after splitter">
-                                        <% if (!android) { %><label></label><% } %>
-                                        <p class="buttons-row">
-                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
-                                            <% if (android) { %><label></label><% } %>
-                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
-                                        </p>
-                                    </div>
                                     </div>
                                 </div>
+                            </a>
                         </li>
                    </ul>
                 </div>
@@ -601,3 +550,196 @@
         </div>
     </div>
 </div>
+
+<!-- Advanced Settings view -->
+<div id="settings-advanced-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textAdvancedSettings %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="settings-advanced-view">
+            <div class="page-content">
+
+                <div class="content-block-title"><%= scope.textUnitOfMeasurement %></div>
+                <div class="list-block">
+                    <ul>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="0">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textCentimeter %></div>
+                                </div>
+                            </label>
+                        </li>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="1">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textPoint %></div>
+                                </div>
+                            </label>
+                        </li>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="2">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textInch %></div>
+                                </div>
+                            </label>
+                        </li>
+                    </ul>
+                </div>
+
+                <div class="list-block">
+                    <ul>
+                        <div id="settings-spellcheck" class="item-content">
+                            <div class="item-inner">
+                                <div class="item-title"><%= scope.textSpellcheck %></div>
+                                <div class="item-after">
+                                    <label class="label-switch">
+                                        <input type="checkbox">
+                                        <div class="checkbox"></div>
+                                    </label>
+                                </div>
+                            </div>
+                        </div>
+                    </ul>
+                </div>
+
+                <div class="list-block">
+                    <ul>
+                        <div id="settings-no-characters" class="item-content">
+                            <div class="item-inner">
+                                <div class="item-title"><%= scope.textNoCharacters %></div>
+                                <div class="item-after">
+                                    <label class="label-switch">
+                                        <input type="checkbox">
+                                        <div class="checkbox"></div>
+                                    </label>
+                                </div>
+                            </div>
+                        </div>
+                        <div id="settings-hidden-borders" class="item-content">
+                            <div class="item-inner">
+                                <div class="item-title"><%= scope.textHiddenTableBorders %></div>
+                                <div class="item-after">
+                                    <label class="label-switch">
+                                        <input type="checkbox">
+                                        <div class="checkbox"></div>
+                                    </label>
+                                </div>
+                            </div>
+                        </div>
+                    </ul>
+                </div>
+
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Color schemes view -->
+<div id="color-schemes-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textColorSchemes %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="color-schemes-view">
+            <div class="page-content">
+                <div id="color-schemes-content" class="list-block">
+
+                </div>
+
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Margin settings view -->
+<div id="margins-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textMargins %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="margins-view">
+            <div class="page-content">
+                <div class="list-block">
+                    <ul>
+                        <li id="document-margin-top">
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textTop %></div>
+                                    <div class="item-after splitter">
+                                        <% if (!android) { %><label></label><% } %>
+                                        <p class="buttons-row">
+                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
+                                            <% if (android) { %><label></label><% } %>
+                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                        <li id="document-margin-bottom">
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textBottom %></div>
+                                    <div class="item-after splitter">
+                                        <% if (!android) { %><label></label><% } %>
+                                        <p class="buttons-row">
+                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
+                                            <% if (android) { %><label></label><% } %>
+                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                        <li id="document-margin-left">
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textLeft %></div>
+                                    <div class="item-after splitter">
+                                        <% if (!android) { %><label></label><% } %>
+                                        <p class="buttons-row">
+                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
+                                            <% if (android) { %><label></label><% } %>
+                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                        <li id="document-margin-right">
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textRight %></div>
+                                    <div class="item-after splitter">
+                                        <% if (!android) { %><label></label><% } %>
+                                        <p class="buttons-row">
+                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
+                                            <% if (android) { %><label></label><% } %>
+                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

apps/documenteditor/mobile/app/template/Toolbar.template

@@ -20,6 +20,11 @@
         <div class="center" id="toolbar-title"></div>
         <% } %>
         <div class="right">
+            <% if (!phone) { %>
+                <a href="#" id="toolbar-collaboration" class="link icon-only" style="display: none;">
+                    <i class="icon icon-review"></i>
+                </a>
+            <% } %>
             <% if (android) { %>
             <a href="#" id="toolbar-undo" class="link icon-only disabled" style="display: none;">
                 <i class="icon icon-undo"></i>

apps/documenteditor/mobile/app/view/Collaboration.js

@@ -0,0 +1,158 @@
+/*
+ *
+ * (c) Copyright Ascensio System SIA 2010-2019
+ *
+ * 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 20A-12 Ernesta Birznieka-Upisha
+ * street, Riga, Latvia, EU, LV-1050.
+ *
+ * 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
+ *
+ */
+
+/**
+ *  Collaboration.js
+ *  Document Editor
+ *
+ *  Created by Julia Svinareva on 14/5/19
+ *  Copyright (c) 2019 Ascensio System SIA. All rights reserved.
+ *
+ */
+
+define([
+    'text!documenteditor/mobile/app/template/Collaboration.template',
+    'jquery',
+    'underscore',
+    'backbone'
+], function (settingsTemplate, $, _, Backbone) {
+    'use strict';
+
+    DE.Views.Collaboration = Backbone.View.extend(_.extend((function() {
+        // private
+
+        return {
+
+            template: _.template(settingsTemplate),
+
+            events: {
+                //
+            },
+
+            initialize: function() {
+                Common.NotificationCenter.on('collaborationcontainer:show', _.bind(this.initEvents, this));
+                this.on('page:show', _.bind(this.updateItemHandlers, this));
+            },
+
+            initEvents: function () {
+                var me = this;
+
+                Common.Utils.addScrollIfNeed('.view[data-page=collaboration-root-view] .pages', '.view[data-page=collaboration-root-view] .page');
+                me.updateItemHandlers();
+            },
+
+            initControls: function() {
+                //
+            },
+
+            // Render layout
+            render: function() {
+                this.layout = $('<div/>').append(this.template({
+                    android : Common.SharedSettings.get('android'),
+                    phone   : Common.SharedSettings.get('phone'),
+                    orthography: Common.SharedSettings.get('sailfish'),
+                    scope   : this
+                }));
+
+                return this;
+            },
+
+            updateItemHandlers: function () {
+                var selectorsDynamicPage = [
+                    '.page[data-page=collaboration-root-view]',
+                    '.page[data-page=reviewing-settings-view]'
+                ].map(function (selector) {
+                    return selector + ' a.item-link[data-page]';
+                }).join(', ');
+
+                $(selectorsDynamicPage).single('click', _.bind(this.onItemClick, this));
+            },
+
+            onItemClick: function (e) {
+                var $target = $(e.currentTarget),
+                    page = $target.data('page');
+
+                if (page && page.length > 0 ) {
+                    this.showPage(page);
+                }
+            },
+
+            rootLayout: function () {
+                if (this.layout) {
+                    var $layour = this.layout.find('#collaboration-root-view'),
+                        isPhone = Common.SharedSettings.get('phone');
+
+                    return $layour.html();
+                }
+
+                return '';
+            },
+
+            showPage: function(templateId, animate) {
+                var rootView = DE.getController('Collaboration').rootView();
+
+                if (rootView && this.layout) {
+                    var $content = this.layout.find(templateId);
+
+                    // Android fix for navigation
+                    if (Framework7.prototype.device.android) {
+                        $content.find('.page').append($content.find('.navbar'));
+                    }
+
+                    rootView.router.load({
+                        content: $content.html(),
+                        animatePages: animate !== false
+                    });
+
+                    this.fireEvent('page:show', [this, templateId]);
+                }
+            },
+
+
+
+            textCollaboration: 'Collaboration',
+            textReviewing: 'Review',
+            textСomments: 'Сomments',
+            textBack: 'Back',
+            textReview: 'Track Changes',
+            textAcceptAllChanges: 'Accept All Changes',
+            textRejectAllChanges: 'Reject All Changes',
+            textDisplayMode: 'Display Mode',
+            textMarkup: 'Markup',
+            textFinal: 'Final',
+            textOriginal: 'Original',
+            textChange: 'Change'
+
+        }
+    })(), DE.Views.Collaboration || {}))
+});

apps/documenteditor/mobile/app/view/Settings.js

@@ -124,6 +124,8 @@ define([
                         $layour.find('#settings-search .item-title').text(this.textFindAndReplace)
                     } else {
                         $layour.find('#settings-document').hide();
+                        $layour.find('#settings-advanced').hide();
+                        $layour.find('#color-schemes').hide();
                         $layour.find('#settings-spellcheck').hide();
                         $layour.find('#settings-orthography').hide();
                     }
@@ -154,7 +156,8 @@ define([
             updateItemHandlers: function () {
                 var selectorsDynamicPage = [
                     '.page[data-page=settings-root-view]',
-                    '.page[data-page=settings-document-view]'
+                    '.page[data-page=settings-document-view]',
+                    '.page[data-page=settings-advanced-view]'
                 ].map(function (selector) {
                     return selector + ' a.item-link[data-page]';
                 }).join(', ');
@@ -207,8 +210,7 @@ define([
                                     '<div class="item-title-row">',
                                         '<div class="item-title"><%= item.caption %></div>',
                                     '</div>',
-                                    // '<div class="item-subtitle"><%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(item.value[0]).toFixed(2)) %><%= Common.Utils.Metric.getCurrentMetricName() %> x <%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(item.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></div>',
+                                    '<div class="item-subtitle"><%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(item.value[0]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %> x <%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(item.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></div>',
-                                    '<div class="item-subtitle"><%= item.subtitle %></div>',
                                 '</div>',
                             '</label>',
                         '</li>'
@@ -276,7 +278,16 @@ define([
             textTop: 'Top',
             textLeft: 'Left',
             textBottom: 'Bottom',
-            textRight: 'Right'
+            textRight: 'Right',
+            textAdvancedSettings: 'Application Settings',
+            textUnitOfMeasurement: 'Unit of Measurement',
+            textCentimeter: 'Centimeter',
+            textPoint: 'Point',
+            textInch: 'Inch',
+            textColorSchemes: 'Color Schemes',
+            textNoCharacters: 'Nonprinting Characters',
+            textHiddenTableBorders: 'Hidden Table Borders',
+            textCollaboration: 'Collaboration'
 
     }
     })(), DE.Views.Settings || {}))

apps/documenteditor/mobile/app/view/Toolbar.js

@@ -63,7 +63,8 @@ define([
                 "click #toolbar-edit"       : "showEdition",
                 "click #toolbar-add"        : "showInserts",
                 "click #toolbar-settings"   : "showSettings",
-                "click #toolbar-edit-document": "editDocument"
+                "click #toolbar-edit-document": "editDocument",
+                "click #toolbar-collaboration" : "showCollaboration"
             },
 
             // Set innerHTML and get the references to the DOM elements
@@ -100,7 +101,7 @@ define([
 
             setMode: function (mode) {
                 if (mode.isEdit) {
-                    $('#toolbar-edit, #toolbar-add, #toolbar-undo, #toolbar-redo').show();
+                    $('#toolbar-edit, #toolbar-add, #toolbar-undo, #toolbar-redo, #toolbar-collaboration').show();
                 } else if (mode.canEdit && mode.canRequestEditRights){
                     $('#toolbar-edit-document').show();
                 }
@@ -150,6 +151,11 @@ define([
                 DE.getController('Settings').showModal();
             },
 
+            //Collaboration
+            showCollaboration: function () {
+                DE.getController('Collaboration').showModal();
+            },
+
             editDocument: function () {
                 Common.Gateway.requestEditRights();
             },

apps/documenteditor/mobile/locale/en.json

@@ -14,8 +14,6 @@
   "DE.Controllers.AddTable.textColumns": "Columns",
   "DE.Controllers.AddTable.textRows": "Rows",
   "DE.Controllers.AddTable.textTableSize": "Table Size",
-  "DE.Controllers.DocumentHolder.menuAccept": "Accept",
-  "DE.Controllers.DocumentHolder.menuAcceptAll": "Accept All",
   "DE.Controllers.DocumentHolder.menuAddLink": "Add Link",
   "DE.Controllers.DocumentHolder.menuCopy": "Copy",
   "DE.Controllers.DocumentHolder.menuCut": "Cut",
@@ -24,11 +22,15 @@
   "DE.Controllers.DocumentHolder.menuMore": "More",
   "DE.Controllers.DocumentHolder.menuOpenLink": "Open Link",
   "DE.Controllers.DocumentHolder.menuPaste": "Paste",
-  "DE.Controllers.DocumentHolder.menuReject": "Reject",
-  "DE.Controllers.DocumentHolder.menuRejectAll": "Reject All",
   "DE.Controllers.DocumentHolder.menuReview": "Review",
   "DE.Controllers.DocumentHolder.sheetCancel": "Cancel",
   "DE.Controllers.DocumentHolder.textGuest": "Guest",
+  "DE.Controllers.DocumentHolder.menuMerge": "Merge Cells",
+  "DE.Controllers.DocumentHolder.menuSplit": "Split Cell",
+  "DE.Controllers.DocumentHolder.textCancel": "Cancel",
+  "DE.Controllers.DocumentHolder.textColumns": "Columns",
+  "DE.Controllers.DocumentHolder.textRows": "Rows",
+  "DE.Controllers.DocumentHolder.menuDeleteTable": "Delete Table",
   "DE.Controllers.EditContainer.textChart": "Chart",
   "DE.Controllers.EditContainer.textFooter": "Footer",
   "DE.Controllers.EditContainer.textHeader": "Header",
@@ -180,6 +182,58 @@
   "DE.Controllers.Toolbar.dlgLeaveTitleText": "You leave the application",
   "DE.Controllers.Toolbar.leaveButtonText": "Leave this Page",
   "DE.Controllers.Toolbar.stayButtonText": "Stay on this Page",
+  "DE.Controllers.Collaboration.textInserted": "<b>Inserted:</b>",
+  "DE.Controllers.Collaboration.textDeleted": "<b>Deleted:</b>",
+  "DE.Controllers.Collaboration.textParaInserted": "<b>Paragraph Inserted</b>",
+  "DE.Controllers.Collaboration.textParaDeleted": "<b>Paragraph Deleted</b>",
+  "DE.Controllers.Collaboration.textFormatted": "Formatted",
+  "DE.Controllers.Collaboration.textParaFormatted": "<b>Paragraph Formatted</b>",
+  "DE.Controllers.Collaboration.textNot": "Not",
+  "DE.Controllers.Collaboration.textBold": "Bold",
+  "DE.Controllers.Collaboration.textItalic": "Italic",
+  "DE.Controllers.Collaboration.textStrikeout": "Strikeout",
+  "DE.Controllers.Collaboration.textUnderline": "Underline",
+  "DE.Controllers.Collaboration.textColor": "Font color",
+  "DE.Controllers.Collaboration.textBaseline": "Baseline",
+  "DE.Controllers.Collaboration.textSuperScript": "Superscript",
+  "DE.Controllers.Collaboration.textSubScript": "Subscript",
+  "DE.Controllers.Collaboration.textHighlight": "Highlight color",
+  "DE.Controllers.Collaboration.textSpacing": "Spacing",
+  "DE.Controllers.Collaboration.textDStrikeout": "Double strikeout",
+  "DE.Controllers.Collaboration.textCaps": "All caps",
+  "DE.Controllers.Collaboration.textSmallCaps": "Small caps",
+  "DE.Controllers.Collaboration.textPosition": "Position",
+  "DE.Controllers.Collaboration.textShd": "Background color",
+  "DE.Controllers.Collaboration.textContextual": "Don\'t add interval between paragraphs of the same style",
+  "DE.Controllers.Collaboration.textNoContextual": "Add interval between paragraphs of the same style",
+  "DE.Controllers.Collaboration.textIndentLeft": "Indent left",
+  "DE.Controllers.Collaboration.textIndentRight": "Indent right",
+  "DE.Controllers.Collaboration.textFirstLine": "First line",
+  "DE.Controllers.Collaboration.textRight": "Align right",
+  "DE.Controllers.Collaboration.textLeft": "Align left",
+  "DE.Controllers.Collaboration.textCenter": "Align center",
+  "DE.Controllers.Collaboration.textJustify": "Align justify",
+  "DE.Controllers.Collaboration.textBreakBefore": "Page break before",
+  "DE.Controllers.Collaboration.textKeepNext": "Keep with next",
+  "DE.Controllers.Collaboration.textKeepLines": "Keep lines together",
+  "DE.Controllers.Collaboration.textNoBreakBefore": "No page break before",
+  "DE.Controllers.Collaboration.textNoKeepNext": "Don\'t keep with next",
+  "DE.Controllers.Collaboration.textNoKeepLines": "Don\'t keep lines together",
+  "DE.Controllers.Collaboration.textLineSpacing": "Line Spacing: ",
+  "DE.Controllers.Collaboration.textMultiple": "multiple",
+  "DE.Controllers.Collaboration.textAtLeast": "at least",
+  "DE.Controllers.Collaboration.textExact": "exactly",
+  "DE.Controllers.Collaboration.textSpacingBefore": "Spacing before",
+  "DE.Controllers.Collaboration.textSpacingAfter": "Spacing after",
+  "DE.Controllers.Collaboration.textAuto": "auto",
+  "DE.Controllers.Collaboration.textWidow": "Widow control",
+  "DE.Controllers.Collaboration.textNoWidow": "No widow control",
+  "DE.Controllers.Collaboration.textTabs": "Change tabs",
+  "DE.Controllers.Collaboration.textNum": "Change numbering",
+  "DE.Controllers.Collaboration.textEquation": "Equation",
+  "DE.Controllers.Collaboration.textImage": "Image",
+  "DE.Controllers.Collaboration.textChart": "Chart",
+  "DE.Controllers.Collaboration.textShape": "Shape",
   "DE.Views.AddImage.textAddress": "Address",
   "DE.Views.AddImage.textBack": "Back",
   "DE.Views.AddImage.textFromLibrary": "Picture from Library",
@@ -415,5 +469,25 @@
   "DE.Views.Settings.textVersion": "Version",
   "DE.Views.Settings.textWords": "Words",
   "DE.Views.Settings.unknownText": "Unknown",
-  "DE.Views.Toolbar.textBack": "Back"
+  "DE.Views.Settings.textAdvancedSettings": "Application Settings",
+  "DE.Views.Settings.textUnitOfMeasurement": "Unit of Measurement",
+  "DE.Views.Settings.textCentimeter": "Centimeter",
+  "DE.Views.Settings.textPoint": "Point",
+  "DE.Views.Settings.textInch": "Inch",
+  "DE.Views.Settings.textColorSchemes": "Color Schemes",
+  "DE.Views.Settings.textNoCharacters": "Nonprinting Characters",
+  "DE.Views.Settings.textHiddenTableBorders": "Hidden Table Borders",
+  "DE.Views.Toolbar.textBack": "Back",
+  "DE.Views.Collaboration.textCollaboration": "Collaboration",
+  "DE.Views.Collaboration.textReviewing": "Review",
+  "DE.Views.Collaboration.textСomments": "Сomments",
+  "DE.Views.Collaboration.textBack": "Back",
+  "DE.Views.Collaboration.textReview": "Track Changes",
+  "DE.Views.Collaboration.textAcceptAllChanges": "Accept All Changes",
+  "DE.Views.Collaboration.textRejectAllChanges": "Reject All Changes",
+  "DE.Views.Collaboration.textDisplayMode": "Display Mode",
+  "DE.Views.Collaboration.textMarkup": "Markup",
+  "DE.Views.Collaboration.textFinal": "Final",
+  "DE.Views.Collaboration.textOriginal": "Original",
+  "DE.Views.Collaboration.textChange": "Change"
 }

apps/documenteditor/mobile/resources/css/app-ios.css

@@ -874,7 +874,7 @@ p {
   width: 100%;
   height: 100%;
   overflow: hidden;
-  background: #efeff4;
+  background: #000;
 }
 .page {
   box-sizing: border-box;
@@ -6239,6 +6239,85 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after
   background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
   margin-top: 20px;
 }
+.color-schemes-menu {
+  cursor: pointer;
+  display: block;
+  background-color: #fff;
+}
+.color-schemes-menu .item-content {
+  padding-left: 0;
+}
+.color-schemes-menu .item-inner {
+  justify-content: flex-start;
+  padding-left: 16px;
+}
+.color-schemes-menu .color-schema-block {
+  display: flex;
+}
+.color-schemes-menu .color {
+  min-width: 26px;
+  min-height: 26px;
+  margin: 0 2px 0 0;
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
+}
+.color-schemes-menu .text {
+  margin-left: 20px;
+  color: #212121;
+}
+.page-change .block-description {
+  background-color: #fff;
+  padding-top: 15px;
+  padding-bottom: 15px;
+  margin: 0;
+}
+.page-change #user-name {
+  font-size: 17px;
+  line-height: 22px;
+  color: #000000;
+  margin: 0;
+}
+.page-change #date-change {
+  font-size: 14px;
+  line-height: 18px;
+  color: #6d6d72;
+  margin: 0;
+  margin-top: 3px;
+}
+.page-change #text-change {
+  color: #000000;
+  font-size: 15px;
+  line-height: 18px;
+  margin: 0;
+  margin-top: 10px;
+}
+.page-change .block-btn {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  margin: 26px 0;
+}
+.page-change .block-btn #btn-next-change,
+.page-change .block-btn #btn-reject-change {
+  margin-left: 20px;
+}
+.page-change .block-btn .link {
+  height: 48px;
+  width: 48px;
+  display: inline-block;
+}
+.page-change .block-btn .link .icon {
+  background-position: center;
+  height: 48px;
+  width: 48px;
+}
+.navbar .center-collaboration {
+  display: flex;
+  justify-content: space-around;
+}
+.container-collaboration .navbar .right.close-collaboration {
+  position: absolute;
+  right: 10px;
+}
 .tablet .searchbar.document.replace .center .searchbar:first-child {
   margin-right: 10px;
 }

apps/documenteditor/mobile/resources/css/app-material.css

@@ -5838,6 +5838,84 @@ html.phone .document-menu .list-block .item-link {
 .about .logo {
   background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
 }
+.color-schemes-menu {
+  cursor: pointer;
+  display: block;
+  background-color: #fff;
+}
+.color-schemes-menu .item-content {
+  padding-left: 0;
+}
+.color-schemes-menu .item-inner {
+  justify-content: flex-start;
+  padding-left: 16px;
+}
+.color-schemes-menu .color-schema-block {
+  display: flex;
+}
+.color-schemes-menu .color {
+  min-width: 26px;
+  min-height: 26px;
+  margin: 0 2px 0 0;
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
+}
+.color-schemes-menu .text {
+  margin-left: 20px;
+  color: #212121;
+}
+.page-change .block-description {
+  background-color: #fff;
+  padding-top: 15px;
+  padding-bottom: 15px;
+  margin: 0;
+}
+.page-change #user-name {
+  font-size: 17px;
+  line-height: 22px;
+  color: #000000;
+  margin: 0;
+}
+.page-change #date-change {
+  font-size: 14px;
+  line-height: 18px;
+  color: #6d6d72;
+  margin: 0;
+  margin-top: 3px;
+}
+.page-change #text-change {
+  color: #000000;
+  font-size: 15px;
+  line-height: 18px;
+  margin: 0;
+  margin-top: 10px;
+}
+.page-change .block-btn {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  margin: 0;
+  padding: 26px 0;
+  background-color: #EFEFF4;
+}
+.page-change .block-btn #btn-next-change,
+.page-change .block-btn #btn-reject-change {
+  margin-left: 20px;
+}
+.page-change .block-btn .link {
+  display: inline-block;
+}
+.page-change .block-btn .link .icon {
+  background-position: center;
+  height: 48px;
+  width: 48px;
+}
+.navbar .center-collaboration {
+  text-align: center;
+}
+.container-collaboration .navbar .right.close-collaboration {
+  position: absolute;
+  right: 5px;
+}
 .tablet .searchbar.document.replace .center > .replace {
   display: flex;
 }

apps/documenteditor/mobile/resources/less/app-ios.less

@@ -71,6 +71,9 @@ input, textarea {
 @import url('../../../../common/mobile/resources/less/ios/_contextmenu.less');
 @import url('../../../../common/mobile/resources/less/ios/_color-palette.less');
 @import url('../../../../common/mobile/resources/less/ios/_about.less');
+@import url('../../../../common/mobile/resources/less/ios/_color-schema.less');
+@import url('../../../../common/mobile/resources/less/ios/_collaboration.less');
+
 
 @import url('ios/_search.less');
 @import url('ios/_icons.less');

apps/documenteditor/mobile/resources/less/app-material.less

@@ -53,6 +53,8 @@
 @import url('../../../../common/mobile/resources/less/material/_contextmenu.less');
 @import url('../../../../common/mobile/resources/less/material/_color-palette.less');
 @import url('../../../../common/mobile/resources/less/material/_about.less');
+@import url('../../../../common/mobile/resources/less/material/_color-schema.less');
+@import url('../../../../common/mobile/resources/less/material/_collaboration.less');
 
 @import url('material/_search.less');
 @import url('material/_icons.less');

apps/presentationeditor/mobile/app/controller/Settings.js

@@ -56,7 +56,8 @@ define([
             inProgress,
             infoObj,
             modalView,
-            _licInfo;
+            _licInfo,
+            templateInsert;
 
         var _slideSizeArr = [
             [254, 190.5], [254, 143]
@@ -84,6 +85,7 @@ define([
                 this.api = api;
 
                 this.api.asc_registerCallback('asc_onPresentationSize', _.bind(this.onApiPageSize, this));
+                this.api.asc_registerCallback('asc_onSendThemeColorSchemes', _.bind(this.onSendThemeColorSchemes, this));
             },
 
             onLaunch: function () {
@@ -138,7 +140,8 @@ define([
                 }
 
                 rootView = uiApp.addView('.settings-root-view', {
-                    dynamicNavbar: true
+                    dynamicNavbar: true,
+                    domCache: true
                 });
 
                 Common.NotificationCenter.trigger('settingscontainer:show');
@@ -158,12 +161,14 @@ define([
                 $('#settings-readermode input:checkbox').single('change',   _.bind(me._onReaderMode, me));
                 $('#settings-spellcheck input:checkbox').single('change',   _.bind(me._onSpellcheck, me));
                 $(modalView).find('.formats a').single('click',             _.bind(me._onSaveFormat, me));
-                $('#page-settings-setup-view li').single('click',           _.bind(me._onSlideSize, me));
+                $('#page-settings-view #slide-size-block li').single('click',           _.bind(me._onSlideSize, me));
                 $('#settings-print').single('click',                        _.bind(me._onPrint, me));
 
+                Common.Utils.addScrollIfNeed('.page[data-page=settings-setup-view]', '.page[data-page=settings-setup-view] .page-content');
                 Common.Utils.addScrollIfNeed('.page[data-page=settings-download-view]', '.page[data-page=settings-download-view] .page-content');
                 Common.Utils.addScrollIfNeed('.page[data-page=settings-info-view]', '.page[data-page=settings-info-view] .page-content');
                 Common.Utils.addScrollIfNeed('.page[data-page=settings-about-view]', '.page[data-page=settings-about-view] .page-content');
+                Common.Utils.addScrollIfNeed('.page[data-page=color-schemes-view]', '.page[data-page=color-schemes-view] .page-content');
 
                 me.initSettings(pageId);
             },
@@ -175,9 +180,55 @@ define([
                 } else if (pageId == '#settings-about-view') {
                     // About
                     me.setLicInfo(_licInfo);
+                } else if ('#settings-application-view' == pageId) {
+                    me.initPageApplicationSettings();
+                } else if ('#color-schemes-view' == pageId) {
+                    me.initPageColorSchemes();
                 }
             },
 
+            initPageColorSchemes: function () {
+                $('#color-schemes-content').html(templateInsert);
+                $('.color-schemes-menu').on('click', _.bind(this.onColorSchemaClick, this));
+            },
+
+            onSendThemeColorSchemes: function (schemas) {
+                templateInsert = "";
+                _.each(schemas, function (schema, index) {
+                    var colors = schema.get_colors();//schema.colors;
+                    templateInsert = templateInsert + "<a class='color-schemes-menu item-link no-indicator'><input type='hidden' value='" + index + "'><div class='item-content'><div class='item-inner'><span class='color-schema-block'>";
+                    for (var j = 2; j < 7; j++) {
+                        var clr = '#' + Common.Utils.ThemeColor.getHexColor(colors[j].get_r(), colors[j].get_g(), colors[j].get_b());
+                        templateInsert =  templateInsert + "<span class='color' style='background: " + clr + ";'></span>"
+                    }
+                    templateInsert =  templateInsert + "</span><span class='text'>" + schema.get_name() + "</span></div></div></a>";
+                }, this);
+            },
+
+            onColorSchemaClick: function (event) {
+                if (this.api) {
+                    var ind = $(event.currentTarget).children('input').val();
+                    this.api.ChangeColorScheme(ind);
+                }
+            },
+
+            initPageApplicationSettings: function () {
+                var me = this,
+                    $unitMeasurement = $('.page[data-page=settings-application-view] input:radio[name=unit-of-measurement]');
+                $unitMeasurement.single('change', _.bind(me.unitMeasurementChange, me));
+                var value = Common.localStorage.getItem('pe-mobile-settings-unit');
+                value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
+                $unitMeasurement.val([value]);
+            },
+
+            unitMeasurementChange: function (e) {
+                var value = $(e.currentTarget).val();
+                value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
+                Common.Utils.Metric.setCurrentMetric(value);
+                Common.localStorage.setItem("pe-mobile-settings-unit", value);
+                this.api.asc_SetDocumentUnits((value==Common.Utils.Metric.c_MetricUnits.inch) ? Asc.c_oAscDocumentUnits.Inch : ((value==Common.Utils.Metric.c_MetricUnits.pt) ? Asc.c_oAscDocumentUnits.Point : Asc.c_oAscDocumentUnits.Millimeter));
+            },
+
             setLicInfo: function(data){
                 if (data && typeof data == 'object' && typeof(data.customer)=='object') {
                     $('.page[data-page=settings-about-view] .logo').hide();

apps/presentationeditor/mobile/app/controller/edit/EditChart.js

@@ -166,7 +166,7 @@ define([
                 var borderSize = shapeProperties.get_stroke().get_width() * 72.0 / 25.4,
                     borderType = _shapeObject.get_stroke().get_type();
                 $('#edit-chart-bordersize input').val([(borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.indexSizeByValue(borderSize)]);
-                $('#edit-chart-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + _metricText);
+                $('#edit-chart-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
 
                 paletteFillColor && paletteFillColor.on('select',       _.bind(me.onFillColor, me));
                 paletteBorderColor && paletteBorderColor.on('select',   _.bind(me.onBorderColor, me));
@@ -330,7 +330,7 @@ define([
 
             onBorderSizeChanging: function (e) {
                 var $target = $(e.currentTarget);
-                $('#edit-chart-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + _metricText);
+                $('#edit-chart-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
             },
 
             onFillColor: function(palette, color) {

apps/presentationeditor/mobile/app/controller/edit/EditShape.js

@@ -157,7 +157,7 @@ define([
                 var borderSize = _shapeObject.get_stroke().get_width() * 72.0 / 25.4,
                     borderType = _shapeObject.get_stroke().get_type();
                 $('#edit-shape-bordersize input').val([(borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.indexSizeByValue(borderSize)]);
-                $('#edit-shape-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + _metricText);
+                $('#edit-shape-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
 
                 // Init style opacity
                 $('#edit-shape-effect input').val([_shapeObject.get_fill().asc_getTransparent() ? _shapeObject.get_fill().asc_getTransparent() / 2.55 : 100]);
@@ -306,7 +306,7 @@ define([
 
             onBorderSizeChanging: function (e) {
                 var $target = $(e.currentTarget);
-                $('#edit-shape-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + _metricText);
+                $('#edit-shape-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
             },
 
             onOpacity: function (e) {

apps/presentationeditor/mobile/app/controller/edit/EditTable.js

@@ -167,6 +167,7 @@ define([
             initSettings: function (pageId) {
                 var me = this;
 
+                _metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
                 if (_tableObject) {
                     if (pageId == "#edit-table-style" || pageId == '#edit-table-border-color-view') {
                         me._initStyleView();
@@ -268,7 +269,7 @@ define([
                 // }
 
                 $('#edit-table-bordersize input').val([borderSizeTransform.indexSizeByValue(_cellBorderWidth)]);
-                $('#edit-table-bordersize .item-after').text(borderSizeTransform.sizeByValue(_cellBorderWidth) + ' ' + _metricText);
+                $('#edit-table-bordersize .item-after').text(borderSizeTransform.sizeByValue(_cellBorderWidth) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
 
                 var borderPalette = me.getView('EditTable').paletteBorderColor;
 
@@ -464,7 +465,7 @@ define([
 
             onBorderSizeChanging: function (e) {
                 var $target = $(e.currentTarget);
-                $('#edit-table-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + _metricText);
+                $('#edit-table-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
             },
 
             onReorder: function (e) {

apps/presentationeditor/mobile/app/controller/edit/EditText.js

@@ -170,6 +170,8 @@ define([
             initSettings: function (pageId) {
                 var me = this;
 
+                metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
+
                 me.api && me.api.UpdateInterfaceState(); // TODO: refactor me
 
                 if (_paragraphObject) {

apps/presentationeditor/mobile/app/template/Settings.template

@@ -25,22 +25,6 @@
                             </a>
                         </li>
                         <% } %>
-                        <li>
-                            <div id="settings-spellcheck" class="item-content">
-                                <div class="item-media">
-                                    <i class="icon icon-spellcheck"></i>
-                                </div>
-                                <div class="item-inner">
-                                    <div class="item-title"><%= scope.textSpellcheck %></div>
-                                    <div class="item-after">
-                                        <label class="label-switch">
-                                            <input type="checkbox">
-                                            <div class="checkbox"></div>
-                                        </label>
-                                    </div>
-                                </div>
-                            </div>
-                        </li>
                         <li>
                             <a id="settings-presentation-setup" class="item-link">
                                 <div class="item-content">
@@ -48,7 +32,19 @@
                                         <i class="icon icon-setup"></i>
                                     </div>
                                     <div class="item-inner">
-                                        <div class="item-title"><%= scope.textPresentSetup %></div>
+                                        <div class="item-title"><%= scope.textPresentSettings %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                        <li>
+                            <a id="settings-application" class="item-link">
+                                <div class="item-content">
+                                    <div class="item-media">
+                                        <i class="icon icon-print"></i>
+                                    </div>
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textApplicationSettings %></div>
                                     </div>
                                 </div>
                             </a>
@@ -312,13 +308,15 @@
 <div id="settings-setup-view">
     <div class="navbar">
         <div class="navbar-inner">
-            <div class="left sliding"><a href="#" class="back link"><i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="left sliding">
-            <div class="center sliding"><%= scope.textSlideSize %></div>
+                <a href="#" class="back link"><i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textPresentSettings %></div>
         </div>
     </div>
-    <div class="page" id="page-settings-setup-view" data-page="settings-setup-view">
+    <div class="page" id="page-settings-view" data-page="settings-setup-view">
         <div class="page-content">
-            <div class="list-block">
+            <div class="content-block-title"><%= scope.textSlideSize %></div>
+            <div class="list-block" id="slide-size-block">
                 <ul>
                     <li>
                         <label class="label-radio item-content">
@@ -340,6 +338,109 @@
                     </li>
                 </ul>
             </div>
+
+            <div class="list-block media-list">
+                <ul>
+                    <li>
+                        <a id="color-schemes" class="item-link item-content">
+                            <div class="item-inner">
+                                <div class="item-title-row">
+                                    <div class="item-title"><%= scope.textColorSchemes %></div>
+                                 </div>
+                             </div>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+
+        </div>
+    </div>
+</div>
+
+<!-- Presentation application settings -->
+<div id="settings-application-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding">
+                <a href="#" class="back link">
+                    <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %>
+                </a>
+            </div>
+            <div class="center sliding"><%= scope.textApplicationSettings %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="settings-application-view">
+            <div class="page-content">
+                <div class="content-block-title"><%= scope.textUnitOfMeasurement %></div>
+                <div class="list-block">
+
+                    <ul>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="0">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textCentimeter %></div>
+                                </div>
+                            </label>
+                        </li>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="1">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textPoint %></div>
+                                </div>
+                            </label>
+                        </li>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="2">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textInch %></div>
+                                </div>
+                            </label>
+                        </li>
+                    </ul>
+                 </div>
+                <div class="list-block">
+                    <ul>
+                        <div id="settings-spellcheck" class="item-content">
+                            <div class="item-inner">
+                                <div class="item-title"><%= scope.textSpellcheck %></div>
+                                <div class="item-after">
+                                    <label class="label-switch">
+                                        <input type="checkbox">
+                                        <div class="checkbox"></div>
+                                    </label>
+                                </div>
+                            </div>
+                        </div>
+                    </ul>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Color schemes view -->
+<div id="color-schemes-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textColorSchemes %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="color-schemes-view">
+            <div class="page-content">
+                <div id="color-schemes-content" class="list-block">
+
+                </div>
+
+            </div>
         </div>
     </div>
 </div>

apps/presentationeditor/mobile/app/view/Settings.js

@@ -80,6 +80,7 @@ define([
                 $('#settings-help').single('click', _.bind(me.showHelp, me));
                 $('#settings-about').single('click', _.bind(me.showAbout, me));
                 $('#settings-presentation-setup').single('click', _.bind(me.showSetup, me));
+                $('#settings-application').single('click', _.bind(me.showSetApp, me));
 
                 Common.Utils.addScrollIfNeed('.view[data-page=settings-root-view] .pages', '.view[data-page=settings-root-view] .page');
                 me.initControls();
@@ -160,6 +161,10 @@ define([
                 }
             },
 
+            showColorSchemes: function () {
+                this.showPage('#color-schemes-view');
+            },
+
             showInfo: function () {
                 this.showPage('#settings-info-view');
 
@@ -190,6 +195,11 @@ define([
 
             showSetup: function () {
                 this.showPage('#settings-setup-view');
+                $('#color-schemes').single('click', _.bind(this.showColorSchemes, this));
+            },
+
+            showSetApp: function () {
+                this.showPage('#settings-application-view');
             },
 
             loadDocument: function (data) {
@@ -209,6 +219,7 @@ define([
             textDone: 'Done',
             textEditPresent: 'Edit Presentation',
             textPresentSetup: 'Presentation Setup',
+            textPresentSettings: 'Presentation Settings',
             textDownload: 'Download',
             textPresentInfo: 'Presentation Info',
             textHelp: 'Help',
@@ -229,7 +240,13 @@ define([
             textPoweredBy: 'Powered by',
             textFindAndReplace: 'Find and Replace',
             textSpellcheck: 'Spell Checking',
-            textPrint: 'Print'
+            textPrint: 'Print',
+            textApplicationSettings: 'Application Settings',
+            textUnitOfMeasurement: 'Unit of Measurement',
+            textCentimeter: 'Centimeter',
+            textPoint: 'Point',
+            textInch: 'Inch',
+            textColorSchemes: 'Color Schemes'
         }
     })(), PE.Views.Settings || {}))
 });

apps/presentationeditor/mobile/locale/en.json

@@ -466,6 +466,13 @@
   "PE.Views.Settings.textSpellcheck": "Spell Checking",
   "PE.Views.Settings.textTel": "tel",
   "PE.Views.Settings.textVersion": "Version",
+  "PE.Views.Settings.textApplicationSettings": "Application Settings",
+  "PE.Views.Settings.textUnitOfMeasurement": "Unit of Measurement",
+  "PE.Views.Settings.textCentimeter": "Centimeter",
+  "PE.Views.Settings.textPoint": "Point",
+  "PE.Views.Settings.textInch": "Inch",
+  "PE.Views.Settings.textPresentSettings": "Presentation Settings",
+  "PE.Views.Settings.textColorSchemes": "Color Schemes",
   "PE.Views.Settings.unknownText": "Unknown",
   "PE.Views.Toolbar.textBack": "Back"
 }

apps/presentationeditor/mobile/resources/css/app-ios.css

@@ -6239,6 +6239,31 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after
   background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
   margin-top: 20px;
 }
+.color-schemes-menu {
+  cursor: pointer;
+  display: block;
+  background-color: #fff;
+}
+.color-schemes-menu .item-content {
+  padding-left: 0;
+}
+.color-schemes-menu .item-inner {
+  justify-content: flex-start;
+  padding-left: 16px;
+}
+.color-schemes-menu .color-schema-block {
+  display: flex;
+}
+.color-schemes-menu .color {
+  min-width: 26px;
+  min-height: 26px;
+  margin: 0 2px 0 0;
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
+}
+.color-schemes-menu .text {
+  margin-left: 20px;
+  color: #212121;
+}
 .tablet .searchbar.document.replace .center .searchbar:first-child {
   margin-right: 10px;
 }

apps/presentationeditor/mobile/resources/css/app-material.css

@@ -5838,6 +5838,31 @@ html.phone .document-menu .list-block .item-link {
 .about .logo {
   background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
 }
+.color-schemes-menu {
+  cursor: pointer;
+  display: block;
+  background-color: #fff;
+}
+.color-schemes-menu .item-content {
+  padding-left: 0;
+}
+.color-schemes-menu .item-inner {
+  justify-content: flex-start;
+  padding-left: 16px;
+}
+.color-schemes-menu .color-schema-block {
+  display: flex;
+}
+.color-schemes-menu .color {
+  min-width: 26px;
+  min-height: 26px;
+  margin: 0 2px 0 0;
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
+}
+.color-schemes-menu .text {
+  margin-left: 20px;
+  color: #212121;
+}
 .tablet .searchbar.document.replace .center > .replace {
   display: flex;
 }

apps/presentationeditor/mobile/resources/less/app-ios.less

@@ -71,6 +71,7 @@ input, textarea {
 @import url('../../../../common/mobile/resources/less/ios/_contextmenu.less');
 @import url('../../../../common/mobile/resources/less/ios/_color-palette.less');
 @import url('../../../../common/mobile/resources/less/ios/_about.less');
+@import url('../../../../common/mobile/resources/less/ios/_color-schema.less');
 
 @import url('ios/_search.less');
 @import url('ios/_icons.less');

apps/presentationeditor/mobile/resources/less/app-material.less

@@ -53,6 +53,7 @@
 @import url('../../../../common/mobile/resources/less/material/_contextmenu.less');
 @import url('../../../../common/mobile/resources/less/material/_color-palette.less');
 @import url('../../../../common/mobile/resources/less/material/_about.less');
+@import url('../../../../common/mobile/resources/less/material/_color-schema.less');
 
 @import url('material/_search.less');
 @import url('material/_icons.less');

apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js

@@ -152,6 +152,9 @@ define([
                         me.api.asc_getUrlType(url) > 0 && openLink(url);
                     }
                     break;
+                case 'freezePanes':
+                    me.api.asc_freezePane();
+                    break;
                 }
 
                 if ('showActionSheet' == event && _actionSheets.length > 0) {
@@ -320,9 +323,17 @@ define([
                                 });
                             }
                         }
+
+                        menuItems.push({
+                            caption: this.api.asc_getSheetViewSettings().asc_getIsFreezePane() ? me.menuUnfreezePanes : me.menuFreezePanes,
+                            event: 'freezePanes'
+                        });
+
                     }
                 }
 
+
+
                 if (Common.SharedSettings.get('phone') && menuItems.length > 3) {
                     _actionSheets = menuItems.slice(3);
 
@@ -356,7 +367,9 @@ define([
             menuEdit:       'Edit',
             menuCell:       'Cell',
             menuMore:       'More',
-            sheetCancel:    'Cancel'
+            sheetCancel:    'Cancel',
+            menuFreezePanes: 'Freeze Panes',
+            menuUnfreezePanes: 'Unfreeze Panes'
         }
     })(), SSE.Controllers.DocumentHolder || {}))
 });

apps/spreadsheeteditor/mobile/app/controller/Settings.js

@@ -52,7 +52,36 @@ define([
             inProgress,
             infoObj,
             modalView,
-            _licInfo;
+            _licInfo,
+            templateInsert,
+            _pageSizesIndex = 0,
+            _pageSizesCurrent = [0, 0],
+            txtCm = Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.cm),
+            _pageSizes = [
+                { caption: 'US Letter',             subtitle: Common.Utils.String.format('21,59{0} x 27,94{0}', txtCm),  value: [215.9, 279.4] },
+                { caption: 'US Legal',              subtitle: Common.Utils.String.format('21,59{0} x 35,56{0}', txtCm),  value: [215.9, 355.6] },
+                { caption: 'A4',                    subtitle: Common.Utils.String.format('21{0} x 29,7{0}', txtCm),      value: [210, 297] },
+                { caption: 'A5',                    subtitle: Common.Utils.String.format('14,8{0} x 21{0}', txtCm),  value: [148, 210] },
+                { caption: 'B5',                    subtitle: Common.Utils.String.format('17,6{0} x 25{0}', txtCm),   value: [176, 250] },
+                { caption: 'Envelope #10',          subtitle: Common.Utils.String.format('10,48{0} x 24,13{0}', txtCm),  value: [104.8, 241.3] },
+                { caption: 'Envelope DL',           subtitle: Common.Utils.String.format('11{0} x 22{0}', txtCm),  value: [110, 220] },
+                { caption: 'Tabloid',               subtitle: Common.Utils.String.format('27,94{0} x 43,18{0}', txtCm),  value: [279.4, 431.8] },
+                { caption: 'A3',                    subtitle: Common.Utils.String.format('29,7{0} x 42{0}', txtCm),   value: [297, 420] },
+                { caption: 'Tabloid Oversize',      subtitle: Common.Utils.String.format('30,48{0} x 45,71{0}', txtCm),  value: [304.8, 457.1] },
+                { caption: 'ROC 16K',               subtitle: Common.Utils.String.format('19,68{0} x 27,3{0}', txtCm),   value: [196.8, 273] },
+                { caption: 'Envelope Choukei 3',    subtitle: Common.Utils.String.format('11,99{0} x 23,49{0}', txtCm),  value: [119.9, 234.9] },
+                { caption: 'Super B/A3',            subtitle: Common.Utils.String.format('33,02{0} x 48,25{0}', txtCm),  value: [330.2, 482.5] },
+                { caption: 'A0',                    subtitle: Common.Utils.String.format('84,1{0} x 118,9{0}', txtCm),   value: [841, 1189] },
+                { caption: 'A1',                    subtitle: Common.Utils.String.format('59,4{0} x 84,1{0}', txtCm),    value: [594, 841] },
+                { caption: 'A2',                    subtitle: Common.Utils.String.format('42{0} x 59,4{0}', txtCm),      value: [420, 594] },
+                { caption: 'A6',                    subtitle: Common.Utils.String.format('10,5{0} x 14,8{0}', txtCm),    value: [105, 148] }
+            ],
+            _metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric())
+
+        var mm2Cm = function(mm) {
+            return parseFloat((mm/10.).toFixed(2));
+        };
+
 
         return {
             models: [],
@@ -73,11 +102,15 @@ define([
                         }
                     }
                 });
+
+                this.localMarginProps = null;
+
+
             },
 
             setApi: function (api) {
-                var me = this;
+                this.api = api;
-                me.api = api;
+                this.api.asc_registerCallback('asc_onSendThemeColorSchemes', _.bind(this.onSendThemeColorSchemes, this));
             },
 
             onLaunch: function () {
@@ -132,7 +165,8 @@ define([
                 }
 
                 rootView = uiApp.addView('.settings-root-view', {
-                    dynamicNavbar: true
+                    dynamicNavbar: true,
+                    domCache: true
                 });
 
                 Common.NotificationCenter.trigger('settingscontainer:show');
@@ -158,6 +192,205 @@ define([
                 if (pageId == '#settings-about-view') {
                     // About
                     me.setLicInfo(_licInfo);
+                } else if ('#settings-application-view' == pageId) {
+                    me.initPageApplicationSettings();
+                    Common.Utils.addScrollIfNeed('.page[data-page=settings-application-view]', '.page[data-page=settings-application-view] .page-content');
+                } else if ('#color-schemes-view' == pageId) {
+                    me.initPageColorSchemes();
+                    Common.Utils.addScrollIfNeed('.page[data-page=color-schemes-view]', '.page[data-page=color-schemes-view] .page-content');
+                } else if ('#settings-spreadsheet-view' == pageId) {
+                    me.initSpreadsheetSettings();
+                } else if ('#settings-page-size-view' == pageId) {
+                    me.initSpreadsheetPageSize();
+                } else if ('#margins-view' == pageId) {
+                    me.initSpreadsheetMargins();
+                }
+            },
+
+            initSpreadsheetSettings: function() {
+                var me = this,
+                    $pageSpreadsheetSettings = $('.page[data-page=settings-spreadsheet-view]'),
+                    $switchHideHeadings = $pageSpreadsheetSettings.find('#hide-headings input'),
+                    $switchHideGridlines = $pageSpreadsheetSettings.find('#hide-gridlines input'),
+                    $pageOrientation = $('.page[data-page=settings-spreadsheet-view] input:radio[name=table-orientation]');
+
+                $switchHideHeadings.single('change',    _.bind(me.clickCheckboxHideHeadings, me));
+                $switchHideGridlines.single('change',    _.bind(me.clickCheckboxHideGridlines, me));
+
+                var params = me.api.asc_getSheetViewSettings();
+                $switchHideHeadings.prop('checked',!params.asc_getShowRowColHeaders());
+                $switchHideGridlines.prop('checked',!params.asc_getShowGridLines());
+
+                // Init orientation
+                var currentSheet = this.api.asc_getActiveWorksheetIndex(),
+                    props = this.api.asc_getPageOptions(currentSheet),
+                    opt = props.asc_getPageSetup();
+                if(opt.asc_getOrientation() === Asc.c_oAscPageOrientation.PagePortrait) {
+                    $('.page[data-page=settings-spreadsheet-view] input:radio[name=table-orientation][value="0"]').prop( "checked", true );
+                } else {
+                    $('.page[data-page=settings-spreadsheet-view] input:radio[name=table-orientation][value="1"]').prop( "checked", true );
+                }
+                $pageOrientation.single('change', _.bind(me.onOrientationChange, me));
+
+                //Init format
+                var $pageSize = $('#settings-spreadsheet-format');
+                this.changeCurrentPageSize(opt.asc_getWidth(), opt.asc_getHeight());
+                $pageSize.find('.item-title').text(_pageSizes[_pageSizesIndex]['caption']);
+
+                var valueUnit = Common.localStorage.getItem('se-mobile-settings-unit');
+                valueUnit = (valueUnit!==null) ? parseInt(valueUnit) : Common.Utils.Metric.getDefaultMetric();
+                Common.Utils.Metric.setCurrentMetric(valueUnit);
+
+                var curMetricName = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric()),
+                    sizeW = parseFloat(Common.Utils.Metric.fnRecalcFromMM(_pageSizes[_pageSizesIndex]['value'][0]).toFixed(2)),
+                    sizeH = parseFloat(Common.Utils.Metric.fnRecalcFromMM(_pageSizes[_pageSizesIndex]['value'][1]).toFixed(2));
+
+                var pageSizeTxt = sizeW + ' ' + curMetricName + ' x ' + sizeH + ' ' + curMetricName;
+                $pageSize.find('.item-subtitle').text(pageSizeTxt);
+            },
+
+            changeCurrentPageSize: function(w, h) {
+                if (Math.abs(_pageSizesCurrent[0] - w) > 0.1 ||
+                    Math.abs(_pageSizesCurrent[1] - h) > 0.1) {
+                    _pageSizesCurrent = [w, h];
+
+                    _.find(_pageSizes, function(size, index) {
+                        if (Math.abs(size.value[0] - w) < 0.1 && Math.abs(size.value[1] - h) < 0.1) {
+                            _pageSizesIndex = index;
+                        }
+                    }, this);
+                }
+            },
+
+            initSpreadsheetPageSize: function() {
+                this.getView('Settings').renderPageSizes(_pageSizes, _pageSizesIndex);
+                $('.page[data-page=settings-page-size-view] input:radio[name=spreadsheet-format]').single('change', _.bind(this.onFormatChange, this));
+                Common.Utils.addScrollIfNeed('.page[data-page=settings-page-size-view]', '.page[data-page=settings-page-size-view] .page-content');
+            },
+
+            onFormatChange: function(e) {
+                var rawValue = $(e.currentTarget).val(),
+                    value = rawValue.split(',');
+                this.api.asc_changeDocSize(parseFloat(value[0]), parseFloat(value[1]), this.api.asc_getActiveWorksheetIndex());
+                this.initSpreadsheetSettings();
+            },
+
+            initSpreadsheetMargins: function() {
+                var me = this;
+                // Init page margins
+                var currentSheet = me.api.asc_getActiveWorksheetIndex(),
+                    props = me.api.asc_getPageOptions(currentSheet);
+                me.localMarginProps = props.asc_getPageMargins();
+
+                _metricText = Common.Utils.Metric.getMetricName(Common.Utils.Metric.getCurrentMetric());
+
+                var left =  parseFloat(Common.Utils.Metric.fnRecalcFromMM(me.localMarginProps.asc_getLeft()).toFixed(2)),
+                    top =  parseFloat(Common.Utils.Metric.fnRecalcFromMM(me.localMarginProps.asc_getTop()).toFixed(2)),
+                    right =  parseFloat(Common.Utils.Metric.fnRecalcFromMM(me.localMarginProps.asc_getRight()).toFixed(2)),
+                    bottom =  parseFloat(Common.Utils.Metric.fnRecalcFromMM(me.localMarginProps.asc_getBottom()).toFixed(2));
+
+                if (me.localMarginProps) {
+
+                    $('#spreadsheet-margin-top .item-after label').text(top + ' ' + _metricText);
+                    $('#spreadsheet-margin-bottom .item-after label').text(bottom + ' ' + _metricText);
+                    $('#spreadsheet-margin-left .item-after label').text(left + ' ' + _metricText);
+                    $('#spreadsheet-margin-right .item-after label').text(right + ' ' + _metricText);
+                }
+
+                _.each(["top", "left", "bottom", "right"], function(align) {
+                    $(Common.Utils.String.format('#spreadsheet-margin-{0} .button', align)).single('click', _.bind(me.onPageMarginsChange, me, align));
+                })
+            },
+
+            onPageMarginsChange: function (align, e) {
+                var me = this,
+                    $button = $(e.currentTarget),
+                    step = 1, // mm
+                    txtCm = Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.cm),
+                    marginValue = null;
+
+                var maxMarginsH = 482.5,
+                    maxMarginsW = 482.5;
+
+                if(Common.Utils.Metric.getCurrentMetric() == Common.Utils.Metric.c_MetricUnits.pt) {
+                    step = 1;
+                } else {
+                    step = 0.1;
+                }
+                step = Common.Utils.Metric.fnRecalcToMM(step);
+
+                switch (align) {
+                    case 'left': marginValue = me.localMarginProps.asc_getLeft(); break;
+                    case 'top': marginValue = me.localMarginProps.asc_getTop(); break;
+                    case 'right': marginValue = me.localMarginProps.asc_getRight(); break;
+                    case 'bottom': marginValue = me.localMarginProps.asc_getBottom(); break;
+                }
+
+                var changeProps = new Asc.asc_CPageMargins();
+                changeProps.asc_setTop(me.localMarginProps.asc_getTop());
+                changeProps.asc_setBottom(me.localMarginProps.asc_getBottom());
+                changeProps.asc_setLeft(me.localMarginProps.asc_getLeft());
+                changeProps.asc_setRight(me.localMarginProps.asc_getRight());
+
+                if ($button.hasClass('decrement')) {
+                    marginValue = Math.max(0, marginValue - step);
+                } else {
+                    marginValue = Math.min((align == 'left' || align == 'right') ? maxMarginsW : maxMarginsH, marginValue + step);
+                }
+
+                switch (align) {
+                    case 'left': changeProps.asc_setLeft(marginValue); break;
+                    case 'top': changeProps.asc_setTop(marginValue); break;
+                    case 'right': changeProps.asc_setRight(marginValue); break;
+                    case 'bottom': changeProps.asc_setBottom(marginValue); break;
+                }
+
+                $(Common.Utils.String.format('#document-margin-{0} .item-after label', align)).text(parseFloat(Common.Utils.Metric.fnRecalcFromMM(marginValue)).toFixed(2) + ' ' + _metricText);
+
+                me.api.asc_changePageMargins(changeProps.asc_getLeft(), changeProps.asc_getRight(), changeProps.asc_getTop(), changeProps.asc_getBottom(), me.api.asc_getActiveWorksheetIndex());
+                me.initSpreadsheetMargins();
+            },
+
+
+            onOrientationChange: function(e) {
+                var value = $(e.currentTarget).attr('value');
+                this.api.asc_changePageOrient(Number(value) === Asc.c_oAscPageOrientation.PagePortrait, this.api.asc_getActiveWorksheetIndex());
+            },
+
+            clickCheckboxHideHeadings: function(e) {
+                var $target = $(e.currentTarget),
+                    checked = $target.prop('checked');
+                this.api.asc_setDisplayHeadings(!checked);
+            },
+
+            clickCheckboxHideGridlines: function(e) {
+                var $target = $(e.currentTarget),
+                    checked = $target.prop('checked');
+                this.api.asc_setDisplayGridlines(!checked);
+            },
+
+            initPageColorSchemes: function() {
+                $('#color-schemes-content').html(templateInsert);
+                $('.color-schemes-menu').on('click', _.bind(this.onColorSchemaClick, this));
+            },
+
+            onSendThemeColorSchemes: function (schemas) {
+                templateInsert = "";
+                _.each(schemas, function (schema, index) {
+                    var colors = schema.get_colors();//schema.colors;
+                    templateInsert = templateInsert + "<a class='color-schemes-menu item-link no-indicator'><input type='hidden' value='" + index + "'><div class='item-content'><div class='item-inner'><span class='color-schema-block'>";
+                    for (var j = 2; j < 7; j++) {
+                        var clr = '#' + Common.Utils.ThemeColor.getHexColor(colors[j].get_r(), colors[j].get_g(), colors[j].get_b());
+                        templateInsert =  templateInsert + "<span class='color' style='background: " + clr + ";'></span>"
+                    }
+                    templateInsert =  templateInsert + "</span><span class='text'>" + schema.get_name() + "</span></div></div></a>";
+                }, this);
+            },
+
+            onColorSchemaClick: function(event) {
+                if (this.api) {
+                    var ind = $(event.currentTarget).children('input').val();
+                    this.api.asc_ChangeColorScheme(ind);
                 }
             },
 
@@ -198,6 +431,22 @@ define([
                 }
             },
 
+            initPageApplicationSettings: function() {
+                var me = this,
+                    $unitMeasurement = $('.page[data-page=settings-application-view] input:radio[name=unit-of-measurement]');
+                $unitMeasurement.single('change', _.bind(me.unitMeasurementChange, me));
+                var value = Common.localStorage.getItem('se-mobile-settings-unit');
+                value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
+                $unitMeasurement.val([value]);
+            },
+
+            unitMeasurementChange: function (e) {
+                var value = $(e.currentTarget).val();
+                value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
+                Common.Utils.Metric.setCurrentMetric(value);
+                Common.localStorage.setItem("se-mobile-settings-unit", value);
+            },
+
             // API handlers
 
             _onSearch: function (e) {

apps/spreadsheeteditor/mobile/app/controller/edit/EditChart.js

@@ -225,7 +225,7 @@ define([
                 var borderSize = shapeProperties.get_stroke().get_width() * 72.0 / 25.4,
                     borderType = shapeProperties.get_stroke().get_type();
                 $('#edit-chart-bordersize input').val([(borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.indexSizeByValue(borderSize)]);
-                $('#edit-chart-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + _metricText);
+                $('#edit-chart-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
 
                 $('#edit-chart-bordersize input').single('change touchend', _.buffered(me.onBorderSize, 100, me));
                 $('#edit-chart-bordersize input').single('input',           _.bind(me.onBorderSizeChanging, me));
@@ -660,7 +660,7 @@ define([
 
             onBorderSizeChanging: function (e) {
                 var $target = $(e.currentTarget);
-                $('#edit-chart-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + _metricText);
+                $('#edit-chart-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
             },
 
             onBorderColor: function (palette, color) {

apps/spreadsheeteditor/mobile/app/controller/edit/EditShape.js

@@ -182,7 +182,7 @@ define([
                 var borderSize = me._mm2pt(shapeProperties.get_stroke().get_width()),
                     borderType = shapeProperties.get_stroke().get_type();
                 $('#edit-shape-bordersize input').val([(borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.indexSizeByValue(borderSize)]);
-                $('#edit-shape-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + _metricText);
+                $('#edit-shape-bordersize .item-after').text(((borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize)) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
 
                 $('#edit-shape-bordersize input').single('change touchend', _.buffered(me.onBorderSize, 100, me));
                 $('#edit-shape-bordersize input').single('input',           _.bind(me.onBorderSizeChanging, me));
@@ -301,7 +301,7 @@ define([
 
             onBorderSizeChanging: function (e) {
                 var $target = $(e.currentTarget);
-                $('#edit-shape-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + _metricText);
+                $('#edit-shape-bordersize .item-after').text(borderSizeTransform.sizeByIndex($target.val()) + ' ' + Common.Utils.Metric.getMetricName(Common.Utils.Metric.c_MetricUnits.pt));
             },
 
             onOpacity: function (e) {

apps/spreadsheeteditor/mobile/app/template/Settings.template

@@ -25,6 +25,30 @@
                             </a>
                         </li>
                         <% } %>
+                        <li>
+                            <a id="settings-spreadsheet" class="item-link">
+                                <div class="item-content">
+                                    <div class="item-media">
+                                        <i class="icon icon-print"></i>
+                                    </div>
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textSpreadsheetSettings %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                        <li>
+                            <a id="settings-application" class="item-link">
+                                <div class="item-content">
+                                    <div class="item-media">
+                                        <i class="icon icon-print"></i>
+                                    </div>
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textApplicationSettings %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
                         <li>
                             <a id="settings-download" class="item-link">
                                 <div class="item-content">
@@ -330,3 +354,279 @@
         </div>
     </div>
 </div>
+
+<!-- Application settings -->
+<div id="settings-application-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding">
+                <a href="#" class="back link">
+                    <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %>
+                </a>
+            </div>
+            <div class="center sliding"><%= scope.textApplicationSettings %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="settings-application-view">
+            <div class="page-content">
+                <div class="content-block-title"><%= scope.textUnitOfMeasurement %></div>
+                <div class="list-block">
+
+                    <ul>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="0">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textCentimeter %></div>
+                                </div>
+                            </label>
+                        </li>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="1">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textPoint %></div>
+                                </div>
+                            </label>
+                        </li>
+                        <li>
+                            <label class="label-radio item-content">
+                                <input type="radio" name="unit-of-measurement" value="2">
+                                <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textInch %></div>
+                                </div>
+                            </label>
+                        </li>
+                    </ul>
+                 </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div id="settings-spreadsheet-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"><i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textSpreadsheetSettings %></div>
+        </div>
+    </div>
+    <div class="page" id="page-settings-spreadsheet-view" data-page="settings-spreadsheet-view">
+        <div class="page-content">
+            <div class="content-block-title"><%= scope.textOrientation %></div>
+            <div class="list-block">
+                <ul>
+                    <li>
+                        <label class="label-radio item-content">
+                            <input type="radio" name="table-orientation" value="0">
+                            <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                            <div class="item-inner">
+                                <div class="item-title"><%= scope.textPortrait %></div>
+                             </div>
+                        </label>
+                    </li>
+                    <li>
+                        <label class="label-radio item-content">
+                            <input type="radio" name="table-orientation" value="1">
+                               <% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>
+                               <div class="item-inner">
+                                   <div class="item-title"><%= scope.textLandscape %></div>
+                               </div>
+                         </label>
+                    </li>
+                </ul>
+            </div>
+            <div class="content-block-title"><%= scope.textFormat %></div>
+            <div class="list-block media-list">
+                <ul>
+                    <li>
+                        <a id="settings-spreadsheet-format" class="item-link item-content" data-page="#settings-page-size-view">
+                            <div class="item-inner">
+                                <div class="item-title-row">
+                                    <div class="item-title"><%= scope.textCustom %></div>
+                                </div>
+                                <div class="item-subtitle"><%= scope.textCustomSize %></div>
+                            </div>
+                        </a>
+                    </li>
+                    <li>
+                         <a id="margin-settings" class="item-link item-content" data-page="#margins-view">
+                             <div class="item-inner">
+                                 <div class="item-title-row">
+                                     <div class="item-title"><%= scope.textMargins %></div>
+                                 </div>
+                             </div>
+                         </a>
+                    </li>
+                </ul>
+            </div>
+            <div class="list-block">
+                <ul>
+                    <li id="hide-headings">
+                        <div class="item-content">
+                            <div class="item-inner">
+                                <div class="item-title"><%= scope.textHideHeadings %></div>
+                                <div class="item-after">
+                                    <label class="label-switch">
+                                        <input type="checkbox">
+                                        <div class="checkbox"></div>
+                                    </label>
+                                </div>
+                            </div>
+                        </div>
+                    </li>
+                    <li id="hide-gridlines">
+                        <div class="item-content">
+                            <div class="item-inner">
+                                <div class="item-title"><%= scope.textHideGridlines %></div>
+                                <div class="item-after">
+                                    <label class="label-switch">
+                                        <input type="checkbox">
+                                        <div class="checkbox"></div>
+                                    </label>
+                                </div>
+                            </div>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+            <div class="list-block media-list">
+                <ul>
+                    <li>
+                        <a id="color-schemes" class="item-link item-content">
+                            <div class="item-inner">
+                                <div class="item-title-row">
+                                    <div class="item-title"><%= scope.textColorSchemes %></div>
+                                 </div>
+                             </div>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+
+        </div>
+    </div>
+</div>
+
+<!-- Color schemes view -->
+<div id="color-schemes-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textColorSchemes %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="color-schemes-view">
+            <div class="page-content">
+                <div id="color-schemes-content" class="list-block">
+
+                </div>
+
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Spreadsheet Page Size view -->
+<div id="settings-page-size-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textSpreadsheetFormats %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="settings-page-size-view">
+            <div class="page-content">
+                <div class="list-block media-list">
+                    <ul></ul>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Margin settings view -->
+<div id="margins-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left sliding"><a href="#" class="back link"> <i class="icon icon-back"></i><% if (!android) { %><span><%= scope.textBack %></span><% } %></a></div>
+            <div class="center sliding"><%= scope.textMargins %></div>
+        </div>
+    </div>
+    <div class="pages">
+        <div class="page" data-page="margins-view">
+            <div class="page-content">
+                <div class="list-block">
+                    <ul>
+                        <li id="spreadsheet-margin-top">
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textTop %></div>
+                                    <div class="item-after splitter">
+                                        <% if (!android) { %><label></label><% } %>
+                                        <p class="buttons-row">
+                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
+                                            <% if (android) { %><label></label><% } %>
+                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                        <li id="spreadsheet-margin-bottom">
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textBottom %></div>
+                                    <div class="item-after splitter">
+                                        <% if (!android) { %><label></label><% } %>
+                                        <p class="buttons-row">
+                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
+                                            <% if (android) { %><label></label><% } %>
+                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                        <li id="spreadsheet-margin-left">
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textLeft %></div>
+                                    <div class="item-after splitter">
+                                        <% if (!android) { %><label></label><% } %>
+                                        <p class="buttons-row">
+                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
+                                            <% if (android) { %><label></label><% } %>
+                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                        <li id="spreadsheet-margin-right">
+                            <div class="item-content">
+                                <div class="item-inner">
+                                    <div class="item-title"><%= scope.textRight %></div>
+                                    <div class="item-after splitter">
+                                        <% if (!android) { %><label></label><% } %>
+                                        <p class="buttons-row">
+                                            <span class="button decrement"><% if (android) { %><i class="icon icon-expand-down"></i><% } else { %>-<% } %></span>
+                                            <% if (android) { %><label></label><% } %>
+                                            <span class="button increment"><% if (android) { %><i class="icon icon-expand-up"></i><% } else { %>+<% } %></span>
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

apps/spreadsheeteditor/mobile/app/view/Settings.js

@@ -79,6 +79,8 @@ define([
                 $('#settings-history').single('click',          _.bind(me.showHistory, me));
                 $('#settings-help').single('click',             _.bind(me.showHelp, me));
                 $('#settings-about').single('click',            _.bind(me.showAbout, me));
+                $('#settings-application').single('click', _.bind(me.showSetApp, me));
+                $('#settings-spreadsheet').single('click', _.bind(me.showSetSpreadsheet, me));
 
                 Common.Utils.addScrollIfNeed('.view[data-page=settings-root-view] .pages', '.view[data-page=settings-root-view] .page');
                 me.initControls();
@@ -162,6 +164,29 @@ define([
                 }
             },
 
+            showSetApp: function() {
+                this.showPage('#settings-application-view');
+            },
+
+            showColorSchemes: function () {
+                this.showPage('#color-schemes-view');
+            },
+
+            showSetSpreadsheet: function () {
+                this.showPage('#settings-spreadsheet-view');
+                $('#color-schemes').single('click', _.bind(this.showColorSchemes, this));
+                $('#settings-spreadsheet-format').single('click', _.bind(this.showPageSize, this));
+                $('#margin-settings').single('click', _.bind(this.showMargins, this));
+            },
+
+            showPageSize: function() {
+                this.showPage('#settings-page-size-view');
+            },
+
+            showMargins: function() {
+                this.showPage('#margins-view');
+            },
+
             showDocumentInfo: function() {
                 this.showPage('#settings-info-view');
 
@@ -204,6 +229,36 @@ define([
                 }
             },
 
+            renderPageSizes: function(sizes, selectIndex) {
+                var $pageFormats = $('.page[data-page=settings-page-size-view]'),
+                    $list = $pageFormats.find('ul'),
+                    items = [];
+
+                _.each(sizes, function (size, index) {
+                    items.push(_.template([
+                        '<li>',
+                        '<label class="label-radio item-content">',
+                        '<input type="radio" name="spreadsheet-format" value="<%= item.value %>" <% if (index == selectIndex) { %>checked="checked"<% } %> >',
+                        '<% if (android) { %><div class="item-media"><i class="icon icon-form-radio"></i></div><% } %>',
+                        '<div class="item-inner">',
+                        '<div class="item-title-row">',
+                        '<div class="item-title"><%= item.caption %></div>',
+                        '</div>',
+                        '<div class="item-subtitle"><%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(item.value[0]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %> x <%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(item.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></div>',
+                        '</div>',
+                        '</label>',
+                        '</li>'
+                    ].join(''))({
+                        android: Framework7.prototype.device.android,
+                        item: size,
+                        index: index,
+                        selectIndex: selectIndex
+                    }));
+                });
+
+                $list.html(items.join(''));
+            },
+
             unknownText: 'Unknown',
             textFindAndReplace: 'Find and Replace',
             textSettings: 'Settings',
@@ -225,7 +280,28 @@ define([
             textEmail: 'email',
             textTel: 'tel',
             textPoweredBy: 'Powered by',
-            textPrint: 'Print'
+            textPrint: 'Print',
+            textApplicationSettings: 'Application Settings',
+            textUnitOfMeasurement: 'Unit of Measurement',
+            textCentimeter: 'Centimeter',
+            textPoint: 'Point',
+            textInch: 'Inch',
+            textSpreadsheetSettings: 'Spreadsheet Settings',
+            textColorSchemes: 'Color Schemes',
+            textHideHeadings: 'Hide Headings',
+            textHideGridlines: 'Hide Gridlines',
+            textOrientation: 'Orientation',
+            textPortrait: 'Portrait',
+            textLandscape: 'Landscape',
+            textFormat: 'Format',
+            textSpreadsheetFormats: 'Spreadsheet Formats',
+            textCustom: 'Custom',
+            textCustomSize: 'Custom Size',
+            textMargins: 'Margins',
+            textTop: 'Top',
+            textLeft: 'Left',
+            textBottom: 'Bottom',
+            textRight: 'Right'
     }
     })(), SSE.Views.Settings || {}))
 });

apps/spreadsheeteditor/mobile/locale/en.json

@@ -33,6 +33,8 @@
   "SSE.Controllers.DocumentHolder.menuWrap": "Wrap",
   "SSE.Controllers.DocumentHolder.sheetCancel": "Cancel",
   "SSE.Controllers.DocumentHolder.warnMergeLostData": "Operation can destroy data in the selected cells.<br>Continue?",
+  "SSE.Controllers.DocumentHolder.menuFreezePanes": "Freeze Panes",
+  "SSE.Controllers.DocumentHolder.menuUnfreezePanes": "Unfreeze Panes",
   "SSE.Controllers.EditCell.textAuto": "Auto",
   "SSE.Controllers.EditCell.textFonts": "Fonts",
   "SSE.Controllers.EditCell.textPt": "pt",
@@ -513,6 +515,27 @@
   "SSE.Views.Settings.textSettings": "Settings",
   "SSE.Views.Settings.textTel": "tel",
   "SSE.Views.Settings.textVersion": "Version",
+  "SSE.Views.Settings.textApplicationSettings": "Application Settings",
+  "SSE.Views.Settings.textUnitOfMeasurement": "Unit of Measurement",
+  "SSE.Views.Settings.textCentimeter": "Centimeter",
+  "SSE.Views.Settings.textPoint": "Point",
+  "SSE.Views.Settings.textInch": "Inch",
+  "SSE.Views.Settings.textColorSchemes": "Color Schemes",
+  "SSE.Views.Settings.textSpreadsheetSettings": "Spreadsheet Settings",
+  "SSE.Views.Settings.textHideHeadings": "Hide Headings",
+  "SSE.Views.Settings.textHideGridlines": "Hide Gridlines",
+  "SSE.Views.Settings.textOrientation": "Orientation",
+  "SSE.Views.Settings.textPortrait": "Portrait",
+  "SSE.Views.Settings.textLandscape": "Landscape",
+  "SSE.Views.Settings.textFormat": "Format",
+  "SSE.Views.Settings.textSpreadsheetFormats": "Spreadsheet Formats",
+  "SSE.Views.Settings.textCustom": "Custom",
+  "SSE.Views.Settings.textCustomSize": "Custom Size",
+  "SSE.Views.Settings.textMargins": "Margins",
+  "SSE.Views.Settings.textTop": "Top",
+  "SSE.Views.Settings.textLeft": "Left",
+  "SSE.Views.Settings.textBottom": "Bottom",
+  "SSE.Views.Settings.textRight": "Right",
   "SSE.Views.Settings.unknownText": "Unknown",
   "SSE.Views.Toolbar.textBack": "Back"
 }

apps/spreadsheeteditor/mobile/resources/css/app-ios.css

@@ -6239,6 +6239,31 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after
   background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
   margin-top: 20px;
 }
+.color-schemes-menu {
+  cursor: pointer;
+  display: block;
+  background-color: #fff;
+}
+.color-schemes-menu .item-content {
+  padding-left: 0;
+}
+.color-schemes-menu .item-inner {
+  justify-content: flex-start;
+  padding-left: 16px;
+}
+.color-schemes-menu .color-schema-block {
+  display: flex;
+}
+.color-schemes-menu .color {
+  min-width: 26px;
+  min-height: 26px;
+  margin: 0 2px 0 0;
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
+}
+.color-schemes-menu .text {
+  margin-left: 20px;
+  color: #212121;
+}
 i.icon.icon-search {
   width: 24px;
   height: 24px;

apps/spreadsheeteditor/mobile/resources/css/app-material.css

@@ -5848,6 +5848,31 @@ html.phone .document-menu .list-block .item-link {
 .about .logo {
   background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
 }
+.color-schemes-menu {
+  cursor: pointer;
+  display: block;
+  background-color: #fff;
+}
+.color-schemes-menu .item-content {
+  padding-left: 0;
+}
+.color-schemes-menu .item-inner {
+  justify-content: flex-start;
+  padding-left: 16px;
+}
+.color-schemes-menu .color-schema-block {
+  display: flex;
+}
+.color-schemes-menu .color {
+  min-width: 26px;
+  min-height: 26px;
+  margin: 0 2px 0 0;
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset;
+}
+.color-schemes-menu .text {
+  margin-left: 20px;
+  color: #212121;
+}
 .tablet .searchbar.document.replace .center > .replace {
   display: flex;
 }

apps/spreadsheeteditor/mobile/resources/less/app-ios.less

@@ -73,6 +73,8 @@ input, textarea {
 @import url('../../../../common/mobile/resources/less/ios/_contextmenu.less');
 @import url('../../../../common/mobile/resources/less/ios/_color-palette.less');
 @import url('../../../../common/mobile/resources/less/ios/_about.less');
+@import url('../../../../common/mobile/resources/less/ios/_color-schema.less');
+
 
 @import url('ios/_icons.less');
 @import url('app-common');

apps/spreadsheeteditor/mobile/resources/less/app-material.less

@@ -66,6 +66,7 @@ input, textarea {
 @import url('../../../../common/mobile/resources/less/material/_contextmenu.less');
 @import url('../../../../common/mobile/resources/less/material/_color-palette.less');
 @import url('../../../../common/mobile/resources/less/material/_about.less');
+@import url('../../../../common/mobile/resources/less/material/_color-schema.less');
 
 @import url('material/_search.less');
 @import url('material/_icons.less');