v5.4.0

apps/api/documents/api.js

@@ -23,9 +23,11 @@
                 key: 'key',
                 vkey: 'vkey',
                 info: {
-                    author: 'author name',
+                    author: 'author name', // must be deprecated, use owner instead
+                    owner: 'owner name',
                     folder: 'path to document',
-                    created: '<creation date>',
+                    created: '<creation date>', // must be deprecated, use uploaded instead
+                    uploaded: '<uploaded date>',
                     sharingSettings: [
                         {
                             user: 'user name',
@@ -63,6 +65,7 @@
                 saveAsUrl: 'folder for saving files'
                 licenseUrl: <url for license>,
                 customerId: <customer id>,
+                region: <regional settings> // can be 'en-us' or lang code
 
                 user: {
                     id: 'user id',
@@ -129,7 +132,6 @@
                 },
                 plugins: {
                     autostart: ['asc.{FFE1F462-1EA2-4391-990D-4CC84940B754}'],
-                    url: '../../../../sdkjs-plugins/',
                     pluginsData: [
                         "helloworld/config.json",
                         "chess/config.json",
@@ -139,7 +141,6 @@
                 }
             },
             events: {
-                'onReady': <application ready callback>, // deprecated
                 'onAppReady': <application ready callback>,
                 'onBack': <back to folder callback>,
                 'onDocumentStateChange': <document state changed callback>
@@ -174,7 +175,6 @@
                 }
             },
             events: {
-                'onReady': <application ready callback>, // deprecated
                 'onAppReady': <application ready callback>,
                 'onBack': <back to folder callback>,
                 'onError': <error callback>,
@@ -199,12 +199,14 @@
         _config.editorConfig.canRequestClose = _config.events && !!_config.events.onRequestClose;
         _config.editorConfig.canRename = _config.events && !!_config.events.onRequestRename;
         _config.editorConfig.canMakeActionLink = _config.events && !!_config.events.onMakeActionLink;
+        _config.editorConfig.canRequestUsers = _config.events && !!_config.events.onRequestUsers;
+        _config.editorConfig.canRequestSendNotify = _config.events && !!_config.events.onRequestSendNotify;
         _config.editorConfig.mergeFolderUrl = _config.editorConfig.mergeFolderUrl || _config.editorConfig.saveAsUrl;
+        _config.editorConfig.canRequestSaveAs = _config.events && !!_config.events.onRequestSaveAs;
+        _config.editorConfig.canRequestInsertImage = _config.events && !!_config.events.onRequestInsertImage;
+        _config.editorConfig.canRequestMailMergeRecipients = _config.events && !!_config.events.onRequestMailMergeRecipients;
         _config.frameEditorId = placeholderId;
 
-        _config.events && !!_config.events.onReady && console.log("Obsolete: The onReady event is deprecated. Please use onAppReady instead.");
-        _config.events && (_config.events.onAppReady = _config.events.onAppReady || _config.events.onReady);
-
         var onMouseUp = function (evt) {
             _processMouse(evt);
         };
@@ -537,6 +539,41 @@
             });
         };
 
+        var _setUsers = function(data) {
+            _sendCommand({
+                command: 'setUsers',
+                data: data
+            });
+        };
+
+        var _showSharingSettings = function(data) {
+            _sendCommand({
+                command: 'showSharingSettings',
+                data: data
+            });
+        };
+
+        var _setSharingSettings = function(data) {
+            _sendCommand({
+                command: 'setSharingSettings',
+                data: data
+            });
+        };
+
+        var _insertImage = function(data) {
+            _sendCommand({
+                command: 'insertImage',
+                data: data
+            });
+        };
+
+        var _setMailMergeRecipients = function(data) {
+            _sendCommand({
+                command: 'setMailMergeRecipients',
+                data: data
+            });
+        };
+
         var _processMouse = function(evt) {
             var r = iframe.getBoundingClientRect();
             var data = {
@@ -576,7 +613,12 @@
             serviceCommand      : _serviceCommand,
             attachMouseEvents   : _attachMouseEvents,
             detachMouseEvents   : _detachMouseEvents,
-            destroyEditor       : _destroyEditor
+            destroyEditor       : _destroyEditor,
+            setUsers            : _setUsers,
+            showSharingSettings : _showSharingSettings,
+            setSharingSettings  : _setSharingSettings,
+            insertImage         : _insertImage,
+            setMailMergeRecipients: _setMailMergeRecipients
         }
     };
 

apps/common/Gateway.js

@@ -98,6 +98,26 @@ if (Common === undefined) {
 
             'resetFocus': function(data) {
                 $me.trigger('resetfocus', data);
+            },
+
+            'setUsers': function(data) {
+                $me.trigger('setusers', data);
+            },
+
+            'showSharingSettings': function(data) {
+                $me.trigger('showsharingsettings', data);
+            },
+
+            'setSharingSettings': function(data) {
+                $me.trigger('setsharingsettings', data);
+            },
+
+            'insertImage': function(data) {
+                $me.trigger('insertimage', data);
+            },
+
+            'setMailMergeRecipients': function(data) {
+                $me.trigger('setmailmergerecipients', data);
             }
         };
 
@@ -238,6 +258,16 @@ if (Common === undefined) {
                 });
             },
 
+            requestSaveAs: function(url, title) {
+                _postMessage({
+                    event: 'onRequestSaveAs',
+                    data: {
+                        url: url,
+                        title: title
+                    }
+                });
+            },
+
             collaborativeChanges: function() {
                 _postMessage({event: 'onCollaborativeChanges'});
             },
@@ -262,6 +292,22 @@ if (Common === undefined) {
                 _postMessage({event:'onMakeActionLink', data: config})
             },
 
+            requestUsers:  function () {
+                _postMessage({event:'onRequestUsers'})
+            },
+
+            requestSendNotify:  function (emails) {
+                _postMessage({event:'onRequestSendNotify', data: emails})
+            },
+
+            requestInsertImage:  function () {
+                _postMessage({event:'onRequestInsertImage'})
+            },
+
+            requestMailMergeRecipients:  function () {
+                _postMessage({event:'onRequestMailMergeRecipients'})
+            },
+
             on: function(event, handler){
                 var localHandler = function(event, data){
                     handler.call(me, data)

apps/common/embed/lib/util/utils.js

@@ -44,7 +44,7 @@
                         newDocumentPage.focus();
                 }
             }
-            , dialogPrint: function(url) {
+            , dialogPrint: function(url, api) {
                 $('#id-print-frame').remove();
 
                 if ( !!url ) {
@@ -59,10 +59,14 @@
                     document.body.appendChild(iframePrint);
 
                     iframePrint.onload = function () {
+                        try {
                             iframePrint.contentWindow.focus();
                             iframePrint.contentWindow.print();
                             iframePrint.contentWindow.blur();
                             window.focus();
+                        } catch (e) {
+                            api.asc_DownloadAs(new Asc.asc_CDownloadOptions(Asc.c_oAscFileType.PDF));
+                        }
                     };
 
                     iframePrint.src = url;

apps/common/embed/lib/view/modals.js

@@ -61,10 +61,10 @@ common.view.modals = new(function() {
                         '</div>';
 
     var _tplbody_embed = '<div class="size-manual">' +
-                            '<span class="caption">Width:</span>' +
+                            '<span class="caption">{width}:</span>' +
                             '<input id="txt-embed-width" class="form-control input-xs" type="text" value="400px">' +
                             '<input id="txt-embed-height" class="form-control input-xs right" type="text" value="600px">' +
-                            '<span class="right caption">Height:</span>' +
+                            '<span class="right caption">{height}:</span>' +
                         '</div>' +
                         '<textarea id="txt-embed-url" rows="4" class="form-control" readonly></textarea>';
 
@@ -75,22 +75,29 @@ common.view.modals = new(function() {
             var _$dlg;
             if (name == 'share') {
                 _$dlg = $(tplDialog
-                            .replace(/\{title}/, 'Share Link')
+                            .replace(/\{title}/, this.txtShare)
                             .replace(/\{body}/, _tplbody_share)
-                            .replace(/\{footer}/, '<button id="btn-copyshort" type="button" class="btn">Copy to clipboard</button>'))
+                            .replace(/\{footer}/, '<button id="btn-copyshort" type="button" class="btn">' + this.txtCopy + '</button>'))
                                 .appendTo(parent)
                                 .attr('id', 'dlg-share');
             } else
             if (name == 'embed') {
                 _$dlg = $(tplDialog
-                            .replace(/\{title}/, 'Embed')
+                            .replace(/\{title}/, this.txtEmbed)
                             .replace(/\{body}/, _tplbody_embed)
-                            .replace(/\{footer}/, '<button id="btn-copyembed" type="button" class="btn">Copy to clipboard</button>'))
+                            .replace(/\{width}/, this.txtWidth)
+                            .replace(/\{height}/, this.txtHeight)
+                            .replace(/\{footer}/, '<button id="btn-copyembed" type="button" class="btn">' + this.txtCopy + '</button>'))
                                 .appendTo(parent)
                                 .attr('id', 'dlg-embed');
             }
 
             return _$dlg;
-        }
+        },
+        txtWidth: 'Width',
+        txtHeight: 'Height',
+        txtShare: 'Share Link',
+        txtCopy: 'Copy to clipboard',
+        txtEmbed: 'Embed'
     };
 })();

apps/common/locale.js

@@ -35,29 +35,9 @@ if (Common === undefined) {
 }
 
 Common.Locale = new(function() {
+    "use strict";
     var l10n = {};
 
-    var _createXMLHTTPObject = function() {
-        var xmlhttp;
-        if (typeof XMLHttpRequest != 'undefined') {
-            xmlhttp = new XMLHttpRequest();
-        } else {
-            try {
-                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
-            }
-            catch (e) {
-                try {
-                    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
-                }
-                catch (E) {
-                    xmlhttp = false;
-                }
-            }
-        }
-
-        return xmlhttp;
-    };
-
     var _applyLocalization = function() {
         try {
             for (var prop in l10n) {
@@ -98,25 +78,40 @@ Common.Locale = new(function() {
         return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
     };
 
-    try {
+    var _requireLang = function () {
-        var langParam = _getUrlParameterByName('lang');
+        var lang = (_getUrlParameterByName('lang') || 'en').split(/[\-_]/)[0];
-        var xhrObj = _createXMLHTTPObject();
+        fetch('locale/' + lang + '.json')
-        if (xhrObj && langParam) {
+            .then(function(response) {
-            var lang = langParam.split(/[\-\_]/)[0];
+                if (!response.ok) {
-            xhrObj.open('GET', 'locale/' + lang + '.json', false);
+                    if (lang != 'en')
-            xhrObj.send('');
+                        /* load default lang if fetch failed */
-            l10n = eval("(" + xhrObj.responseText + ")");
+                        return fetch('locale/en.json');
-        }
+
-    }
+                    throw new Error('server error');
-    catch (e) {
-        try {
-            xhrObj.open('GET', 'locale/en.json', false);
-            xhrObj.send('');
-            l10n = eval("(" + xhrObj.responseText + ")");
-        }
-        catch (e) {
                 }
+                return response.json();
+            }).then(function(response) {
+                if ( response.then )
+                    return response.json();
+                else {
+                    l10n = response;
+                    /* to break promises chain */
+                    throw new Error('loaded');
                 }
+            }).then(function(json) {
+                if ( !!json ) l10n = json;
+            }).catch(function(e) {
+                if ( e.message == 'loaded' ) {
+
+                } else
+                    console.log('fetch error: ' + e);
+            });
+    };
+
+    if ( !window.fetch ) {
+        /* use fetch polifill if native method isn't supported */
+        require(['../vendor/fetch/fetch.umd'], _requireLang);
+    } else _requireLang();
 
     return {
         apply: _applyLocalization,

apps/common/main/lib/component/Button.js

@@ -513,8 +513,8 @@ define([
                 });
 
                 el.on('mouseout', function(e) {
-                    if (!me.disabled) {
                     me.cmpEl.removeClass('over');
+                    if (!me.disabled) {
                         me.trigger('mouseout', me, e);
                     }
                 });

apps/common/main/lib/component/CheckBox.js

@@ -137,6 +137,9 @@ define([
         },
 
         setDisabled: function(disabled) {
+            if (!this.rendered)
+                return;
+
             disabled = (disabled===true);
             if (disabled !== this.disabled) {
                 this.$label.toggleClass('disabled', disabled);

apps/common/main/lib/component/ComboBorderSize.js

@@ -111,7 +111,7 @@ define([
                 editable: false,
                 store: new Common.UI.BordersStore(),
                 data: data,
-                menuStyle: 'min-width: 150px;'
+                menuStyle: 'min-width: 160px;'
             }, options));
         },
 
@@ -209,7 +209,7 @@ define([
                 editable: true,
                 store: new Common.UI.BordersStore(),
                 data: data,
-                menuStyle: 'min-width: 150px;'
+                menuStyle: 'min-width: 160px;'
             }, options));
         },
 

apps/common/main/lib/component/ComboBox.js

@@ -85,12 +85,13 @@ define([
                 menuStyle   : '',
                 displayField: 'displayValue',
                 valueField  : 'value',
+                search      : false,
                 scrollAlwaysVisible: false
             },
 
             template: _.template([
                 '<span class="input-group combobox <%= cls %>" id="<%= id %>" style="<%= style %>">',
-                    '<input type="text" class="form-control">',
+                    '<input type="text" class="form-control" spellcheck="false">',
                     '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
                     '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
                         '<% _.each(items, function(item) { %>',
@@ -119,6 +120,7 @@ define([
                 this.store          = me.options.store || new Common.UI.ComboBoxStore();
                 this.displayField   = me.options.displayField;
                 this.valueField     = me.options.valueField;
+                this.search         = me.options.search;
                 this.scrollAlwaysVisible = me.options.scrollAlwaysVisible;
                 me.rendered         = me.options.rendered || false;
 
@@ -295,12 +297,14 @@ define([
                     if (itemTop < 0 || itemTop + itemHeight > listHeight) {
                         $list.scrollTop($list.scrollTop() + itemTop + itemHeight - (listHeight/2));
                     }
+                    setTimeout(function(){$selected.find('a').focus();}, 1);
                 }
 
                 if (this.scroller)
                     this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible});
 
                 this.trigger('show:after', this, e);
+                this._search = {};
             },
 
             onBeforeHideMenu: function(e) {
@@ -332,6 +336,57 @@ define([
                     this.closeMenu();
                     this.onAfterHideMenu(e);
                     return false;
+                }  else if (this.search && e.keyCode > 64 && e.keyCode < 91 && e.key){
+                    var me = this;
+                    clearTimeout(this._search.timer);
+                    this._search.timer = setTimeout(function () { me._search = {}; }, 1000);
+
+                    (!this._search.text) && (this._search.text = '');
+                    (!this._search.char) && (this._search.char = e.key);
+                    (this._search.char !== e.key) && (this._search.full = true);
+                    this._search.text += e.key;
+                    if (this._search.index===undefined) {
+                        var $items = this.cmpEl.find('ul > li').find('> a');
+                        this._search.index = $items.index($items.filter(':focus'));
+                    }
+                    this.selectCandidate();
+                }
+            },
+
+            selectCandidate: function() {
+                var index = this._search.index || 0,
+                    re = new RegExp('^' + ((this._search.full) ? this._search.text : this._search.char), 'i'),
+                    itemCandidate, idxCandidate;
+
+                for (var i=0; i<this.store.length; i++) {
+                    var item = this.store.at(i);
+                    if (re.test(item.get(this.displayField))) {
+                        if (!itemCandidate) {
+                            itemCandidate = item;
+                            idxCandidate = i;
+                        }
+                        if (this._search.full && i==index || i>index) {
+                            itemCandidate = item;
+                            idxCandidate = i;
+                            break;
+                        }
+                    }
+                }
+
+                if (itemCandidate) {
+                    this._search.index = idxCandidate;
+                    var item = $('#' + itemCandidate.get('id') + ' a', $(this.el));
+                    if (this.scroller) {
+                        this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible});
+                        var $list = $(this.el).find('ul');
+                        var itemTop = item.position().top,
+                            itemHeight = item.height(),
+                            listHeight = $list.height();
+                        if (itemTop < 0 || itemTop + itemHeight > listHeight) {
+                            $list.scrollTop($list.scrollTop() + itemTop + itemHeight - (listHeight/2));
+                        }
+                    }
+                    item.focus();
                 }
             },
 

apps/common/main/lib/component/ComboBoxFonts.js

@@ -56,7 +56,7 @@ define([
             thumbContext    = thumbCanvas.getContext('2d'),
             thumbPath       = '../../../../sdkjs/common/Images/fonts_thumbnail.png',
             thumbPath2x     = '../../../../sdkjs/common/Images/fonts_thumbnail@2x.png',
-            listItemHeight  = 36;
+            listItemHeight  = 26;
 
         if (typeof window['AscDesktopEditor'] === 'object') {
             thumbPath       = window['AscDesktopEditor'].getFontsSprite();
@@ -76,7 +76,7 @@ define([
                         '<li class="divider">',
                     '<% _.each(items, function(item) { %>',
                         '<li id="<%= item.id %>">',
-                            '<a class="font-item" tabindex="-1" type="menuitem" style="vertical-align:middle; margin: 0 0 0 -10px; height:<%=scope.getListItemHeight()%>px;"/>',
+                            '<a class="font-item" tabindex="-1" type="menuitem" style="height:<%=scope.getListItemHeight()%>px;"/>',
                         '</li>',
                     '<% }); %>',
                     '</ul>',
@@ -93,9 +93,12 @@ define([
                     }
                 }));
 
-                this.recent = _.isNumber(options.recent) ? options.recent : 3;
+                this.recent = _.isNumber(options.recent) ? options.recent : 5;
 
-                Common.NotificationCenter.on('fonts:change',    _.bind(this.onApiChangeFont, this));
+                var filter = Common.localStorage.getKeysFilter();
+                this.appPrefix = (filter && filter.length) ? filter.split(',')[0] : '';
+
+                // Common.NotificationCenter.on('fonts:change',    _.bind(this.onApiChangeFont, this));
                 Common.NotificationCenter.on('fonts:load',      _.bind(this.fillFonts, this));
             },
 
@@ -115,8 +118,6 @@ define([
                 this._input.on('focus',     _.bind(function() {this.inFormControl = true;}, this));
                 this._input.on('blur',      _.bind(function() {this.inFormControl = false;}, this));
 
-                this._modalParents = this.cmpEl.closest('.asc-window');
-
                 return this;
             },
 
@@ -322,6 +323,13 @@ define([
                     if (me.recent > 0) {
                         me.store.on('add', me.onInsertItem, me);
                         me.store.on('remove', me.onRemoveItem, me);
+
+                        Common.Utils.InternalSettings.set(me.appPrefix + "-settings-recent-fonts", Common.localStorage.getItem(me.appPrefix + "-settings-recent-fonts"));
+                        var arr = Common.Utils.InternalSettings.get(me.appPrefix + "-settings-recent-fonts");
+                        arr = arr ? arr.split(';') : [];
+                        arr.reverse().forEach(function(item) {
+                            item && me.addItemToRecent(me.store.findWhere({name: item}), true);
+                        });
                     }
                 });
             },
@@ -339,8 +347,6 @@ define([
                 var name = (_.isFunction(font.get_Name) ?  font.get_Name() : font.asc_getName());
 
                 if (this.getRawValue() !== name) {
-                    if (this._modalParents.length > 0) return;
-
                     var record = this.store.findWhere({
                         name: name
                     });
@@ -364,17 +370,17 @@ define([
             },
 
             itemClicked: function (e) {
+                Common.UI.ComboBox.prototype.itemClicked.apply(this, arguments);
+
                 var el = $(e.target).closest('li');
                 var record = this.store.findWhere({id: el.attr('id')});
                 this.addItemToRecent(record);
-
-                Common.UI.ComboBox.prototype.itemClicked.apply(this, arguments);
             },
 
             onInsertItem: function(item) {
                 $(this.el).find('ul').prepend(_.template([
                     '<li id="<%= item.id %>">',
-                        '<a class="font-item" tabindex="-1" type="menuitem" style="vertical-align:middle; margin: 0 0 0 -10px; height:<%=scope.getListItemHeight()%>px;"/>',
+                        '<a class="font-item" tabindex="-1" type="menuitem" style="height:<%=scope.getListItemHeight()%>px;"/>',
                     '</li>'
                 ].join(''))({
                     item: item.attributes,
@@ -387,6 +393,10 @@ define([
             },
 
             onBeforeShowMenu: function(e) {
+                if (this.store.length<1) {
+                    e.preventDefault();
+                    return;
+                }
                 Common.UI.ComboBox.prototype.onBeforeShowMenu.apply(this, arguments);
 
                 if (!this.getSelectedRecord() && !!this.getRawValue()) {
@@ -419,11 +429,12 @@ define([
                 Common.UI.ComboBox.prototype.onAfterHideMenu.apply(this, arguments);
             },
 
-            addItemToRecent: function(record) {
+            addItemToRecent: function(record, silent) {
                 if (this.recent<1) return;
 
-                if (record.get('type') != FONT_TYPE_RECENT &&
+                var font = this.store.findWhere({name: record.get('name'),type:FONT_TYPE_RECENT});
-                    !this.store.findWhere({name: record.get('name'),type:FONT_TYPE_RECENT})) {
+                font && this.store.remove(font);
+
                 var fonts = this.store.where({type:FONT_TYPE_RECENT});
                 if (!(fonts.length < this.recent)) {
                     this.store.remove(fonts[this.recent - 1]);
@@ -432,6 +443,15 @@ define([
                 var new_record = record.clone();
                 new_record.set({'type': FONT_TYPE_RECENT, 'id': Common.UI.getId(), cloneid: record.id});
                 this.store.add(new_record, {at:0});
+
+                if (!silent) {
+                    var arr = [];
+                    this.store.where({type:FONT_TYPE_RECENT}).forEach(function(item){
+                        arr.push(item.get('name'));
+                    });
+                    arr = arr.join(';');
+                    Common.localStorage.setItem(this.appPrefix + "-settings-recent-fonts", arr);
+                    Common.Utils.InternalSettings.set(this.appPrefix + "-settings-recent-fonts", arr);
                 }
             },
 

apps/common/main/lib/component/ComboDataView.js

@@ -245,11 +245,7 @@ define([
                 var picker = this.menuPicker;
                 if (picker) {
                     var record = picker.getSelectedRec();
-
-                    if (record) {
-                        record = record[0];
                     this.fillComboView(record || picker.store.at(0), !!record, true);
-                    }
 
                     picker.onResize();
                 }
@@ -311,7 +307,7 @@ define([
         },
 
         onAfterHideMenu: function(e, isFromInputControl) {
-            this.menuPicker.selectedBeforeHideRec = this.menuPicker.getSelectedRec()[0]; // for DataView - onKeyDown - Return key
+            this.menuPicker.selectedBeforeHideRec = this.menuPicker.getSelectedRec(); // for DataView - onKeyDown - Return key
             (this.showLast) ? this.menuPicker.showLastSelected() : this.menuPicker.deselectAll();
             this.trigger('hide:after', this, e, isFromInputControl);
         },
@@ -387,12 +383,9 @@ define([
                 var picker = this.menuPicker;
                 if (picker) {
                     var record = picker.getSelectedRec();
-                    if (record) {
-                        record = record[0];
                     this.fillComboView(record || picker.store.at(0), false);
                 }
             }
-            }
         },
 
         isDisabled: function() {
@@ -421,10 +414,11 @@ define([
                             }
                         }
 
-                        me.fieldPicker.store.reset([]); // remove all
+                        var indexRec = store.indexOf(record);
+                        if (indexRec < 0)
+                            return;
 
-                        var indexRec = store.indexOf(record),
+                        var countRec = store.length,
-                            countRec = store.length,
                             maxViewCount = Math.floor(Math.max(fieldPickerEl.width(), me.minWidth) / (me.itemWidth + (me.itemMarginLeft || 0) + (me.itemMarginRight || 0) + (me.itemPaddingLeft || 0) + (me.itemPaddingRight || 0) +
                                                                                                 (me.itemBorderLeft || 0) + (me.itemBorderRight || 0))),
                             newStyles = [];
@@ -432,9 +426,6 @@ define([
                         if (fieldPickerEl.height() / me.itemHeight > 2)
                             maxViewCount *= Math.floor(fieldPickerEl.height() / me.itemHeight);
 
-                        if (indexRec < 0)
-                            return;
-
                         indexRec = Math.floor(indexRec / maxViewCount) * maxViewCount;
                         if (countRec - indexRec < maxViewCount)
                             indexRec = Math.max(countRec - maxViewCount, 0);
@@ -442,7 +433,7 @@ define([
                             newStyles.push(store.at(index));
                         }
 
-                        me.fieldPicker.store.add(newStyles);
+                        me.fieldPicker.store.reset(newStyles);
                     }
 
                     if (forceSelect) {

apps/common/main/lib/component/DataView.js

@@ -151,7 +151,7 @@ define([
 
             var tip = el.data('bs.tooltip');
             if (tip) {
-                if (tip.dontShow===undefined)
+                if (tip.dontShow===undefined && el.is(':hover'))
                     tip.dontShow = true;
             }
 
@@ -389,17 +389,7 @@ define([
         },
 
         getSelectedRec: function() {
-            if (this.multiSelect) {
+            return (this.multiSelect) ? this.store.where({selected: true}) : this.store.findWhere({selected: true});
-
-                var items = [];
-                _.each(this.store.where({selected: true}), function(rec){
-                    items.push(rec);
-                });
-
-                return items;
-            }
-
-            return this.store.where({selected: true});
         },
 
         onAddItem: function(record, store, opts) {
@@ -601,7 +591,7 @@ define([
             if (_.indexOf(this.moveKeys, data.keyCode)>-1 || data.keyCode==Common.UI.Keys.RETURN) {
                 data.preventDefault();
                 data.stopPropagation();
-                var rec = this.getSelectedRec()[0];
+                var rec = this.getSelectedRec();
                 if (this.lastSelectedRec===null)
                     this.lastSelectedRec = rec;
                 if (data.keyCode==Common.UI.Keys.RETURN) {
@@ -699,8 +689,7 @@ define([
                 this.scrollToRecord(this.lastSelectedRec);
                 this.lastSelectedRec = null;
             } else {
-                var rec = this.getSelectedRec()[0];
+                this.scrollToRecord(this.getSelectedRec());
-                if (rec) this.scrollToRecord(rec);
             }
         },
 

apps/common/main/lib/component/InputField.js

@@ -239,6 +239,8 @@ define([
             },
 
             onKeyDown: function(e) {
+                this.trigger('keydown:before', this, e);
+
                 if (e.isDefaultPrevented())
                     return;
 

apps/common/main/lib/component/Menu.js

@@ -76,6 +76,11 @@
  *  Arrow of the {Common.UI.MenuItem} menu items
  *
  *
+ *  @property {Boolean/Number} restoreHeight
+ *
+ *  Adjust to the browser height and restore to restoreHeight when it's Number
+ *
+ *
  */
 
 if (Common === undefined)
@@ -143,7 +148,9 @@ define([
                 menuAlign   : 'tl-bl',
                 menuAlignEl : null,
                 offset      : [0, 0],
-                cyclic      : true
+                cyclic      : true,
+                search      : false,
+                scrollAlwaysVisible: true
             },
 
             template: _.template([
@@ -162,6 +169,13 @@ define([
                 this.offset         = [0, 0];
                 this.menuAlign      = this.options.menuAlign;
                 this.menuAlignEl    = this.options.menuAlignEl;
+                this.scrollAlwaysVisible = this.options.scrollAlwaysVisible;
+                this.search = this.options.search;
+
+                if (this.options.restoreHeight) {
+                    this.options.restoreHeight = (typeof (this.options.restoreHeight) == "number") ? this.options.restoreHeight : (this.options.maxHeight ? this.options.maxHeight : 100000);
+                    !this.options.maxHeight && (this.options.maxHeight = this.options.restoreHeight);
+                }
 
                 if (!this.options.cyclic) this.options.cls += ' no-cyclic';
 
@@ -217,6 +231,7 @@ define([
 
                 var rootEl = this.cmpEl.parent(),
                     menuRoot = (rootEl.attr('role') === 'menu') ? rootEl : rootEl.find('[role=menu]');
+                this.menuRoot = menuRoot;
 
                 if (menuRoot) {
                     if (!me.rendered) {
@@ -228,8 +243,17 @@ define([
                         });
                     }
 
+                    if (this.options.maxHeight) {
+                        menuRoot.css({'max-height': me.options.maxHeight});
+                        this.scroller = new Common.UI.Scroller({
+                            el: $(this.el).find('.dropdown-menu '),
+                            minScrollbarLength: 30,
+                            suppressScrollX: true,
+                            alwaysVisibleY: this.scrollAlwaysVisible
+                        });
+                    }
+
                     menuRoot.css({
-                        'max-height': me.options.maxHeight||'none',
                         position    : 'fixed',
                         right       : 'auto',
                         left        : -1000,
@@ -243,7 +267,6 @@ define([
                     this.parentEl.on('hide.bs.dropdown',    _.bind(me.onBeforeHideMenu, me));
                     this.parentEl.on('hidden.bs.dropdown',  _.bind(me.onAfterHideMenu, me));
                     this.parentEl.on('keydown.after.bs.dropdown', _.bind(me.onAfterKeydownMenu, me));
-                    menuRoot.on('scroll', _.bind(me.onScroll, me));
 
                     menuRoot.hover(
                         function(e) { me.isOver = true;},
@@ -294,10 +317,7 @@ define([
                     me.items.splice(index, 0, item);
 
                 if (this.rendered) {
-                    var menuRoot = (el.attr('role') === 'menu')
+                    var menuRoot = this.menuRoot;
-                        ? el
-                        : el.find('[role=menu]');
-
                     if (menuRoot) {
                         if (index < 0) {
                             menuRoot.append(item.render().el);
@@ -313,64 +333,6 @@ define([
                 }
             },
 
-            doLayout: function() {
-                if (this.options.maxHeight > 0) {
-                    if (!this.rendered) {
-                        this.mustLayout = true;
-                        return;
-                    }
-
-                    var me = this,
-                        el = this.cmpEl;
-
-                    var menuRoot = (el.attr('role') === 'menu') ? el : el.find('[role=menu]');
-
-                    if (!menuRoot.is(':visible')) {
-                        var pos = [menuRoot.css('left'), menuRoot.css('top')];
-                        menuRoot.css({
-                            left    : '-1000px',
-                            top     : '-1000px',
-                            display : 'block'
-                        });
-                    }
-
-                    var $items = menuRoot.find('li');
-
-                    if ($items.height() * $items.length > this.options.maxHeight) {
-                        var scroll = '<div class="menu-scroll top"></div>';
-                        menuRoot.prepend(scroll);
-
-                        scroll = '<div class="menu-scroll bottom"></div>';
-                        menuRoot.append(scroll);
-
-                        menuRoot.css({
-                            'box-shadow'        : 'none',
-                            'overflow-y'        : 'hidden',
-                            'padding-top'       : '18px'
-//                            'padding-bottom'    : '18px'
-                        });
-
-                        menuRoot.find('> li:last-of-type').css('margin-bottom',18);
-
-                        var addEvent = function( elem, type, fn ) {
-                            elem.addEventListener ? elem.addEventListener( type, fn, false ) : elem.attachEvent( "on" + type, fn );
-                        };
-
-                        var eventname=(/Firefox/i.test(navigator.userAgent))? 'DOMMouseScroll' : 'mousewheel';
-                        addEvent(menuRoot[0], eventname, _.bind(this.onMouseWheel,this));
-                        menuRoot.find('.menu-scroll').on('click', _.bind(this.onScrollClick, this));
-                    }
-
-                    if (pos) {
-                        menuRoot.css({
-                            display : '',
-                            left    : pos[0],
-                            top     : pos[1]
-                        });
-                    }
-                }
-            },
-
             addItem: function(item) {
                 this.insertItem(-1, item);
             },
@@ -405,19 +367,12 @@ define([
                     item.off('click').off('toggle');
                     item.remove();
                 });
-                this.rendered && this.cmpEl.find('.menu-scroll').off('click').remove();
 
                 me.items = [];
             },
 
             onBeforeShowMenu: function(e) {
                 Common.NotificationCenter.trigger('menu:show');
-
-                if (this.mustLayout) {
-                    delete this.mustLayout;
-                    this.doLayout.call(this);
-                }
-
                 this.trigger('show:before', this, e);
                 this.alignPosition();
             },
@@ -425,10 +380,8 @@ define([
             onAfterShowMenu: function(e) {
                 this.trigger('show:after', this, e);
                 if (this.scroller) {
-                    if (this.options.restoreHeight)
+                    this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible});
-                        this.scroller.update();
+                    var menuRoot = this.menuRoot,
-
-                    var menuRoot = (this.cmpEl.attr('role') === 'menu') ? this.cmpEl : this.cmpEl.find('[role=menu]'),
                         $selected = menuRoot.find('> li .checked');
                     if ($selected.length) {
                         var itemTop = $selected.position().top,
@@ -437,16 +390,10 @@ define([
                         if (itemTop < 0 || itemTop + itemHeight > listHeight) {
                             menuRoot.scrollTop(menuRoot.scrollTop() + itemTop + itemHeight - (listHeight/2));
                         }
+                        setTimeout(function(){$selected.focus();}, 1);
                     }
                 }
-
+                this._search = {};
-                if (this.$el.find('> ul > .menu-scroll').length) {
-                    var el = this.$el.find('li .checked')[0];
-                    if (el) {
-                        var offset = el.offsetTop - this.options.maxHeight / 2;
-                        this.scrollMenu(offset < 0 ? 0 : offset);
-                    }
-                }
             },
 
             onBeforeHideMenu: function(e) {
@@ -462,6 +409,10 @@ define([
             },
 
             onAfterKeydownMenu: function(e) {
+                this.trigger('keydown:before', this, e);
+                if (e.isDefaultPrevented())
+                    return;
+
                 if (e.keyCode == Common.UI.Keys.RETURN) {
                     var li = $(e.target).closest('li');
                     if (li.length<=0) li = $(e.target).parent().find('li .dataview');
@@ -477,24 +428,57 @@ define([
                 } else if (e.keyCode == Common.UI.Keys.ESC)  {
 //                    Common.NotificationCenter.trigger('menu:afterkeydown', e);
 //                    return false;
+                } else if (this.search && e.keyCode > 64 && e.keyCode < 91 && e.key){
+                    var me = this;
+                    clearTimeout(this._search.timer);
+                    this._search.timer = setTimeout(function () { me._search = {}; }, 1000);
+
+                    (!this._search.text) && (this._search.text = '');
+                    (!this._search.char) && (this._search.char = e.key);
+                    (this._search.char !== e.key) && (this._search.full = true);
+                    this._search.text += e.key;
+                    if (this._search.index===undefined) {
+                        var $items = this.menuRoot.find('> li').find('> a');
+                        this._search.index = $items.index($items.filter(':focus'));
+                    }
+                    this.selectCandidate();
                 }
             },
 
-            onScroll: function(item, e) {
+            selectCandidate: function() {
-                if (this.scroller) return;
+                var index = this._search.index || 0,
+                    re = new RegExp('^' + ((this._search.full) ? this._search.text : this._search.char), 'i'),
+                    itemCandidate, idxCandidate;
 
-                var menuRoot = (this.cmpEl.attr('role') === 'menu')
+                for (var i=0; i<this.items.length; i++) {
-                    ? this.cmpEl
+                    var item = this.items[i];
-                    : this.cmpEl.find('[role=menu]'),
+                    if (re.test(item.caption)) {
-                    scrollTop = menuRoot.scrollTop(),
+                        if (!itemCandidate) {
-                    top = menuRoot.find('.menu-scroll.top'),
+                            itemCandidate = item;
-                    bottom = menuRoot.find('.menu-scroll.bottom');
+                            idxCandidate = i;
-                if (this.fromKeyDown) {
+                        }
-                    top.css('top', scrollTop + 'px');
+                        if (this._search.full && i==index || i>index) {
-                    bottom.css('bottom', (-scrollTop) + 'px');
+                            itemCandidate = item;
+                            idxCandidate = i;
+                            break;
+                        }
+                    }
+                }
+
+                if (itemCandidate) {
+                    this._search.index = idxCandidate;
+                    var item = itemCandidate.cmpEl.find('a');
+                    if (this.scroller) {
+                        this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible});
+                        var itemTop = item.position().top,
+                            itemHeight = item.height(),
+                            listHeight = this.menuRoot.height();
+                        if (itemTop < 0 || itemTop + itemHeight > listHeight) {
+                            this.menuRoot.scrollTop(this.menuRoot.scrollTop() + itemTop + itemHeight - (listHeight/2));
+                        }
+                    }
+                    item.focus();
                 }
-                top.toggleClass('disabled', scrollTop<1);
-                bottom.toggleClass('disabled', scrollTop + this.options.maxHeight > menuRoot[0].scrollHeight-1);
             },
 
             onItemClick: function(item, e) {
@@ -514,32 +498,6 @@ define([
                 this.trigger('item:toggle', this, item, state, e);
             },
 
-            onScrollClick: function(e) {
-                if (/disabled/.test(e.currentTarget.className)) return false;
-
-                this.scrollMenu(/top/.test(e.currentTarget.className));
-                return false;
-            },
-
-            onMouseWheel: function(e) {
-                this.scrollMenu(((e.detail && -e.detail) || e.wheelDelta) > 0);
-            },
-
-            scrollMenu: function(up) {
-                this.fromKeyDown = false;
-                var menuRoot = (this.cmpEl.attr('role') === 'menu')
-                        ? this.cmpEl
-                        : this.cmpEl.find('[role=menu]'),
-                    value = typeof(up)==='boolean'
-                        ? menuRoot.scrollTop() + (up ? -20 : 20)
-                        : up;
-
-                menuRoot.scrollTop(value);
-
-                menuRoot.find('.menu-scroll.top').css('top', menuRoot.scrollTop() + 'px');
-                menuRoot.find('.menu-scroll.bottom').css('bottom', (-menuRoot.scrollTop()) + 'px');
-            },
-
             setOffset: function(offsetX, offsetY) {
                 this.offset[0] = _.isUndefined(offsetX) ? this.offset[0] : offsetX;
                 this.offset[1] = _.isUndefined(offsetY) ? this.offset[1] : offsetY;
@@ -550,10 +508,8 @@ define([
                 return this.offset;
             },
 
-            alignPosition: function() {
+            alignPosition: function(fixedAlign, fixedOffset) {
-                var menuRoot    = (this.cmpEl.attr('role') === 'menu')
+                var menuRoot = this.menuRoot,
-                        ? this.cmpEl
-                        : this.cmpEl.find('[role=menu]'),
                     menuParent  = this.menuAlignEl || menuRoot.parent(),
                     m           = this.menuAlign.match(/^([a-z]+)-([a-z]+)/),
                     offset      = menuParent.offset(),
@@ -590,15 +546,24 @@ define([
                     if (typeof (this.options.restoreHeight) == "number") {
                         if (top + menuH > docH) {
                             menuRoot.css('max-height', (docH - top) + 'px');
-                            menuH = menuRoot.outerHeight();
+                            (!this.scroller) && (this.scroller = new Common.UI.Scroller({
+                                el: $(this.el).find('.dropdown-menu '),
+                                minScrollbarLength: 30,
+                                suppressScrollX: true,
+                                alwaysVisibleY: this.scrollAlwaysVisible
+                            }));
                         } else if ( top + menuH < docH && menuRoot.height() < this.options.restoreHeight) {
                             menuRoot.css('max-height', (Math.min(docH - top, this.options.restoreHeight)) + 'px');
-                            menuH = menuRoot.outerHeight();
                         }
                     }
                 } else {
-                    if (top + menuH > docH)
+                    if (top + menuH > docH) {
+                        if (fixedAlign && typeof fixedAlign == 'string') { // how to align if menu height > window height
+                            m = fixedAlign.match(/^([a-z]+)-([a-z]+)/);
+                            top  = offset.top  - posMenu[m[1]][1] + posParent[m[2]][1] + this.offset[1] + (fixedOffset || 0);
+                        } else
                             top = docH - menuH;
+                    }
 
                     if (top < 0)
                         top = 0;
@@ -607,7 +572,7 @@ define([
                 if (this.options.additionalAlign)
                     this.options.additionalAlign.call(this, menuRoot, left, top);
                 else
-                    menuRoot.css({left: left, top: top});
+                    menuRoot.css({left: Math.ceil(left), top: Math.ceil(top)});
             },
 
             clearAll: function() {

apps/common/main/lib/component/Mixtbar.js

@@ -286,6 +286,7 @@ define([
                     if ( $tp.length ) {
                         $tp.addClass('active');
                     }
+                    this.fireEvent('tab:active', [tab]);
                 }
             },
 

apps/common/main/lib/component/MultiSliderGradient.js

@@ -54,7 +54,11 @@ define([
             maxValue: 100,
             values: [0, 100],
             colorValues: ['#000000', '#ffffff'],
-            currentThumb: 0
+            currentThumb: 0,
+            thumbTemplate: '<div class="thumb img-commonctrl" style="">' +
+                            '<div class="thumb-top"></div>' +
+                            '<div class="thumb-bottom"></div>' +
+                            '</div>'
         },
 
         disabled: false,
@@ -63,38 +67,20 @@ define([
             '<div class="slider multi-slider-gradient">',
             '<div class="track"></div>',
             '<% _.each(items, function(item) { %>',
-            '<div class="thumb img-commonctrl" style="">',
+            '<%= thumbTemplate %>',
-                '<div class="thumb-top"></div>',
-                '<div class="thumb-bottom"></div>',
-            '</div>',
             '<% }); %>',
             '</div>'
         ].join('')),
 
         initialize : function(options) {
-            this.styleStr = '';
+            this.styleStr = {};
-            if (Common.Utils.isChrome && Common.Utils.chromeVersion<10 || Common.Utils.isSafari && Common.Utils.safariVersion<5.1)
-                this.styleStr = '-webkit-gradient(linear, left top, right top, color-stop({1}%,{0}), color-stop({3}%,{2})); /* Chrome,Safari4+ */';
-            else if (Common.Utils.isChrome || Common.Utils.isSafari)
-                this.styleStr = '-webkit-linear-gradient(left, {0} {1}%, {2} {3}%)';
-            else if (Common.Utils.isGecko)
-                this.styleStr = '-moz-linear-gradient(left, {0} {1}%, {2} {3}%)';
-            else if (Common.Utils.isOpera && Common.Utils.operaVersion>11.0)
-                this.styleStr = '-o-linear-gradient(left, {0} {1}%, {2} {3}%)';
-            else if (Common.Utils.isIE)
-                this.styleStr = '-ms-linear-gradient(left, {0} {1}%, {2} {3}%)';
-
-            this.colorValues = this.options.colorValues;
-
             Common.UI.MultiSlider.prototype.initialize.call(this, options);
         },
 
         render : function(parentEl) {
             Common.UI.MultiSlider.prototype.render.call(this, parentEl);
 
-            var me = this,
+            var me = this;
-                style = '';
-
             me.trackEl = me.cmpEl.find('.track');
 
             for (var i=0; i<me.thumbs.length; i++) {
@@ -102,33 +88,24 @@ define([
                     me.trigger('thumbdblclick', me);
                 });
                 me.thumbs[i].thumbcolor = me.thumbs[i].thumb.find('> div');
+                me.setColorValue(me.options.colorValues[i], i);
             }
 
-            if (me.styleStr!=='') {
+            me.changeSliderStyle();
-                style = Common.Utils.String.format(me.styleStr, me.colorValues[0], 0, me.colorValues[1], 100);
+            me.changeGradientStyle();
-                me.trackEl.css('background', style);
-            }
-            if (Common.Utils.isIE) {
-                style = Common.Utils.String.format('progid:DXImageTransform.Microsoft.gradient( startColorstr={0}, endColorstr={1},GradientType=1 )',
-                    me.colorValues[0], me.colorValues[1]);
-                me.trackEl.css('filter', style);
-            }
-            style = Common.Utils.String.format('linear-gradient(to right, {0} {1}%, {2} {3}%)', me.colorValues[0], 0, me.colorValues[1], 100);
-            me.trackEl.css('background', style);
-
             me.on('change', _.bind(me.changeGradientStyle, me));
         },
 
         setColorValue: function(color, index) {
             var ind = (index!==undefined) ? index : this.currentThumb;
-            this.colorValues[ind] = color;
+            this.thumbs[ind].colorValue = color;
             this.thumbs[ind].thumbcolor.css('background-color', color);
             this.changeGradientStyle();
         },
 
         getColorValue: function(index) {
             var ind = (index!==undefined) ? index : this.currentThumb;
-            return this.colorValues[ind];
+            return this.thumbs[ind].colorValue;
         },
 
         setValue: function(index, value) {
@@ -136,32 +113,88 @@ define([
             this.changeGradientStyle();
         },
 
+        getColorValues: function() {
+            var values = [];
+            _.each (this.thumbs, function(thumb) {
+                values.push(thumb.colorValue);
+            });
+
+            return values;
+        },
+
         changeGradientStyle: function() {
             if (!this.rendered) return;
             var style;
-            if (this.styleStr!=='') {
+            if (this.styleStr.specific) {
-                style = Common.Utils.String.format(this.styleStr, this.colorValues[0], this.getValue(0), this.colorValues[1], this.getValue(1));
+                style = Common.Utils.String.format(this.styleStr.specific, this.getColorValues().concat(this.getValues()));
                 this.trackEl.css('background', style);
             }
             if (Common.Utils.isIE) {
                 style = Common.Utils.String.format('progid:DXImageTransform.Microsoft.gradient( startColorstr={0}, endColorstr={1},GradientType=1 )',
-                    this.colorValues[0], this.colorValues[1]);
+                    this.getColorValue(0), this.getColorValue(this.thumbs.length-1));
                 this.trackEl.css('filter', style);
             }
-            style = Common.Utils.String.format('linear-gradient(to right, {0} {1}%, {2} {3}%)',  this.colorValues[0], this.getValue(0), this.colorValues[1], this.getValue(1));
+            if (this.styleStr.common) {
+                style = Common.Utils.String.format(this.styleStr.common, this.getColorValues().concat(this.getValues()));
                 this.trackEl.css('background', style);
+            }
         },
 
         sortThumbs: function() {
-            var recalc_indexes = Common.UI.MultiSlider.prototype.sortThumbs.call(this),
+            var recalc_indexes = Common.UI.MultiSlider.prototype.sortThumbs.call(this);
-                new_colors = [],
+            this.trigger('sortthumbs', this, recalc_indexes);
-                me = this;
-            _.each (recalc_indexes, function(recalc_index) {
-                new_colors.push(me.colorValues[recalc_index]);
-            });
-            this.colorValues = new_colors;
-            this.trigger('sortthumbs', me, recalc_indexes);
             return recalc_indexes;
+        },
+
+        addThumb: function() {
+            Common.UI.MultiSlider.prototype.addThumb.call(this);
+
+            var me = this,
+                index = me.thumbs.length-1;
+            me.thumbs[index].thumb.on('dblclick', null, function() {
+                me.trigger('thumbdblclick', me);
+            });
+            me.thumbs[index].thumbcolor = me.thumbs[index].thumb.find('> div');
+            (index>0) && this.setColorValue(this.getColorValue(index-1), index);
+            me.changeSliderStyle();
+        },
+
+        removeThumb: function(index) {
+            if (index===undefined) index = this.thumbs.length-1;
+            if (index>0) {
+                this.thumbs[index].thumb.remove();
+                this.thumbs.splice(index, 1);
+                this.changeSliderStyle();
+            }
+        },
+
+        changeSliderStyle: function() {
+            this.styleStr = {
+                specific: '',
+                common: 'linear-gradient(to right'
+            };
+
+            if (Common.Utils.isChrome && Common.Utils.chromeVersion<10 || Common.Utils.isSafari && Common.Utils.safariVersion<5.1)
+                this.styleStr.specific = '-webkit-gradient(linear, left top, right top';  /* Chrome,Safari4+ */
+            else if (Common.Utils.isChrome || Common.Utils.isSafari)
+                this.styleStr.specific = '-webkit-linear-gradient(left';
+            else if (Common.Utils.isGecko)
+                this.styleStr.specific = '-moz-linear-gradient(left';
+            else if (Common.Utils.isOpera && Common.Utils.operaVersion>11.0)
+                this.styleStr.specific = '-o-linear-gradient(left';
+            else if (Common.Utils.isIE)
+                this.styleStr.specific = '-ms-linear-gradient(left';
+
+            for (var i=0; i<this.thumbs.length; i++) {
+                this.styleStr.common += ', {' + i + '} {' + (this.thumbs.length + i) + '}%';
+                if (Common.Utils.isChrome && Common.Utils.chromeVersion<10 || Common.Utils.isSafari && Common.Utils.safariVersion<5.1)
+                    this.styleStr.specific += ', color-stop({' + (this.thumbs.length + i) + '}%,{' + i + '})';
+                else
+                    this.styleStr.specific += ', {' + i + '} {' + (this.thumbs.length + i) + '}%';
+
+            }
+            this.styleStr.specific += ')';
+            this.styleStr.common += ')';
         }
     });
 });

apps/common/main/lib/component/RadioBox.js

@@ -107,6 +107,9 @@ define([
         },
 
         setDisabled: function(disabled) {
+            if (!this.rendered)
+                return;
+
             if (disabled !== this.disabled) {
                 this.$radio.toggleClass('disabled', disabled);
                 (disabled) ? this.$radio.attr({disabled: disabled}) : this.$radio.removeAttr('disabled');

apps/common/main/lib/component/Scroller.js

@@ -165,7 +165,12 @@ define([
                     $(this.el).find('.ps-scrollbar-y-rail').removeClass('always-visible-y');
                     $(this.el).find('.ps-scrollbar-y').addClass('always-visible-y');
                 }
+            },
+
+            isVisible: function() {
+                return $(this.el).find('.ps-scrollbar-y-rail').is(':visible');
             }
+
         }), {
             isMouseCapture: function() {
                 return mouseCapture

apps/common/main/lib/component/Slider.js

@@ -277,7 +277,8 @@ define([
             width: 100,
             minValue: 0,
             maxValue: 100,
-            values: [0, 100]
+            values: [0, 100],
+            thumbTemplate: '<div class="thumb" style=""></div>'
         },
 
         disabled: false,
@@ -290,7 +291,7 @@ define([
                     '<div class="track-right" style=""></div>',
                 '</div>',
                 '<% _.each(items, function(item) { %>',
-                '<div class="thumb" style=""></div>',
+                '<%= thumbTemplate %>',
                 '<% }); %>',
             '</div>'
         ].join('')),
@@ -317,7 +318,8 @@ define([
 
             if (!me.rendered) {
                 this.cmpEl = $(this.template({
-                    items: this.options.values
+                    items: this.options.values,
+                    thumbTemplate: this.options.thumbTemplate
                 }));
 
                 if (parentEl) {
@@ -353,8 +355,8 @@ define([
                 if (need_sort)
                     me.sortThumbs();
 
-                $(document).off('mouseup', onMouseUp);
+                $(document).off('mouseup', me.binding.onMouseUp);
-                $(document).off('mousemove', onMouseMove);
+                $(document).off('mousemove', me.binding.onMouseMove);
 
                 me._dragstart = undefined;
                 me.trigger('changecomplete', me, value, lastValue);
@@ -399,8 +401,8 @@ define([
                     (index == idx) ? item.thumb.css('z-index', 500) : item.thumb.css('z-index', '');
                 });
 
-                $(document).on('mouseup', null, e.data, onMouseUp);
+                $(document).on('mouseup', null, e.data, me.binding.onMouseUp);
-                $(document).on('mousemove', null, e.data, onMouseMove);
+                $(document).on('mousemove', null, e.data, me.binding.onMouseMove);
             };
 
             var onTrackMouseDown = function (e) {
@@ -443,6 +445,12 @@ define([
                 return index;
             };
 
+            this.binding = {
+                onMouseUp:   _.bind(onMouseUp, this),
+                onMouseMove: _.bind(onMouseMove, this),
+                onMouseDown: _.bind(onMouseDown, this)
+            };
+
             this.$thumbs = el.find('.thumb');
             _.each(this.$thumbs, function(item, index) {
                 var thumb = $(item);
@@ -451,7 +459,7 @@ define([
                     index: index
                 });
                 me.setValue(index, me.options.values[index]);
-                thumb.on('mousedown', null, me.thumbs[index], onMouseDown);
+                thumb.on('mousedown', null, me.thumbs[index], me.binding.onMouseDown);
             });
             me.setActiveThumb(0, true);
 
@@ -481,7 +489,6 @@ define([
             this.setThumbPosition(index, Math.round((value-this.minValue)*this.delta));
         },
 
-
         getValue: function(index) {
             return this.thumbs[index].value;
         },
@@ -511,6 +518,35 @@ define([
                 thumb.index = index;
             });
             return recalc_indexes;
+        },
+
+        setThumbs: function(count) {
+            var length = this.thumbs.length;
+            if (length==count) return;
+
+            for (var i=0; i<Math.abs(count-length); i++)
+                (length<count) ? this.addThumb() : this.removeThumb();
+        },
+
+        addThumb: function() {
+            var el = this.cmpEl,
+                thumb = $(this.options.thumbTemplate),
+                index = this.thumbs.length;
+            el.append(thumb);
+            this.thumbs.push({
+                thumb: thumb,
+                index: index
+            });
+            (index>0) && this.setValue(index, this.getValue(index-1));
+            thumb.on('mousedown', null, this.thumbs[index], this.binding.onMouseDown);
+        },
+
+        removeThumb: function(index) {
+            if (index===undefined) index = this.thumbs.length-1;
+            if (index>0) {
+                this.thumbs[index].thumb.remove();
+                this.thumbs.splice(index, 1);
+            }
         }
     });
 });

apps/common/main/lib/component/Window.js

@@ -164,7 +164,7 @@ define([
                                     '<% if (closable!==false) %>' +
                                         '<div class="tool close img-commonctrl"></div>' +
                                     '<% %>' +
-                                    '<span class="title"><%= title %></span> ' +
+                                    '<div class="title"><%= title %></div> ' +
                                 '</div>' +
                             '<% } %>' +
                             '<div class="body"><%= tpl %></div>' +
@@ -639,7 +639,10 @@ define([
             show: function(x,y) {
                 if (this.initConfig.modal) {
                     var mask = _getMask();
-                    if (this.options.animate !== false) {
+                    if (this.options.animate === false || this.options.animate && this.options.animate.mask === false) { // animate.mask = false -> don't animate mask
+                        mask.attr('counter', parseInt(mask.attr('counter'))+1);
+                        mask.show();
+                    } else {
                         var opacity = mask.css('opacity');
                         mask.css('opacity', 0);
                         mask.attr('counter', parseInt(mask.attr('counter'))+1);
@@ -648,9 +651,6 @@ define([
                         setTimeout(function () {
                             mask.css(_getTransformation(opacity));
                         }, 1);
-                    } else {
-                        mask.attr('counter', parseInt(mask.attr('counter'))+1);
-                        mask.show();
                     }
 
                     Common.NotificationCenter.trigger('modal:show', this);

apps/common/main/lib/controller/Comments.js

@@ -252,6 +252,7 @@ define([
                 ascComment.asc_putUserId(comment.get('userid'));
                 ascComment.asc_putUserName(comment.get('username'));
                 ascComment.asc_putSolved(!comment.get('resolved'));
+                ascComment.asc_putGuid(comment.get('guid'));
 
                 if (!_.isUndefined(ascComment.asc_putDocumentFlag)) {
                     ascComment.asc_putDocumentFlag(comment.get('unattached'));
@@ -344,6 +345,7 @@ define([
                     ascComment.asc_putUserId(t.currentUserId);
                     ascComment.asc_putUserName(t.currentUserName);
                     ascComment.asc_putSolved(comment.get('resolved'));
+                    ascComment.asc_putGuid(comment.get('guid'));
 
                     if (!_.isUndefined(ascComment.asc_putDocumentFlag)) {
                         ascComment.asc_putDocumentFlag(comment.get('unattached'));
@@ -400,6 +402,7 @@ define([
                     ascComment.asc_putUserId(comment.get('userid'));
                     ascComment.asc_putUserName(comment.get('username'));
                     ascComment.asc_putSolved(comment.get('resolved'));
+                    ascComment.asc_putGuid(comment.get('guid'));
 
                     if (!_.isUndefined(ascComment.asc_putDocumentFlag)) {
                         ascComment.asc_putDocumentFlag(comment.get('unattached'));
@@ -462,6 +465,7 @@ define([
                     ascComment.asc_putUserId(comment.get('userid'));
                     ascComment.asc_putUserName(comment.get('username'));
                     ascComment.asc_putSolved(comment.get('resolved'));
+                    ascComment.asc_putGuid(comment.get('guid'));
 
                     if (!_.isUndefined(ascComment.asc_putDocumentFlag)) {
                         ascComment.asc_putDocumentFlag(comment.get('unattached'));
@@ -495,6 +499,7 @@ define([
                         ascComment.asc_addReply(addReply);
 
                         me.api.asc_changeComment(id, ascComment);
+                        me.mode && me.mode.canRequestUsers && me.view.pickEMail(ascComment.asc_getGuid(), replyVal);
 
                         return true;
                     }
@@ -519,6 +524,7 @@ define([
                     ascComment.asc_putUserId(comment.get('userid'));
                     ascComment.asc_putUserName(comment.get('username'));
                     ascComment.asc_putSolved(comment.get('resolved'));
+                    ascComment.asc_putGuid(comment.get('guid'));
 
                     if (!_.isUndefined(ascComment.asc_putDocumentFlag)) {
                         ascComment.asc_putDocumentFlag(comment.get('unattached'));
@@ -1125,7 +1131,9 @@ define([
             if (_.isUndefined(this.popover)) {
                 this.popover = Common.Views.ReviewPopover.prototype.getPopover({
                     commentsStore : this.popoverComments,
-                    renderTo : this.sdkViewName
+                    renderTo : this.sdkViewName,
+                    canRequestUsers: (this.mode) ? this.mode.canRequestUsers : undefined,
+                    canRequestSendNotify: (this.mode) ? this.mode.canRequestSendNotify : undefined
                 });
                 this.popover.setCommentsStore(this.popoverComments);
             }
@@ -1190,6 +1198,7 @@ define([
                 groupname = id.substr(0, id.lastIndexOf('_')+1).match(/^(doc|sheet[0-9_]+)_/);
             var comment = new Common.Models.Comment({
                 uid                 : id,
+                guid                : data.asc_getGuid(),
                 userid              : data.asc_getUserId(),
                 username            : data.asc_getUserName(),
                 usercolor           : (user) ? user.get('color') : null,
@@ -1345,7 +1354,7 @@ define([
 
                     this.api.asc_addComment(comment);
                     this.view.showEditContainer(false);
-
+                    this.mode && this.mode.canRequestUsers && this.view.pickEMail(comment.asc_getGuid(), commentVal);
                     if (!_.isUndefined(this.api.asc_SetDocumentPlaceChangedEnabled)) {
                         this.api.asc_SetDocumentPlaceChangedEnabled(false);
                     }

apps/common/main/lib/controller/Desktop.js

@@ -125,6 +125,12 @@ define([
                     if ( opts == 'preloader:hide' ) {
                         app.execCommand('editor:onready', '');
                         return true;
+                    } else
+                    if ( opts == 'create:new' ) {
+                        if (config.createUrl == 'desktop://create.new') {
+                            app.LocalFileCreate(!!window.SSE ? 2 : !!window.PE ? 1 : 0);
+                            return true;
+                        }
                     }
                 }
 

apps/common/main/lib/controller/Fonts.js

@@ -48,10 +48,10 @@ define([
     'common/main/lib/collection/Fonts'
 ], function () { 'use strict';
     Common.Controllers.Fonts = Backbone.Controller.extend((function() {
-        var FONT_TYPE_USERUSED = 4;
+        var FONT_TYPE_RECENT = 4;
 
         function isFontSaved(store, rec) {
-            var out = rec.get('type') == FONT_TYPE_USERUSED,
+            var out = rec.get('type') == FONT_TYPE_RECENT,
                 i = -1,
                 c = store.length,
                 su,
@@ -59,7 +59,7 @@ define([
             while (!out && ++i < c) {
                 su = store.at(i);
 
-                if (su.get('type') != FONT_TYPE_USERUSED)
+                if (su.get('type') != FONT_TYPE_RECENT)
                     break;
 
                 out = su.get('name') == n;
@@ -78,7 +78,7 @@ define([
 //                    name: data.name,
 //                    imgidx: data.imgidx,
 //                    cloneid: node.querySelector('img').id,
-//                    type: FONT_TYPE_USERUSED
+//                    type: FONT_TYPE_RECENT
 //                };
 //                combo.getStore().insert(0,[font]);
 //
@@ -93,7 +93,7 @@ define([
 //                }
 //
 //                font = combo.getStore().getAt(5);
-//                if (font.data.type==FONT_TYPE_USERUSED) {
+//                if (font.data.type==FONT_TYPE_RECENT) {
 //                    combo.getStore().remove(font);
 //                } else {
 //                    var plugin = combo.getPlugin('scrollpane');

apps/common/main/lib/controller/History.js

@@ -113,7 +113,7 @@ define([
                         Common.Gateway.requestRestore(record.get('revision'));
                     else {
                         this.isFromSelectRevision = record.get('revision');
-                        this.api.asc_DownloadAs(Asc.c_oAscFileType.DOCX, true);
+                        this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(Asc.c_oAscFileType.DOCX, true));
                     }
                     return;
                 }

apps/common/main/lib/controller/Plugins.js

@@ -45,6 +45,9 @@ define([
 
     Common.Controllers.Plugins = Backbone.Controller.extend(_.extend({
         models: [],
+        appOptions: {},
+        configPlugins: {autostart:[]},// {config: 'from editor config', plugins: 'loaded plugins', UIplugins: 'loaded customization plugins', autostart: 'autostart guids'}
+        serverPlugins: {autostart:[]},// {config: 'from editor config', plugins: 'loaded plugins', autostart: 'autostart guids'}
         collections: [
             'Common.Collections.Plugins'
         ],
@@ -95,7 +98,54 @@ define([
 
 
             this._moveOffset = {x:0, y:0};
-            this.autostart = null;
+            this.autostart = [];
+
+            Common.Gateway.on('init', this.loadConfig.bind(this));
+            Common.NotificationCenter.on('app:face', this.onAppShowed.bind(this));
+        },
+
+        loadConfig: function(data) {
+            var me = this;
+            me.configPlugins.config = data.config.plugins;
+            me.editor = !!window.DE ? 'word' : !!window.PE ? 'slide' : 'cell';
+        },
+
+        loadPlugins: function() {
+            if (this.configPlugins.config) {
+                this.getPlugins(this.configPlugins.config.pluginsData)
+                    .then(function(loaded)
+                    {
+                        me.configPlugins.plugins = loaded;
+                        me.mergePlugins();
+                    })
+                    .catch(function(err)
+                    {
+                        me.configPlugins.plugins = false;
+                    });
+            } else
+                this.configPlugins.plugins = false;
+
+            var server_plugins_url = '../../../../plugins.json',
+                me = this;
+            Common.Utils.loadConfig(server_plugins_url, function (obj) {
+                if ( obj != 'error' ) {
+                    me.serverPlugins.config = obj;
+                    me.getPlugins(me.serverPlugins.config.pluginsData)
+                        .then(function(loaded)
+                        {
+                            me.serverPlugins.plugins = loaded;
+                            me.mergePlugins();
+                        })
+                        .catch(function(err)
+                        {
+                            me.serverPlugins.plugins = false;
+                        });
+                } else
+                    me.serverPlugins.plugins = false;
+            });
+        },
+
+        onAppShowed: function (config) {
         },
 
         setApi: function(api) {
@@ -106,14 +156,18 @@ define([
             this.api.asc_registerCallback("asc_onPluginResize", _.bind(this.onPluginResize, this));
             this.api.asc_registerCallback("asc_onPluginMouseUp", _.bind(this.onPluginMouseUp, this));
             this.api.asc_registerCallback("asc_onPluginMouseMove", _.bind(this.onPluginMouseMove, this));
+            this.api.asc_registerCallback('asc_onPluginsReset', _.bind(this.resetPluginsList, this));
+            this.api.asc_registerCallback('asc_onPluginsInit', _.bind(this.onPluginsInit, this));
 
+            this.loadPlugins();
             return this;
         },
 
         setMode: function(mode) {
-            if (mode.canPlugins) {
+            this.appOptions = mode;
-                this.updatePluginsList();
+            this.customPluginsComplete = !this.appOptions.canBrandingExt;
-            }
+            if (this.appOptions.canBrandingExt)
+                this.getAppCustomPlugins(this.configPlugins);
             return this;
         },
 
@@ -138,7 +192,7 @@ define([
             });
         },
 
-        updatePluginsList: function() {
+        refreshPluginsList: function() {
             var me = this;
             var storePlugins = this.getApplication().getCollection('Common.Collections.Plugins'),
                 arr = [];
@@ -147,6 +201,7 @@ define([
                 plugin.set_Name(item.get('name'));
                 plugin.set_Guid(item.get('guid'));
                 plugin.set_BaseUrl(item.get('baseUrl'));
+
                 var variations = item.get('variations'),
                     variationsArr = [];
                 variations.forEach(function(itemVar){
@@ -168,8 +223,10 @@ define([
                     variation.set_Size(itemVar.get('size'));
                     variation.set_InitOnSelectionChanged(itemVar.get('initOnSelectionChanged'));
                     variation.set_Events(itemVar.get('events'));
+
                     variationsArr.push(variation);
                 });
+
                 plugin.set_Variations(variationsArr);
                 item.set('pluginObj', plugin);
                 arr.push(plugin);
@@ -193,6 +250,7 @@ define([
 
         onResetPlugins: function (collection) {
             var me = this;
+            me.appOptions.canPlugins = !collection.isEmpty();
             if ( me.$toolbarPanelPlugins ) {
                 me.$toolbarPanelPlugins.empty();
 
@@ -217,6 +275,8 @@ define([
                     rank = new_rank;
                 });
                 _group.appendTo(me.$toolbarPanelPlugins);
+            } else {
+                console.error('toolbar panel isnot created');
             }
         },
 
@@ -357,7 +417,7 @@ define([
             else if (this.panelPlugins.iframePlugin)
                 this.panelPlugins.closeInsideMode();
             this.panelPlugins.closedPluginMode(plugin.get_Guid());
-            this.runAutoStartPlugins(this.autostart);
+            this.runAutoStartPlugins();
         },
 
         onPluginResize: function(size, minSize, maxSize, callback ) {
@@ -396,13 +456,229 @@ define([
                 Common.NotificationCenter.trigger('frame:mousemove', { pageX: x*Common.Utils.zoom()+this._moveOffset.x, pageY: y*Common.Utils.zoom()+this._moveOffset.y });
         },
 
-        runAutoStartPlugins: function(autostart) {
+        onPluginsInit: function(pluginsdata) {
-            if (autostart && autostart.length>0) {
+            !(pluginsdata instanceof Array) && (pluginsdata = pluginsdata["pluginsData"]);
-                var guid = autostart.shift();
+            this.parsePlugins(pluginsdata)
-                this.autostart = autostart;
+        },
-                this.api.asc_pluginRun(guid, 0, '');
+
+        runAutoStartPlugins: function() {
+            if (this.autostart && this.autostart.length > 0) {
+                this.api.asc_pluginRun(this.autostart.shift(), 0, '');
             }
+        },
+
+        resetPluginsList: function() {
+            this.getApplication().getCollection('Common.Collections.Plugins').reset();
+        },
+
+        applyUICustomization: function () {
+            var me = this;
+            return new Promise(function(resolve, reject) {
+                var timer_sl = setInterval(function() {
+                    if ( me.customPluginsComplete ) {
+                        clearInterval(timer_sl);
+                        try {
+                            me.configPlugins.UIplugins && me.configPlugins.UIplugins.forEach(function (c) {
+                                if ( c.code ) eval(c.code);
+                            });
+                        } catch (e) {}
+                        resolve();
+                    }
+                }, 10);
+            });
+        },
+
+        parsePlugins: function(pluginsdata, uiCustomize) {
+            var me = this;
+            var pluginStore = this.getApplication().getCollection('Common.Collections.Plugins'),
+                isEdit = me.appOptions.isEdit,
+                editor = me.editor;
+            if ( pluginsdata instanceof Array ) {
+                var arr = [], arrUI = [],
+                    lang = me.appOptions.lang.split(/[\-_]/)[0];
+                pluginsdata.forEach(function(item){
+                    if ( arr.some(function(i) {
+                                return (i.get('baseUrl') == item.baseUrl || i.get('guid') == item.guid);
+                            }
+                        ) || pluginStore.findWhere({baseUrl: item.baseUrl}) || pluginStore.findWhere({guid: item.guid}))
+                    {
+                        return;
                     }
 
+                    var variationsArr = [],
+                        pluginVisible = false;
+                    item.variations.forEach(function(itemVar){
+                        var visible = (isEdit || itemVar.isViewer && (itemVar.isDisplayedInViewer!==false)) && _.contains(itemVar.EditorsSupport, editor) && !itemVar.isSystem;
+                        if ( visible ) pluginVisible = true;
+
+                        if (item.isUICustomizer ) {
+                            visible && arrUI.push({
+                                url: item.baseUrl + itemVar.url
+                            });
+                        } else {
+                            var model = new Common.Models.PluginVariation(itemVar);
+                            var description = itemVar.description;
+                            if (typeof itemVar.descriptionLocale == 'object')
+                                description = itemVar.descriptionLocale[lang] || itemVar.descriptionLocale['en'] || description || '';
+
+                            _.each(itemVar.buttons, function(b, index){
+                                if (typeof b.textLocale == 'object')
+                                    b.text = b.textLocale[lang] || b.textLocale['en'] || b.text || '';
+                                b.visible = (isEdit || b.isViewer !== false);
+                            });
+
+                            model.set({
+                                description: description,
+                                index: variationsArr.length,
+                                url: itemVar.url,
+                                icons: itemVar.icons,
+                                buttons: itemVar.buttons,
+                                visible: visible
+                            });
+
+                            variationsArr.push(model);
+                        }
+                    });
+
+                    if (variationsArr.length > 0 && !item.isUICustomizer) {
+                        var name = item.name;
+                        if (typeof item.nameLocale == 'object')
+                            name = item.nameLocale[lang] || item.nameLocale['en'] || name || '';
+
+                        arr.push(new Common.Models.Plugin({
+                            name : name,
+                            guid: item.guid,
+                            baseUrl : item.baseUrl,
+                            variations: variationsArr,
+                            currentVariation: 0,
+                            visible: pluginVisible,
+                            groupName: (item.group) ? item.group.name : '',
+                            groupRank: (item.group) ? item.group.rank : 0
+                        }));
+                    }
+                });
+
+                if ( uiCustomize!==false )  // from ui customizer in editor config or desktop event
+                    me.configPlugins.UIplugins = arrUI;
+
+                if ( !uiCustomize && pluginStore)
+                {
+                    arr = pluginStore.models.concat(arr);
+                    arr.sort(function(a, b){
+                        var rank_a = a.get('groupRank'),
+                            rank_b = b.get('groupRank');
+                        if (rank_a < rank_b)
+                            return (rank_a==0) ? 1 : -1;
+                        if (rank_a > rank_b)
+                            return (rank_b==0) ? -1 : 1;
+                        return 0;
+                    });
+                    pluginStore.reset(arr);
+                    this.appOptions.canPlugins = !pluginStore.isEmpty();
+                }
+            }
+            else if (!uiCustomize){
+                this.appOptions.canPlugins = false;
+            }
+
+            if (!uiCustomize)
+                this.getApplication().getController('LeftMenu').enablePlugins();
+
+            if (this.appOptions.canPlugins) {
+                this.refreshPluginsList();
+                this.runAutoStartPlugins();
+            }
+        },
+
+        getPlugins: function(pluginsData, fetchFunction) {
+            if (!pluginsData || pluginsData.length<1)
+                return Promise.resolve([]);
+
+            fetchFunction = fetchFunction || function (url) {
+                    return fetch(url)
+                        .then(function(response) {
+                            if ( response.ok ) return response.json();
+                            else return Promise.reject(url);
+                        }).then(function(json) {
+                            json.baseUrl = url.substring(0, url.lastIndexOf("config.json"));
+                            return json;
+                        });
+                };
+
+            var loaded = [];
+            return pluginsData.map(fetchFunction).reduce(function (previousPromise, currentPromise) {
+                return previousPromise
+                    .then(function()
+                    {
+                        return currentPromise;
+                    })
+                    .then(function(item)
+                    {
+                        loaded.push(item);
+                        return Promise.resolve(item);
+                    })
+                    .catch(function(item)
+                    {
+                        return Promise.resolve(item);
+                    });
+
+            }, Promise.resolve())
+                .then(function ()
+                {
+                    return Promise.resolve(loaded);
+                });
+        },
+
+        mergePlugins: function() {
+            if (this.serverPlugins.plugins !== undefined && this.configPlugins.plugins !== undefined) { // undefined - plugins are loading
+                var autostart = [],
+                    arr = [],
+                    plugins = this.configPlugins,
+                    warn = false;
+                if (plugins.plugins && plugins.plugins.length>0) {
+                    arr = plugins.plugins;
+                    var val = plugins.config.autostart || plugins.config.autoStartGuid;
+                    if (typeof (val) == 'string')
+                        val = [val];
+                    warn = !!plugins.config.autoStartGuid;
+                    autostart = val || [];
+                }
+                plugins = this.serverPlugins;
+                if (plugins.plugins && plugins.plugins.length>0) {
+                    arr = arr.concat(plugins.plugins);
+                    var val = plugins.config.autostart || plugins.config.autoStartGuid;
+                    if (typeof (val) == 'string')
+                        val = [val];
+                    (warn || plugins.config.autoStartGuid) && console.warn("Obsolete: The autoStartGuid parameter is deprecated. Please check the documentation for new plugin connection configuration.");
+                    autostart = autostart.concat(val || []);
+                }
+                this.autostart = autostart;
+                this.parsePlugins(arr, false);
+            }
+        },
+
+        getAppCustomPlugins: function (plugins) {
+            var me = this,
+                funcComplete = function() {me.customPluginsComplete = true;};
+            if ( plugins.config ) {
+                this.getPlugins(plugins.config.UIpluginsData)
+                    .then(function(loaded)
+                    {
+                        me.parsePlugins(loaded, true);
+                        me.getPlugins(plugins.UIplugins, function(item) {
+                            return fetch(item.url)
+                                .then(function(response) {
+                                    if ( response.ok ) return response.text();
+                                    else return Promise.reject();
+                                })
+                                .then(function(text) {
+                                    item.code = text;
+                                    return text;
+                                });
+                        }).then(funcComplete, funcComplete);
+                    }, funcComplete);
+            } else
+                funcComplete();
+        }
     }, Common.Controllers.Plugins || {}));
 });

apps/common/main/lib/controller/ReviewChanges.js

@@ -545,7 +545,7 @@ define([
 
             Common.localStorage.setItem(this.view.appPrefix + "settings-spellcheck", state ? 1 : 0);
             this.api.asc_setSpellCheck(state);
-            Common.Utils.InternalSettings.set("de-settings-spellcheck", state);
+            Common.Utils.InternalSettings.set(this.view.appPrefix + "settings-spellcheck", state);
         },
 
         onReviewViewClick: function(menu, item, e) {
@@ -670,13 +670,13 @@ define([
                     }
                 });
             } else if (config.canViewReview) {
-                config.canViewReview = me.api.asc_HaveRevisionsChanges(true); // check revisions from all users
+                config.canViewReview = (config.isEdit || me.api.asc_HaveRevisionsChanges(true)); // check revisions from all users
                 if (config.canViewReview) {
                     var val = Common.localStorage.getItem(me.view.appPrefix + "review-mode");
                     if (val===null)
                         val = me.appConfig.customization && /^(original|final|markup)$/i.test(me.appConfig.customization.reviewDisplay) ? me.appConfig.customization.reviewDisplay.toLocaleLowerCase() : 'original';
-                    me.turnDisplayMode(config.isRestrictedEdit ? 'markup' : val); // load display mode only in viewer
+                    me.turnDisplayMode((config.isEdit || config.isRestrictedEdit) ? 'markup' : val); // load display mode only in viewer
-                    me.view.turnDisplayMode(config.isRestrictedEdit ? 'markup' : val);
+                    me.view.turnDisplayMode((config.isEdit || config.isRestrictedEdit) ? 'markup' : val);
                 }
             }
 

apps/common/main/lib/extend/Bootstrap.js

@@ -41,8 +41,8 @@
 function onDropDownKeyDown(e) {
     var $this       = $(this),
         $parent     = $this.parent(),
-        beforeEvent = jQuery.Event('keydown.before.bs.dropdown'),
+        beforeEvent = jQuery.Event('keydown.before.bs.dropdown', {keyCode: e.keyCode}),
-        afterEvent  = jQuery.Event('keydown.after.bs.dropdown');
+        afterEvent  = jQuery.Event('keydown.after.bs.dropdown', {keyCode: e.keyCode});
 
     $parent.trigger(beforeEvent);
 
@@ -111,17 +111,9 @@ function patchDropDownKeyDown(e) {
                  var mnu = $('> [role=menu]', li),
                     $subitems = mnu.find('> li:not(.divider):not(.disabled):visible > a'),
                     $dataviews = mnu.find('> li:not(.divider):not(.disabled):visible .dataview'),
-                    focusIdx = 0;
+                    $internal_menu = mnu.find('> li:not(.divider):not(.disabled):visible ul.internal-menu');
-                 if (mnu.find('> .menu-scroll').length>0) {
+                if ($subitems.length>0 && $dataviews.length<1 && $internal_menu.length<1)
-                    var offset = mnu.scrollTop();
+                    ($subitems.index($subitems.filter(':focus'))<0) && $subitems.eq(0).focus();
-                    for (var i=0; i<$subitems.length; i++) {
-                        if ($subitems[i].offsetTop > offset) {
-                            focusIdx = i; break;
-                        }
-                    }
-                }
-                if ($subitems.length>0 && $dataviews.length<1)
-                    $subitems.eq(focusIdx).focus();
             }, 250);
         }
     } else if (e.keyCode == 37) {     // left

apps/common/main/lib/model/Comment.js

@@ -53,6 +53,7 @@ define([
     Common.Models.Comment = Backbone.Model.extend({
         defaults: {
             uid                 : 0,                        //  asc
+            guid                : '',
             userid              : 0,
             username            : 'Guest',
             usercolor           : null,

apps/common/main/lib/template/CommentsPopover.template

@@ -10,7 +10,7 @@
         <div oo_editor_input="true" tabindex="-1" class="user-message user-select"><%=scope.pickLink(comment)%></div>
     <% } else { %>
         <div class="inner-edit-ct">
-            <textarea class="msg-reply user-select" maxlength="maxCommLength" spellcheck="false"><%=comment%></textarea>
+            <textarea class="msg-reply user-select" maxlength="maxCommLength" spellcheck="false" <% if (!!dummy) { %> placeholder="textMention"<% } %>><%=comment%></textarea>
             <% if (hideAddReply) { %>
                 <button class="btn normal dlg-btn primary btn-inner-edit" id="id-comments-change-popover">textAdd</button>
             <% } else { %>

apps/common/main/lib/util/LanguageInfo.js

@@ -446,10 +446,12 @@ Common.util.LanguageInfo = new(function() {
         },
 
         getLocalLanguageCode: function(name) {
+            if (name) {
                 for (var code in localLanguageName) {
                     if (localLanguageName[code][0].toLowerCase()===name.toLowerCase())
                         return code;
                 }
+            }
             return null;
         },
 

apps/common/main/lib/util/utils.js

@@ -90,6 +90,7 @@ Common.Utils = _.extend(new(function() {
         hostnameRe = /^(((https?)|(ftps?)):\/\/)?([\-\wа-яё]*:?[\-\wа-яё]*@)?(([\-\wа-яё]+\.)+[\wа-яё\-]{2,}(:\d+)?(\/[%\-\wа-яё]*(\.[\wа-яё]{2,})?(([\wа-яё\-\.\?\\\/+@&#;:`'~=%!,\(\)]*)(\.[\wа-яё]{2,})?)*)*\/?)/i,
         localRe = /^(((https?)|(ftps?)):\/\/)([\-\wа-яё]*:?[\-\wа-яё]*@)?(([\-\wа-яё]+)(:\d+)?(\/[%\-\wа-яё]*(\.[\wа-яё]{2,})?(([\wа-яё\-\.\?\\\/+@&#;:`'~=%!,\(\)]*)(\.[\wа-яё]{2,})?)*)*\/?)/i,
         emailStrongRe = /(mailto:)?([a-z0-9'\._-]+@[a-z0-9\.-]+\.[a-z0-9]{2,4})([a-яё0-9\._%+-=\?:&]*)/ig,
+        emailAddStrongRe = /(mailto:|\s[@]|\s[+])?([a-z0-9'\._-]+@[a-z0-9\.-]+\.[a-z0-9]{2,4})([a-яё0-9\._%+-=\?:&]*)/ig,
         ipStrongRe = /(((https?)|(ftps?)):\/\/([\-\wа-яё]*:?[\-\wа-яё]*@)?)(((1[0-9]{2}|2[0-4][0-9]|25[0-5]|[1-9][0-9]|[0-9])\.){3}(1[0-9]{2}|2[0-4][0-9]|25[0-5]|[1-9][0-9]|[0-9]))(:\d+)?(\/[%\-\wа-яё]*(\.[\wа-яё]{2,})?(([\wа-яё\-\.\?\\\/+@&#;:`~=%!,\(\)]*)(\.[\wа-яё]{2,})?)*)*\/?/ig,
         hostnameStrongRe = /((((https?)|(ftps?)):\/\/([\-\wа-яё]*:?[\-\wа-яё]*@)?)|(([\-\wа-яё]*:?[\-\wа-яё]*@)?www\.))((([\-\wа-яё]+\.)+[\wа-яё\-]{2,}|([\-\wа-яё]+))(:\d+)?(\/[%\-\wа-яё]*(\.[\wа-яё]{2,})?(([\wа-яё\-\.\?\\\/+@&#;:`~=%!,\(\)]*)(\.[\wа-яё]{2,})?)*)*\/?)/ig,
         documentSettingsType = {
@@ -207,6 +208,7 @@ Common.Utils = _.extend(new(function() {
         hostnameRe: hostnameRe,
         localRe: localRe,
         emailStrongRe: emailStrongRe,
+        emailAddStrongRe: emailAddStrongRe,
         ipStrongRe: ipStrongRe,
         hostnameStrongRe: hostnameStrongRe,
         documentSettingsType: documentSettingsType,
@@ -542,6 +544,8 @@ Common.Utils.String = new (function() {
     return {
         format: function(format) {
             var args = _.toArray(arguments).slice(1);
+            if (args.length && typeof args[0] == 'object')
+                args = args[0];
             return format.replace(/\{(\d+)\}/g, function(s, i) {
                 return args[i];
             });
@@ -684,16 +688,7 @@ Common.Utils.applyCustomizationPlugins = function(plugins) {
 Common.Utils.fillUserInfo = function(info, lang, defname) {
     var _user = info || {};
     !_user.id && (_user.id = ('uid-' + Date.now()));
-    if (_.isEmpty(_user.name)) {
+    _user.fullname = _.isEmpty(_user.name) ? defname : _user.name;
-        _.isEmpty(_user.firstname) && _.isEmpty(_user.lastname) && (_user.firstname = defname);
-        if (_.isEmpty(_user.firstname))
-            _user.fullname = _user.lastname;
-        else if (_.isEmpty(_user.lastname))
-            _user.fullname = _user.firstname;
-        else
-            _user.fullname = /^ru/.test(lang) ? _user.lastname + ' ' + _user.firstname :  _user.firstname + ' ' + _user.lastname;
-    } else
-        _user.fullname = _user.name;
     return _user;
 };
 
@@ -734,21 +729,18 @@ Common.Utils.getConfigJson = function (url) {
     return null;
 };
 
-Common.Utils.getConfigJson = function (url) {
+Common.Utils.loadConfig = function(url, callback) {
-    if ( url ) {
+    "use strict";
-        try {
-            var xhrObj = Common.Utils.createXhr();
-            if ( xhrObj ) {
-                xhrObj.open('GET', url, false);
-                xhrObj.send('');
 
-                return JSON.parse(xhrObj.responseText);
+    fetch(url)
-            }
+        .then(function(response){
-        } catch (e) {}
+            if ( response.ok )
-    }
+                return response.json();
-
+            else return 'error';
-    return null;
+        }).then(function(json){
-}
+            callback(json);
+        });
+};
 
 Common.Utils.asyncCall = function (callback, scope, args) {
     (new Promise(function (resolve, reject) {
@@ -784,6 +776,76 @@ Common.Utils.InternalSettings = new(function() {
     }
 });
 
+Common.Utils.lockControls = function(causes, lock, opts, defControls) {
+    !opts && (opts = {});
+
+    var controls = opts.array || defControls;
+    opts.merge && (controls = _.union(defControls,controls));
+
+    function doLock(cmp, cause) {
+        if ( cmp && _.contains(cmp.options.lock, cause) ) {
+            var index = cmp.keepState.indexOf(cause);
+            if (lock) {
+                if (index < 0) {
+                    cmp.keepState.push(cause);
+                }
+            } else {
+                if (!(index < 0)) {
+                    cmp.keepState.splice(index, 1);
+                }
+            }
+        }
+    }
+
+    _.each(controls, function(item) {
+        if (item && _.isFunction(item.setDisabled)) {
+            !item.keepState && (item.keepState = []);
+            if (opts.clear && opts.clear.length > 0 && item.keepState.length > 0) {
+                item.keepState = _.difference(item.keepState, opts.clear);
+            }
+
+            _.isArray(causes) ? _.each(causes, function(c) {doLock(item, c)}) : doLock(item, causes);
+
+            if (!(item.keepState.length > 0)) {
+                item.isDisabled() && item.setDisabled(false);
+            } else {
+                !item.isDisabled() && item.setDisabled(true);
+            }
+        }
+    });
+};
+
+Common.Utils.injectButtons = function($slots, id, iconCls, caption, lock, split, menu, toggle) {
+    var btnsArr = createButtonSet();
+    btnsArr.setDisabled(true);
+    id = id || ("id-toolbar-" + iconCls);
+    $slots.each(function(index, el) {
+        var _cls = 'btn-toolbar';
+        /x-huge/.test(el.className) && (_cls += ' x-huge icon-top');
+
+        var button = new Common.UI.Button({
+            id: id + index,
+            cls: _cls,
+            iconCls: iconCls,
+            caption: caption,
+            split: split || false,
+            menu: menu || false,
+            enableToggle: toggle || false,
+            lock: lock,
+            disabled: true
+        }).render( $slots.eq(index) );
+
+        btnsArr.add(button);
+    });
+    return btnsArr;
+};
+
+Common.Utils.injectComponent = function ($slot, cmp) {
+    if (cmp && $slot.length) {
+        cmp.rendered ? $slot.append(cmp.$el) : cmp.render($slot);
+    }
+};
+
 Common.Utils.InternalSettings.set('toolbar-height-tabs', 32);
 Common.Utils.InternalSettings.set('toolbar-height-tabs-top-title', 28);
 Common.Utils.InternalSettings.set('toolbar-height-controls', 67);

apps/common/main/lib/view/Comments.js

@@ -700,6 +700,24 @@ define([
             return str_res;
         },
 
+        pickEMail: function (commentId, message) {
+            var arr = Common.Utils.String.htmlEncode(message).match(/\B[@+][A-Z0-9._%+-]+@[A-Z0-9._]+\.[A-Z]+\b/gi);
+            arr = _.map(arr, function(str){
+                return str.slice(1, str.length);
+            });
+            (arr.length>0) && Common.Gateway.requestSendNotify({
+                emails: arr,
+                actionId: commentId, // comment id
+                actionLink: {
+                    action: {
+                        type: "comment",
+                        data: commentId
+                    }
+                },
+                message: message //comment text
+            });
+        },
+
         textComments            : 'Comments',
         textAnonym              : 'Guest',
         textAddCommentToDoc     : 'Add Comment to Document',

apps/common/main/lib/view/LanguageDialog.js

@@ -85,7 +85,7 @@ define([
         this.cmbLanguage = new Common.UI.ComboBox({
             el: $window.find('#id-document-language'),
             cls: 'input-group-nr',
-            menuStyle: 'min-width: 318px; max-height: 300px;',
+            menuStyle: 'min-width: 318px; max-height: 285px;',
             editable: false,
             template: _.template([
                 '<span class="input-group combobox <%= cls %> combo-langs" id="<%= id %>" style="<%= style %>">',
@@ -104,7 +104,8 @@ define([
                     '</ul>',
                 '</span>'
             ].join('')),
-            data: this.options.languages
+            data: this.options.languages,
+            search: true
         });
 
         if (this.cmbLanguage.scroller) this.cmbLanguage.scroller.update({alwaysVisibleY: true});
@@ -130,8 +131,8 @@ define([
     },
 
     onLangSelect: function(cmb, rec, e) {
-        cmb.$el.find('.input-icon').toggleClass('spellcheck-lang', rec.spellcheck);
+        cmb.$el.find('.input-icon').toggleClass('spellcheck-lang', rec && rec.spellcheck);
-        cmb._input.css('padding-left', rec.spellcheck ? 25 : 3);
+        cmb._input.css('padding-left', rec && rec.spellcheck ? 25 : 3);
     },
 
     onPrimary: function() {

apps/common/main/lib/view/OpenDialog.js

@@ -339,14 +339,14 @@ define([
 
             switch (this.type) {
                 case Common.Utils.importTextType.CSV:
-                    this.api.asc_decodeBuffer(this.preview, new Asc.asc_CCSVAdvancedOptions(encoding, delimiter, delimiterChar), _.bind(this.previewCallback, this));
+                    this.api.asc_decodeBuffer(this.preview, new Asc.asc_CTextOptions(encoding, delimiter, delimiterChar), _.bind(this.previewCallback, this));
                     break;
                 case Common.Utils.importTextType.TXT:
-                    this.api.asc_decodeBuffer(this.preview, new Asc.asc_CTXTAdvancedOptions(encoding), _.bind(this.previewCallback, this));
+                    this.api.asc_decodeBuffer(this.preview, new Asc.asc_CTextOptions(encoding), _.bind(this.previewCallback, this));
                     break;
                 case Common.Utils.importTextType.Paste:
                 case Common.Utils.importTextType.Columns:
-                    this.api.asc_TextImport(new Asc.asc_CCSVAdvancedOptions(encoding, delimiter, delimiterChar), _.bind(this.previewCallback, this), this.type == Common.Utils.importTextType.Paste);
+                    this.api.asc_TextImport(new Asc.asc_CTextOptions(encoding, delimiter, delimiterChar), _.bind(this.previewCallback, this), this.type == Common.Utils.importTextType.Paste);
                     break;
             }
         },
@@ -426,6 +426,7 @@ define([
 
         onCmbDelimiterSelect: function(combo, record){
             this.inputDelimiter.setVisible(record.value == -1);
+            (record.value == -1) && this.inputDelimiter.cmpEl.find('input').focus();
             if (this.preview)
                 this.updatePreview();
         },

apps/common/main/lib/view/ReviewPopover.js

@@ -100,14 +100,23 @@ define([
 
             this.commentsStore = options.commentsStore;
             this.reviewStore = options.reviewStore;
+            this.canRequestUsers = options.canRequestUsers;
+            this.canRequestSendNotify = options.canRequestSendNotify;
+            this.externalUsers = [];
             this._state = {commentsVisible: false, reviewVisible: false};
 
             _options.tpl = _.template(this.template)(_options);
 
-            this.arrow = {margin: 20, width: 12, height: 34};
+            this.arrow = {margin: 20, width: 10, height: 30};
             this.sdkBounds = {width: 0, height: 0, padding: 10, paddingTop: 20};
 
             Common.UI.Window.prototype.initialize.call(this, _options);
+
+            if (this.canRequestUsers) {
+                Common.Gateway.on('setusers', _.bind(this.setUsers, this));
+                Common.NotificationCenter.on('mentions:clearusers',   _.bind(this.clearUsers, this));
+            }
+
             return this;
         },
         render: function (comments, review) {
@@ -234,7 +243,8 @@ define([
                                 textEdit: me.textEdit,
                                 textReply: me.textReply,
                                 textClose: me.textClose,
-                                maxCommLength: Asc.c_oAscMaxCellOrCommentLength
+                                maxCommLength: Asc.c_oAscMaxCellOrCommentLength,
+                                textMention: me.canRequestSendNotify ? me.textMention : ''
                             })
                         )
                     });
@@ -457,6 +467,25 @@ define([
                             }
                         }
                     });
+
+                    this.emailMenu = new Common.UI.Menu({
+                        maxHeight: 190,
+                        cyclic: false,
+                        items: []
+                    }).on('render:after', function(mnu) {
+                        this.scroller = new Common.UI.Scroller({
+                            el: $(this.el).find('.dropdown-menu '),
+                            useKeyboard: this.enableKeyEvents && !this.handleSelect,
+                            minScrollbarLength  : 40,
+                            alwaysVisibleY: true
+                        });
+                    }).on('show:after', function () {
+                        this.scroller.update({alwaysVisibleY: true});
+                        me.$window.css({zIndex: '1001'});
+                    }).on('hide:after', function () {
+                        me.$window.css({zIndex: '990'});
+                    });
+
                     me.on({
                         'show': function () {
                             me.commentsView.autoHeightTextBox();
@@ -753,6 +782,10 @@ define([
                         topPos = Math.min(sdkBoundsTop + sdkBoundsHeight - outerHeight, this.arrowPosY + sdkBoundsTop - this.arrow.height);
                         topPos = Math.max(topPos, sdkBoundsTopPos);
 
+                        if (parseInt(arrowView.css('top')) + this.arrow.height > outerHeight) {
+                            arrowView.css({top: (outerHeight-this.arrow.height) + 'px'});
+                        }
+
                         this.$window.css('top', topPos + 'px');
                     }
                 }
@@ -821,7 +854,7 @@ define([
                                 commentsView.css({height: sdkBoundsHeight - sdkPanelHeight - 3 + 'px'});
 
                                 // arrowPosY = Math.max(this.arrow.margin, this.arrowPosY - sdkPanelHeight - this.arrow.width);
-                                arrowPosY = Math.min(arrowPosY, sdkBoundsHeight - (sdkPanelHeight + this.arrow.margin + this.arrow.width));
+                                arrowPosY = Math.min(arrowPosY, sdkBoundsHeight - (sdkPanelHeight + this.arrow.margin + this.arrow.height));
 
                                 arrowView.css({top: arrowPosY + 'px'});
                                 this.scroller.scrollTop(scrollPos);
@@ -838,8 +871,8 @@ define([
                                     }
                                 }
 
-                                arrowPosY = Math.max(this.arrow.margin, this.arrowPosY - (sdkBoundsHeight - outerHeight) - this.arrow.width);
+                                arrowPosY = Math.max(this.arrow.margin, this.arrowPosY - (sdkBoundsHeight - outerHeight) - this.arrow.height);
-                                arrowPosY = Math.min(arrowPosY, outerHeight - this.arrow.margin - this.arrow.width);
+                                arrowPosY = Math.min(arrowPosY, outerHeight - this.arrow.margin - this.arrow.height);
 
                                 arrowView.css({top: arrowPosY + 'px'});
                             }
@@ -918,6 +951,47 @@ define([
 
                 me.e = event;
             });
+
+            if (this.canRequestUsers) {
+                textBox && textBox.keydown(function (event) {
+                    if ( event.keyCode == Common.UI.Keys.SPACE ||
+                        event.keyCode == Common.UI.Keys.HOME || event.keyCode == Common.UI.Keys.END || event.keyCode == Common.UI.Keys.RIGHT ||
+                        event.keyCode == Common.UI.Keys.LEFT || event.keyCode == Common.UI.Keys.UP) {
+                        // hide email menu
+                        me.onEmailListMenu();
+                    } else if (event.keyCode == Common.UI.Keys.DOWN) {
+                        if (me.emailMenu && me.emailMenu.rendered && me.emailMenu.isVisible())
+                            _.delay(function() {
+                                var selected = me.emailMenu.cmpEl.find('li:not(.divider):first');
+                                selected = selected.find('a');
+                                selected.focus();
+                            }, 10);
+                    }
+                    me.e = event;
+                });
+                textBox && textBox.on('input', function (event) {
+                    var $this = $(this),
+                        start = this.selectionStart,
+                        val = $this.val().replace(/[\n]$/, ""),
+                        left = 0, right = val.length-1;
+                    for (var i=start-1; i>=0; i--) {
+                        if (val.charCodeAt(i) == 32 /*space*/ || val.charCodeAt(i) == 13 || val.charCodeAt(i) == 10 || val.charCodeAt(i) == 9) {
+                            left = i+1; break;
+                        }
+                    }
+                    for (var i=start; i<=right; i++) {
+                        if (val.charCodeAt(i) == 32 || val.charCodeAt(i) == 13 || val.charCodeAt(i) == 10 || val.charCodeAt(i) == 9) {
+                            right = i-1; break;
+                        }
+                    }
+                    var str = val.substring(left, right+1),
+                        res = str.match(/^(?:[@]|[+](?!1))(\S*)/);
+                    if (res && res.length>1) {
+                        str = res[1]; // send to show email menu
+                        me.onEmailListMenu(str, left, right);
+                    }
+                });
+            }
         },
 
         hideTips: function () {
@@ -955,6 +1029,17 @@ define([
                 this.commentsView.setStore(this.commentsStore);
         },
 
+        setUsers: function(data) {
+            this.externalUsers = data.users || [];
+            this.isUsersLoading = false;
+            this._state.emailSearch && this.onEmailListMenu(this._state.emailSearch.str, this._state.emailSearch.left, this._state.emailSearch.right);
+            this._state.emailSearch = null;
+        },
+
+        clearUsers: function() {
+            this.externalUsers = [];
+        },
+
         getPopover: function(options) {
             if (!this.popover)
                 this.popover = new Common.Views.ReviewPopover(options);
@@ -979,6 +1064,107 @@ define([
             }
         },
 
+        onEmailListMenu: function(str, left, right, show) {
+            var me   = this,
+                users = me.externalUsers,
+                menu = me.emailMenu;
+
+            if (users.length<1) {
+                this._state.emailSearch = {
+                    str: str,
+                    left: left,
+                    right: right
+                };
+
+                if (this.isUsersLoading) return;
+
+                this.isUsersLoading = true;
+                Common.Gateway.requestUsers();
+                return;
+            }
+            if (typeof str == 'string') {
+                var menuContainer = me.$window.find(Common.Utils.String.format('#menu-container-{0}', menu.id)),
+                    textbox = this.commentsView.getTextBox(),
+                    textboxDom = textbox ? textbox[0] : null,
+                    showPoint = textboxDom ? [textboxDom.offsetLeft, textboxDom.offsetTop + textboxDom.clientHeight + 3] : [0, 0];
+
+                if (!menu.rendered) {
+                    // Prepare menu container
+                    if (menuContainer.length < 1) {
+                        menuContainer = $(Common.Utils.String.format('<div id="menu-container-{0}" style="position: absolute; z-index: 10000;"><div class="dropdown-toggle" data-toggle="dropdown"></div></div>', menu.id));
+                        me.$window.append(menuContainer);
+                    }
+
+                    menu.render(menuContainer);
+                    menu.cmpEl.css('min-width', textboxDom ? textboxDom.clientWidth : 220);
+                    menu.cmpEl.attr({tabindex: "-1"});
+                    menu.on('hide:after', function(){
+                        setTimeout(function(){
+                            var tb = me.commentsView.getTextBox();
+                            tb && tb.focus();
+                        }, 10);
+                    });
+                }
+
+                for (var i = 0; i < menu.items.length; i++) {
+                    menu.removeItem(menu.items[i]);
+                    i--;
+                }
+
+                if (users.length>0) {
+                    str = str.toLowerCase();
+                    if (str.length>0) {
+                        users = _.filter(users, function(item) {
+                            return (item.email && 0 === item.email.toLowerCase().indexOf(str) || item.name && 0 === item.name.toLowerCase().indexOf(str))
+                        });
+                    }
+                    var tpl = _.template('<a id="<%= id %>" tabindex="-1" type="menuitem" style="font-size: 12px;"><div><%= Common.Utils.String.htmlEncode(caption) %></div><div style="color: #909090;"><%= Common.Utils.String.htmlEncode(options.value) %></div></a>'),
+                        divider = false;
+                    _.each(users, function(menuItem, index) {
+                        if (divider && !menuItem.hasAccess) {
+                            divider = false;
+                            menu.addItem(new Common.UI.MenuItem({caption: '--'}));
+                        }
+
+                        if (menuItem.email && menuItem.name) {
+                            var mnu = new Common.UI.MenuItem({
+                                caption     : menuItem.name,
+                                value       : menuItem.email,
+                                template    : tpl
+                            }).on('click', function(item, e) {
+                                me.insertEmailToTextbox(item.options.value, left, right);
+                            });
+                            menu.addItem(mnu);
+                            if (menuItem.hasAccess)
+                                divider = true;
+                        }
+                    });
+                }
+
+                if (menu.items.length>0) {
+                    menuContainer.css({left: showPoint[0], top : showPoint[1]});
+                    menu.menuAlignEl = textbox;
+                    menu.show();
+                    menu.cmpEl.css('display', '');
+                    menu.alignPosition('bl-tl', -5);
+                    menu.scroller.update({alwaysVisibleY: true});
+                } else {
+                    menu.rendered && menu.cmpEl.css('display', 'none');
+                }
+            } else {
+                menu.rendered && menu.cmpEl.css('display', 'none');
+            }
+        },
+
+        insertEmailToTextbox: function(str, left, right) {
+            var textBox = this.commentsView.getTextBox(),
+                val = textBox.val();
+            textBox.val(val.substring(0, left) + '+' + str + val.substring(right+1, val.length));
+            setTimeout(function(){
+                textBox[0].selectionStart = textBox[0].selectionEnd = left + str.length + 1;
+            }, 10);
+        },
+
         textAddReply            : 'Add Reply',
         textAdd                 : "Add",
         textCancel              : 'Cancel',
@@ -987,6 +1173,7 @@ define([
         textClose               : 'Close',
         textResolve             : 'Resolve',
         textOpenAgain           : "Open Again",
-        textFollowMove          : 'Follow Move'
+        textFollowMove          : 'Follow Move',
+        textMention             : '+mention will provide access to the document and send an email'
     }, Common.Views.ReviewPopover || {}))
 });

apps/common/main/lib/view/SearchDialog.js

@@ -249,6 +249,7 @@
                     this.txtSearch.addClass('clear');
                     this.btnOptions.hide();
                 }
+                this.menuLookin && this.menuLookin.menu.items[1].setDisabled(false);
 
                 this.setHeight(170);
             } else {
@@ -261,6 +262,7 @@
                     $inputs.eq(1).hide();
                     this.$window.find('.btn[result=replace]').hide();
                     this.$window.find('.btn[result=replaceall]').hide();
+                    this.menuLookin && this.menuLookin.menu.items[1].setDisabled(false);
                     this.setHeight(200);
                 } else {
                     $inputs.eq(2).show();
@@ -268,6 +270,10 @@
                     $inputs.eq(1).show();
                     this.$window.find('.btn[result=replace]').show();
                     this.$window.find('.btn[result=replaceall]').show();
+                    if (this.menuLookin) {
+                        this.menuLookin.menu.items[0].setChecked(true);
+                        this.menuLookin.menu.items[1].setDisabled(true);
+                    }
                     this.setHeight(230);
                 }
             }
@@ -293,8 +299,8 @@
         getSettings: function() {
             return {
                 textsearch: this.txtSearch.val(),
-                casesensitive: this.miMatchCase.checked,
+                matchcase: this.miMatchCase.checked,
-                wholewords: this.miMatchWord.checked };
+                matchword: this.miMatchWord.checked };
         },
 
         textTitle           : 'Search & Replace',

apps/common/main/resources/img/toolbar/shapetypes.svg

@@ -0,0 +1,605 @@
+<svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+        <symbol id="svg-icon-accentBorderCallout1" viewBox="0 0 20 20">
+            <path d="M17 6h-6v7h6v-7zM18 5v9h-8v-9h8z"></path>
+            <path d="M8 5h1v9h-1v-3.715l-4.631 5.052-0.737-0.676 5.369-5.857v-3.805z"></path>
+        </symbol>
+        <symbol id="svg-icon-accentBorderCallout2" viewBox="0 0 20 20">
+            <path d="M18 6h-6v7h6v-7zM19 5v9h-8v-9h8z"></path>
+            <path d="M9 5h1v9h-1v-4h-3.703l-2.858 5.239-0.878-0.479 3.142-5.761h4.297v-4z"></path>
+        </symbol>
+        <symbol id="svg-icon-accentBorderCallout3" viewBox="0 0 20 20">
+            <path d="M17 6h-6v7h6v-7zM18 5v9h-8v-9h8z"></path>
+            <path d="M8 5h1v9h-1v-4h-4v3.27l3.325 2.85-0.651 0.759-3.675-3.15v-4.73h5v-4z"></path>
+        </symbol>
+        <symbol id="svg-icon-accentCallout1" viewBox="0 0 20 20">
+            <path d="M12 5h-2v1h2v-1zM11 7h-1v2h1v-2zM17 7h1v2h-1v-2zM11 10h-1v2h1v-2zM17 10h1v2h-1v-2zM12 14v-1h-2v1h2zM13 13h2v1h-2v-1zM18 14v-1h-2v1h2zM13 5h2v1h-2v-1zM18 5h-2v1h2v-1z"></path>
+            <path d="M8 5h1v9h-1v-3.715l-4.631 5.052-0.737-0.676 5.369-5.857v-3.805z"></path>
+        </symbol>
+        <symbol id="svg-icon-accentCallout2" viewBox="0 0 20 20">
+            <path d="M9 5h1v9h-1v-4h-3.703l-2.858 5.239-0.878-0.479 3.142-5.761h4.297v-4z"></path>
+            <path d="M13 5h-2v1h2v-1zM12 7h-1v2h1v-2zM18 7h1v2h-1v-2zM12 10h-1v2h1v-2zM18 10h1v2h-1v-2zM13 14v-1h-2v1h2zM14 13h2v1h-2v-1zM19 14v-1h-2v1h2zM14 5h2v1h-2v-1zM19 5h-2v1h2v-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-accentCallout3" viewBox="0 0 20 20">
+            <path d="M8 4h1v9h-1v-4h-4v3.293l3.354 3.353-0.707 0.707-3.646-3.646v-4.707h5v-4z"></path>
+            <path d="M12 4h-2v1h2v-1zM11 6h-1v2h1v-2zM17 6h1v2h-1v-2zM11 9h-1v2h1v-2zM17 9h1v2h-1v-2zM12 13v-1h-2v1h2zM13 12h2v1h-2v-1zM18 13v-1h-2v1h2zM13 4h2v1h-2v-1zM18 4h-2v1h2v-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonBackPrevious" viewBox="0 0 20 20">
+            <path d="M17 17h-14v-14h14v14zM18 18v-16h-16v16h16z"></path>
+            <path d="M14 15v-10l-9 5 9 5zM13 13.301l-5.941-3.301 5.941-3.3v6.601z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonBeginning" viewBox="0 0 20 20">
+            <path d="M17 3h-14v14h14v-14zM18 2v16h-16v-16h16z"></path>
+            <path d="M15 5v10l-8-5 8-5zM14 6.804l-5.113 3.196 5.113 3.196v-6.392z"></path>
+            <path d="M5 5h1v10h-1v-10z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonBlank" viewBox="0 0 20 20">
+            <path d="M17 3h-14v14h14v-14zM18 2v16h-16v-16h16z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonDocument" viewBox="0 0 20 20">
+            <path d="M17 3h-14v14h14v-14zM18 2v16h-16v-16h16z"></path>
+            <path d="M11 5h-5v10h8v-7l-3-3zM11 6.5l1.5 1.5h-1.5v-1.5zM13 14h-6v-8h3v3h3v5z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonEnd" viewBox="0 0 20 20">
+            <path d="M3 17h14v-14h-14v14zM2 18v-16h16v16h-16z"></path>
+            <path d="M5 15v-10l8 5-8 5zM6 13.196l5.113-3.196-5.113-3.196v6.392z"></path>
+            <path d="M15 15h-1v-10h1v10z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonForwardNext" viewBox="0 0 20 20">
+            <path fill="none" stroke="#444" style="stroke: var(--color1, #444)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="10" stroke-width="1" d="M17.5 17.5v-15h-15v15h15z"></path>
+            <path fill="none" stroke="#444" style="stroke: var(--color1, #444)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="10" stroke-width="1" d="M13.97 10l-7.47-4.15v8.3l7.47-4.15z"></path>
+            <path d="M3 3h14v14h-14v-14zM2 2v16h16v-16h-16z"></path>
+            <path d="M6 5v10l9-5-9-5zM7 6.7l5.941 3.3-5.941 3.301v-6.601z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonHelp" viewBox="0 0 20 20">
+            <path fill="none" stroke="#444" style="stroke: var(--color1, #444)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="10" stroke-width="1" d="M2.5 17.5v-15h15v15h-15z"></path>
+            <path d="M8.809 11.261v-0.533c-0.006-0.447 0.092-0.889 0.286-1.28 0.095-0.32 0.476-0.64 0.952-1.067 0.346-0.198 0.641-0.492 0.857-0.854 0.172-0.203 0.273-0.468 0.286-0.747 0.013-0.153-0.017-0.307-0.085-0.441s-0.172-0.241-0.296-0.306c-0.116-0.116-0.252-0.204-0.399-0.259s-0.303-0.076-0.458-0.061c-0.768 0.078-1.513 0.332-2.19 0.747l-0.762-1.6c0.956-0.607 2.044-0.902 3.142-0.854 0.742-0.047 1.477 0.178 2.094 0.64 0.251 0.232 0.451 0.526 0.583 0.859s0.193 0.697 0.178 1.061c0.019 0.483-0.080 0.962-0.286 1.387-0.336 0.541-0.755 1.011-1.238 1.387-0.292 0.196-0.549 0.449-0.762 0.747-0.082 0.099-0.142 0.218-0.175 0.348s-0.038 0.267-0.015 0.399v0.427h-1.714zM8.618 13.715c-0.012-0.157 0.008-0.315 0.057-0.463s0.127-0.281 0.228-0.391c0.116-0.116 0.252-0.204 0.399-0.259s0.303-0.076 0.458-0.061c0.14-0.006 0.279 0.019 0.41 0.074s0.251 0.139 0.352 0.246c0.118 0.099 0.214 0.228 0.28 0.376s0.101 0.312 0.101 0.477c-0.010 0.364-0.146 0.708-0.381 0.96-0.102 0.108-0.221 0.191-0.352 0.246s-0.27 0.080-0.41 0.074c-0.155 0.015-0.311-0.006-0.458-0.061s-0.283-0.143-0.399-0.259c-0.103-0.13-0.182-0.282-0.231-0.447s-0.068-0.34-0.055-0.513z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonHome" viewBox="0 0 20 20">
+            <path d="M17 3h-14v14h14v-14zM18 2v16h-16v-16h16z"></path>
+            <path d="M12 14v-3h-4v3h1v-2h2v2h1z"></path>
+            <path d="M5 9v6h10v-10h-2v2l-3-2.5-5 4.5zM14 10v4h-8v-4h8zM13.838 9h-7.343l3.53-3.177 3.813 3.177z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonInformation" viewBox="0 0 20 20">
+            <path d="M17 3v14h-14v-14h14zM2 2v16h16v-16h-16z"></path>
+            <path d="M10 15c2.761 0 5-2.239 5-5s-2.239-5-5-5c-2.761 0-5 2.239-5 5s2.239 5 5 5zM16 10c0 3.314-2.686 6-6 6s-6-2.686-6-6c0-3.314 2.686-6 6-6s6 2.686 6 6z"></path>
+            <path d="M11.007 7.017l-1.999-0.009-0.009 0.995 1.999 0.009 0.009-0.995z"></path>
+            <path d="M8 9h3v2h1v1h-4v-1h1v-1h-1v-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonMovie" viewBox="0 0 20 20">
+            <path d="M17 3h-14v14h14v-14zM18 2v16h-16v-16h16z"></path>
+            <path d="M14 7v1h-1v-1h-8v4h1v-1h1v3h6v-2h1v1h1v-5h-1zM6 9v-1h4v1h-4zM12 12h-4v-2h3v-2h1v4zM14 10h-1v-1h1v1z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonReturn" viewBox="0 0 20 20">
+            <path d="M17 3h-14v14h14v-14zM18 2v16h-16v-16h16z"></path>
+            <path d="M12.5 5l3.5 4h-2v1.5c0 2.485-2.015 4.5-4.5 4.5s-4.5-2.015-4.5-4.5v-1.5h3v1.5c0 0.828 0.672 1.5 1.5 1.5s1.5-0.672 1.5-1.5v-1.5h-2l3.5-4zM13 9v-1h1l-1.5-1.5-1.5 1.5h1v2.5c0 1.381-1.119 2.5-2.5 2.5s-2.5-1.119-2.5-2.5v-0.5h-1v0.5c0 1.933 1.567 3.5 3.5 3.5s3.5-1.567 3.5-3.5v-1.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-actionButtonSound" viewBox="0 0 20 20">
+            <path d="M17 3h-14v14h14v-14zM18 2v16h-16v-16h16z"></path>
+            <path d="M8 8h-3v4h3l3 3v-10l-3 3zM10 12.5l-1.5-1.5h-2.5v-2h2.5l1.5-1.5v5z"></path>
+            <path d="M15 9h-3v1h3v-1z"></path>
+            <path d="M13.556 4l-1.556 1.556 0.707 0.707 1.556-1.556-0.707-0.707z"></path>
+            <path d="M14.263 14.556l-1.556-1.556-0.707 0.707 1.556 1.556 0.707-0.707z"></path>
+        </symbol>
+        <symbol id="svg-icon-arc" viewBox="0 0 20 20">
+            <path d="M3.491 4.163c-0.581-0.068-1.088-0.105-1.491-0.124v-1.040c0.432 0.020 0.98 0.058 1.611 0.132 1.582 0.185 3.701 0.594 5.827 1.491s4.279 2.291 5.9 4.455c1.477 1.972 2.49 4.555 2.662 7.923h-1.035c-0.171-3.152-1.119-5.517-2.453-7.299-1.482-1.979-3.465-3.274-5.474-4.121s-4.026-1.238-5.546-1.417z"></path>
+        </symbol>
+        <symbol id="svg-icon-bentArrow" viewBox="0 0 20 20">
+            <path d="M13 8v2l3.333-2.5-3.333-2.5v2h-7c-1.105 0-2 0.895-2 2v7h1v-6c0-1.105 0.895-2 2-2h6zM12 3l6 4.5-6 4.5v-3h-5c-0.552 0-1 0.448-1 1v7h-3v-8c0-1.657 1.343-3 3-3h6v-3z"></path>
+        </symbol>
+        <symbol id="svg-icon-bentConnector5" viewBox="0 0 20 20">
+            <path d="M9 5h-7v-1h8v11h8v1h-9v-11z"></path>
+        </symbol>
+        <symbol id="svg-icon-bentConnector5WithArrow" viewBox="0 0 20 20">
+            <path d="M2 4h6v11h7.793l-1.147 1.146 0.707 0.707 2.353-2.354-2.353-2.354-0.707 0.707 1.147 1.146h-6.793v-11h-7v1z"></path>
+        </symbol>
+        <symbol id="svg-icon-bentConnector5WithTwoArrows" viewBox="0 0 20 20">
+            <path d="M4.646 1.646l0.707 0.707-1.646 1.646h6.293v11h6.293l-1.146-1.146 0.707-0.707 2.353 2.353-2.353 2.354-0.707-0.707 1.146-1.147h-7.293v-11h-5.293l1.646 1.646-0.707 0.707-2.854-2.854 2.854-2.854z"></path>
+        </symbol>
+        <symbol id="svg-icon-bentUpArrow" viewBox="0 0 20 20">
+            <path d="M14 8v9h-11v-3h8v-6h-3l4.5-5 4.5 5h-3zM13 16v-9h1.755l-2.255-2.505-2.255 2.505h1.755v8h-8v1h9z"></path>
+        </symbol>
+        <symbol id="svg-icon-bevel" viewBox="0 0 20 20">
+            <path d="M14.293 15h-8.586l-2 2h12.586l-2-2zM5 14.293v-8.586l-2-2v12.586l2-2zM14.293 5l2-2h-12.586l2 2h8.586zM15 5.707v8.586l2 2v-12.586l-2 2zM2 2h16v16h-16v-16zM14 14v-8h-8v8h8z"></path>
+        </symbol>
+        <symbol id="svg-icon-blockArc" viewBox="0 0 20 20">
+            <path d="M17.938 13c0.041 0.328 0.062 0.661 0.062 1h-4c0-2.209-1.791-4-4-4s-4 1.791-4 4h-4c0-0.339 0.021-0.672 0.062-1 0.492-3.946 3.858-7 7.938-7s7.446 3.054 7.938 7zM3.071 13h2.029c0.463-2.282 2.481-4 4.9-4s4.437 1.718 4.9 4h2.029c-0.485-3.392-3.403-6-6.929-6s-6.444 2.608-6.929 6z"></path>
+        </symbol>
+        <symbol id="svg-icon-borderCallout1" viewBox="0 0 20 20">
+            <path d="M9 5h9v9h-10v-3.715l-4.631 5.052-0.737-0.676 5.369-5.857v-3.805h1zM9 13h8v-7h-8v7z"></path>
+        </symbol>
+        <symbol id="svg-icon-borderCallout2" viewBox="0 0 20 20">
+            <path d="M10 5h9v9h-10v-4h-3.703l-2.858 5.239-0.878-0.479 3.142-5.761h4.297v-4h1zM10 13h8v-7h-8v7z"></path>
+        </symbol>
+        <symbol id="svg-icon-borderCallout3" viewBox="0 0 20 20">
+            <path d="M9 5h9v9h-10v-4h-4v3.27l3.325 2.85-0.651 0.759-3.675-3.15v-4.73h5v-4h1zM9 13h8v-7h-8v7z"></path>
+        </symbol>
+        <symbol id="svg-icon-bracePair" viewBox="0 0 20 20">
+            <path d="M13 16.125c0.438-0.171 0.81-0.493 1.057-0.916s0.355-0.922 0.307-1.418v-1.556c-0.042-0.457 0.049-0.918 0.261-1.318s0.533-0.721 0.921-0.918c-0.388-0.198-0.71-0.518-0.921-0.918s-0.303-0.86-0.261-1.318v-1.458c0-1.361-0.454-2.139-1.364-2.431l0.182-0.875c0.695 0.202 1.324 0.606 1.818 1.167 0.382 0.636 0.573 1.383 0.546 2.139v1.458c0 1.167 0.545 1.75 1.454 1.75v0.972c-0.909 0-1.454 0.583-1.454 1.75v1.458c0.027 0.756-0.163 1.502-0.546 2.139-0.507 0.543-1.132 0.944-1.818 1.167l-0.182-0.875z"></path>
+            <path d="M7.4 3.9c-0.482 0.176-0.891 0.507-1.163 0.942s-0.39 0.948-0.337 1.458v1.6c0.046 0.471-0.054 0.944-0.287 1.355s-0.586 0.741-1.013 0.945c0.427 0.203 0.781 0.533 1.013 0.945s0.333 0.885 0.287 1.355v1.5c0 1.4 0.5 2.2 1.5 2.5l-0.2 0.9c-0.764-0.208-1.457-0.623-2-1.2-0.421-0.655-0.63-1.423-0.6-2.2v-1.5c0-1.2-0.6-1.8-1.6-1.8v-1c1 0 1.6-0.6 1.6-1.8v-1.5c-0.030-0.777 0.179-1.545 0.6-2.2 0.558-0.558 1.245-0.971 2-1.2l0.2 0.9z"></path>
+        </symbol>
+        <symbol id="svg-icon-callout1" viewBox="0 0 20 20">
+            <path d="M8 5h1v1h-1v-1zM8 7h1v2h-1v1h1v2h-1v-1.715l-4.631 5.052-0.737-0.676 5.369-5.857v-1.805zM8 13v1h1v-1h-1zM10 5h2v1h-2v-1zM18 7h-1v2h1v-2zM18 10h-1v2h1v-2zM12 13v1h-2v-1h2zM15 13h-2v1h2v-1zM18 13v1h-2v-1h2zM15 5h-2v1h2v-1zM16 5h2v1h-2v-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-callout2" viewBox="0 0 20 20">
+            <path d="M9 5h1v1h-1v-1zM9 7h1v2h-1v-2zM9 10h-3.703l-2.858 5.239-0.878-0.479 3.142-5.761h4.297v1zM9 10h1v2h-1v-2zM9 13h1v1h-1v-1zM11 5h2v1h-2v-1zM19 7h-1v2h1v-2zM19 10h-1v2h1v-2zM13 13v1h-2v-1h2zM16 13h-2v1h2v-1zM19 13v1h-2v-1h2zM16 5h-2v1h2v-1zM17 5h2v1h-2v-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-callout3" viewBox="0 0 20 20">
+            <path d="M8 4h1v1h-1v-1zM8 6h1v2h-1v1h-4v3.293l3.354 3.353-0.707 0.707-3.646-3.646v-4.707h5v-2zM8 9v2h1v-2h-1zM8 13v-1h1v1h-1zM10 4h2v1h-2v-1zM18 6h-1v2h1v-2zM18 9h-1v2h1v-2zM12 12v1h-2v-1h2zM15 12h-2v1h2v-1zM18 12v1h-2v-1h2zM15 4h-2v1h2v-1zM16 4h2v1h-2v-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-can" viewBox="0 0 20 20">
+            <path d="M10 17c1.228 0 2.321-0.253 3.070-0.622 0.813-0.401 0.93-0.769 0.93-0.878v-10.5c-0.912 0.607-2.364 1-4 1s-3.088-0.393-4-1v10.5c0 0.109 0.117 0.477 0.93 0.878 0.749 0.369 1.842 0.622 3.070 0.622zM6 3.5c0 0.108 0.113 0.474 0.912 0.873 0.739 0.369 1.829 0.627 3.088 0.627s2.35-0.257 3.088-0.627c0.798-0.399 0.912-0.766 0.912-0.873 0-0.109-0.117-0.477-0.93-0.878-0.749-0.369-1.842-0.622-3.070-0.622s-2.321 0.252-3.070 0.622c-0.813 0.401-0.93 0.769-0.93 0.878zM5 3.5c0-1.381 2.239-2.5 5-2.5 2.694 0 4.89 1.065 4.996 2.399 0.003 0.034 0.004 0.067 0.004 0.101v12c0 1.4-2.3 2.5-5 2.5s-5-1.1-5-2.5v-12z"></path>
+        </symbol>
+        <symbol id="svg-icon-chevron" viewBox="0 0 20 20">
+            <path d="M3 15l5.891-5.5-5.891-5.5h8l6 5.5-6 5.5h-8zM5.536 5l4.82 4.5-4.82 4.5h5.075l4.909-4.5-4.909-4.5h-5.075z"></path>
+        </symbol>
+        <symbol id="svg-icon-chord" viewBox="0 0 20 20">
+            <path d="M7.333 3.231l9.436 9.435c-0.464 1.076-1.185 2.022-2.098 2.755s-1.993 1.232-3.144 1.452c-1.151 0.22-2.338 0.156-3.458-0.189s-2.139-0.957-2.968-1.786c-0.829-0.828-1.442-1.847-1.786-2.967s-0.409-2.307-0.189-3.458c0.22-1.151 0.719-2.23 1.452-3.144s1.68-1.634 2.756-2.098zM7.538 2c-1.614 0.57-3.012 1.625-4.003 3.020s-1.528 3.062-1.535 4.774c-0 1.951 0.695 3.839 1.96 5.324s3.020 2.47 4.946 2.779c1.927 0.309 3.901-0.079 5.567-1.094s2.917-2.591 3.526-4.445l-10.462-10.358z"></path>
+        </symbol>
+        <symbol id="svg-icon-circularArrow" viewBox="0 0 20 20">
+            <path d="M13 11.4h-2.108l2.608 3.825 2.608-3.825h-2.108v-2.4c0-2.761-2.239-5-5-5s-5 2.239-5 5v6h1v-6c0-2.209 1.791-4 4-4s4 1.791 4 4v2.4zM18 10.4l-4.5 6.6-4.5-6.6h3v-1.4c0-1.657-1.343-3-3-3s-3 1.343-3 3v7h-3v-7c0-3.314 2.686-6 6-6s6 2.686 6 6v1.4h3z"></path>
+        </symbol>
+        <symbol id="svg-icon-cloud" viewBox="0 0 20 20">
+            <path d="M12.001 7.224l0.749-0.192c0.079-0.020 0.163-0.031 0.251-0.031 0.552 0 1 0.448 1 1l-0 0.018-0.020 1.174 1.162-0.166c0.117-0.017 0.236-0.025 0.359-0.025 1.381 0 2.5 1.119 2.5 2.5s-1.119 2.5-2.5 2.5c-0.511 0-0.983-0.152-1.377-0.413l-0.963-0.637-0.493 1.044c-0.562 1.188-1.769 2.007-3.167 2.007-1.118 0-2.114-0.523-2.756-1.343l-0.646-0.824-0.793 0.683c-0.351 0.302-0.805 0.484-1.304 0.484-1.105 0-2-0.895-2-2 0-0.707 0.366-1.329 0.924-1.686l0.796-0.51-0.464-0.824c-0.163-0.289-0.256-0.622-0.256-0.98 0-1.105 0.895-2 2-2 0.117 0 0.231 0.010 0.342 0.029l0.695 0.119 0.346-0.615c0.515-0.917 1.495-1.533 2.618-1.533 1.128 0 2.113 0.623 2.626 1.548l0.375 0.676zM16 8.035c-0.163-0.023-0.33-0.035-0.5-0.035s-0.337 0.012-0.5 0.035c0-0.012 0-0.024 0-0.035 0-0.208-0.032-0.409-0.091-0.598-0.254-0.812-1.013-1.402-1.909-1.402-0.172 0-0.34 0.022-0.499 0.063-0.682-1.23-1.994-2.063-3.501-2.063-1.498 0-2.804 0.824-3.49 2.043-0.166-0.028-0.336-0.043-0.51-0.043-1.657 0-3 1.343-3 3 0 0.535 0.14 1.037 0.385 1.471-0.833 0.533-1.385 1.466-1.385 2.529 0 1.657 1.343 3 3 3 0.648 0 1.248-0.205 1.738-0.555 0.075-0.054 0.148-0.111 0.218-0.171 0.086 0.109 0.176 0.214 0.271 0.315 0.82 0.868 1.983 1.411 3.272 1.411 1.44 0 2.722-0.676 3.545-1.728 0.205-0.262 0.382-0.547 0.526-0.851 0.275 0.182 0.578 0.327 0.901 0.426 0.325 0.1 0.671 0.154 1.029 0.154 1.933 0 3.5-1.567 3.5-3.5 0-1.763-1.304-3.222-3-3.465z"></path>
+        </symbol>
+        <symbol id="svg-icon-cloudCallout" viewBox="0 0 20 20">
+            <path d="M5 15v-1h-1v2h2v-1h-1z"></path>
+            <path d="M3 17v-1h-1v2h2v-1h-1z"></path>
+            <path d="M14.613 7.795l0.689 0.437c0.422 0.268 0.698 0.736 0.698 1.268 0 0.828-0.672 1.5-1.5 1.5-0.232 0-0.448-0.052-0.642-0.143l-0.75-0.356-0.488 0.672c-0.365 0.503-0.955 0.827-1.62 0.827-0.695 0-1.307-0.353-1.667-0.895l-0.833-1.252-0.833 1.252c-0.36 0.542-0.973 0.895-1.667 0.895-1.105 0-2-0.895-2-2 0-0.752 0.414-1.408 1.032-1.751l1.128-0.625-0.886-0.937c-0.17-0.18-0.273-0.421-0.273-0.687 0-0.552 0.448-1 1-1 0.056 0 0.111 0.005 0.163 0.013l0.748 0.122 0.32-0.687c0.398-0.857 1.266-1.448 2.269-1.448 1.030 0 1.917 0.623 2.3 1.518l0.361 0.843 0.871-0.286c0.146-0.048 0.303-0.074 0.469-0.074 0.828 0 1.5 0.672 1.5 1.5 0 0.189-0.035 0.368-0.097 0.533l-0.29 0.762zM3.764 8c-0.475 0.531-0.764 1.232-0.764 2 0 1.657 1.343 3 3 3 0.675 0 1.299-0.223 1.8-0.6 0.273-0.205 0.51-0.456 0.7-0.741 0.19 0.285 0.427 0.536 0.7 0.741 0.501 0.377 1.125 0.6 1.8 0.6 0.999 0 1.885-0.489 2.43-1.24 0.324 0.154 0.687 0.24 1.070 0.24 1.381 0 2.5-1.119 2.5-2.5 0-0.889-0.464-1.669-1.162-2.112 0.105-0.276 0.162-0.575 0.162-0.888 0-1.381-1.119-2.5-2.5-2.5-0.273 0-0.535 0.044-0.781 0.124-0.534-1.249-1.775-2.124-3.219-2.124-1.406 0-2.619 0.83-3.175 2.026-0.106-0.017-0.214-0.026-0.325-0.026-1.105 0-2 0.895-2 2 0 0.174 0.022 0.342 0.064 0.503 0.086 0.332 0.255 0.63 0.484 0.872-0.295 0.164-0.56 0.376-0.783 0.625z"></path>
+        </symbol>
+        <symbol id="svg-icon-corner" viewBox="0 0 20 20">
+            <path d="M10 11h8v7h-16v-16h8v9zM17 12h-8v-9h-6v14h14v-5z"></path>
+        </symbol>
+        <symbol id="svg-icon-cube" viewBox="0 0 20 20">
+            <path d="M6 3l-4 4v11h11l4-4v-11h-11zM6.5 4h9l-3 3h-9l3-3zM3 17v-9h9v9h-9zM13 16.5v-8.5l3-3v8.5l-3 3z"></path>
+        </symbol>
+        <symbol id="svg-icon-curvedConnector3" viewBox="0 0 20 20">
+            <path d="M6 4h3.5c1.235 0 2.421 0.909 2.792 2.171 0.389 1.323-0.131 2.9-2.002 4.235-1.63 1.164-1.859 2.337-1.623 3.139 0.254 0.863 1.068 1.454 1.833 1.454h3.5v1h-3.5c-1.235 0-2.421-0.909-2.792-2.171-0.389-1.323 0.131-2.899 2.002-4.235 1.63-1.164 1.859-2.337 1.623-3.14-0.254-0.863-1.068-1.454-1.833-1.454h-3.5v-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-curvedConnector3WithArrow" viewBox="0 0 20 20">
+            <path d="M9.5 4h-3.5v1h3.5c0.765 0 1.579 0.591 1.833 1.454 0.236 0.802 0.006 1.975-1.623 3.14-1.87 1.336-2.391 2.913-2.002 4.235 0.371 1.262 1.557 2.171 2.792 2.171h2.793l-1.146 1.147 0.707 0.707 2.353-2.354-2.353-2.353-0.707 0.707 1.146 1.146h-2.793c-0.765 0-1.579-0.591-1.833-1.454-0.236-0.802-0.006-1.976 1.623-3.139 1.87-1.336 2.391-2.913 2.002-4.235-0.371-1.262-1.557-2.171-2.792-2.171z"></path>
+        </symbol>
+        <symbol id="svg-icon-curvedConnector3WithTwoArrows" viewBox="0 0 20 20">
+            <path d="M7.646 1.646l0.707 0.707-1.646 1.646h2.793c1.235 0 2.421 0.909 2.792 2.171 0.389 1.323-0.131 2.9-2.002 4.235-1.63 1.164-1.859 2.337-1.623 3.139 0.254 0.863 1.068 1.454 1.833 1.454h2.793l-1.146-1.146 0.707-0.707 2.353 2.353-2.353 2.354-0.707-0.707 1.146-1.147h-2.793c-1.235 0-2.421-0.909-2.792-2.171-0.389-1.323 0.131-2.899 2.002-4.235 1.63-1.164 1.859-2.337 1.623-3.14-0.254-0.863-1.068-1.454-1.833-1.454h-2.793l1.646 1.646-0.707 0.707-2.854-2.854 2.854-2.854z"></path>
+        </symbol>
+        <symbol id="svg-icon-curvedDownArrow" viewBox="0 0 20 20">
+            <path d="M2 14l0.022-0.521c0.104-2.449 0.913-4.923 1.965-6.295 1.034-1.349 2.364-2.183 3.534-2.183h4c0.464 0 0.937 0.2 1.369 0.492 0.439 0.296 0.878 0.715 1.284 1.22 0.776 0.967 1.461 2.289 1.795 3.788h2.031l-4 4.5-4-4.5h2.019c-0.031-0.984-0.291-2.103-0.783-2.98-0.524-0.934-1.26-1.52-2.214-1.52-0.417 0-0.804 0.199-1.172 0.611-0.374 0.419-0.701 1.029-0.971 1.762-0.539 1.462-0.808 3.782-0.857 5.145l-0.017 0.482h-4.004zM6.983 6.087c-0.666 0.201-1.473 0.754-2.202 1.705-0.85 1.109-1.546 3.203-1.725 5.208h1.991c0.091-1.368 0.371-3.557 0.893-4.973 0.268-0.726 0.609-1.408 1.042-1.94zM11.343 6c0.3 0.303 0.554 0.655 0.765 1.030 0.624 1.112 0.914 2.5 0.914 3.67v0.8h-0.793l1.771 2.086 1.815-2.086h-0.793v-0.65c-0.288-1.398-0.921-2.632-1.627-3.512-0.357-0.445-0.724-0.789-1.063-1.017-0.346-0.234-0.623-0.321-0.809-0.321h-0.179z"></path>
+        </symbol>
+        <symbol id="svg-icon-curvedLeftArrow" viewBox="0 0 20 20">
+            <path d="M6 2l0.521 0.022c2.449 0.104 4.923 0.913 6.296 1.965 1.348 1.034 2.183 2.364 2.183 3.534v4c0 0.464-0.201 0.937-0.492 1.369-0.297 0.439-0.715 0.878-1.22 1.284-0.967 0.776-2.289 1.461-3.788 1.795l-0 2.031-4.5-4 4.5-4v2.019c0.984-0.031 2.103-0.291 2.98-0.783 0.934-0.524 1.52-1.26 1.52-2.214 0-0.417-0.199-0.804-0.611-1.172-0.419-0.374-1.029-0.701-1.762-0.971-1.462-0.539-3.782-0.808-5.145-0.857l-0.482-0.017v-4.004zM13.913 6.983c-0.201-0.666-0.754-1.473-1.705-2.202-1.109-0.85-3.203-1.546-5.208-1.725v1.991c1.368 0.091 3.557 0.371 4.973 0.893 0.726 0.268 1.408 0.609 1.94 1.042zM14 11.343c-0.303 0.3-0.655 0.554-1.030 0.765-1.112 0.624-2.5 0.914-3.67 0.914h-0.8v-0.793l-2.086 1.771 2.086 1.815v-0.793h0.65c1.398-0.288 2.632-0.921 3.512-1.627 0.445-0.357 0.789-0.724 1.017-1.063 0.234-0.346 0.321-0.623 0.321-0.809v-0.179z"></path>
+        </symbol>
+        <symbol id="svg-icon-curvedRightArrow" viewBox="0 0 20 20">
+            <path d="M14 2l-0.521 0.022c-2.449 0.104-4.923 0.913-6.295 1.965-1.349 1.034-2.183 2.364-2.183 3.534v4c0 0.464 0.2 0.937 0.492 1.369 0.296 0.439 0.715 0.878 1.22 1.284 0.967 0.776 2.289 1.461 3.788 1.795v2.031l4.5-4-4.5-4v2.019c-0.984-0.031-2.103-0.291-2.98-0.783-0.934-0.524-1.52-1.26-1.52-2.214 0-0.417 0.199-0.804 0.611-1.172 0.419-0.374 1.029-0.701 1.762-0.971 1.462-0.539 3.782-0.808 5.145-0.857l0.482-0.017v-4.004zM6.087 6.983c0.201-0.666 0.754-1.473 1.705-2.202 1.109-0.85 3.203-1.546 5.208-1.725v1.991c-1.368 0.091-3.557 0.371-4.973 0.893-0.726 0.268-1.408 0.609-1.94 1.042zM6 11.343c0.303 0.3 0.655 0.554 1.030 0.765 1.112 0.624 2.5 0.914 3.67 0.914h0.8v-0.793l2.086 1.771-2.086 1.815v-0.793h-0.65c-1.398-0.288-2.632-0.921-3.512-1.627-0.445-0.357-0.789-0.724-1.017-1.063-0.234-0.346-0.321-0.623-0.321-0.809v-0.179z"></path>
+        </symbol>
+        <symbol id="svg-icon-curvedUpArrow" viewBox="0 0 20 20">
+            <path d="M2 6l0.022 0.521c0.104 2.449 0.913 4.923 1.965 6.296 1.034 1.348 2.364 2.183 3.534 2.183h4c0.464 0 0.937-0.2 1.369-0.492 0.439-0.297 0.878-0.715 1.284-1.22 0.776-0.967 1.461-2.289 1.795-3.788l2.031-0-4-4.5-4 4.5h2.019c-0.031 0.984-0.291 2.103-0.783 2.98-0.524 0.934-1.26 1.52-2.214 1.52-0.417 0-0.804-0.199-1.172-0.611-0.374-0.419-0.701-1.029-0.971-1.762-0.539-1.462-0.808-3.782-0.857-5.145l-0.017-0.482h-4.004zM6.983 13.913c-0.666-0.201-1.473-0.754-2.202-1.705-0.85-1.108-1.546-3.203-1.725-5.208h1.991c0.091 1.368 0.371 3.557 0.893 4.973 0.268 0.726 0.609 1.408 1.042 1.94zM11.343 14c0.3-0.303 0.554-0.655 0.765-1.030 0.624-1.112 0.914-2.5 0.914-3.67v-0.8h-0.793l1.771-2.086 1.815 2.086h-0.793v0.65c-0.288 1.398-0.921 2.632-1.627 3.512-0.357 0.445-0.724 0.789-1.063 1.017-0.346 0.234-0.623 0.321-0.809 0.321h-0.179z"></path>
+        </symbol>
+        <symbol id="svg-icon-decagon" viewBox="0 0 20 20">
+            <path d="M7.214 17h5.572l4.214-4.214v-5.572l-4.214-4.214h-5.572l-4.214 4.214v5.572l4.214 4.214zM13.2 18h-6.4l-4.8-4.8v-6.4l4.8-4.8h6.4l4.8 4.8v6.4l-4.8 4.8z"></path>
+            <path d="M9 7v6h4v-6h-4zM12 12h-2v-4h2v4z"></path>
+            <path d="M7 7v1h-1v1h1v4h1v-6h-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-diagStripe" viewBox="0 0 20 20">
+            <path d="M3 12.414l9.414-9.414h4.586v0.586l-13.414 13.414h-0.586v-4.586zM2 12v6h2l14-14v-2h-6l-10 10z"></path>
+        </symbol>
+        <symbol id="svg-icon-diamond" viewBox="0 0 20 20">
+            <path d="M10 3.414l6.586 6.586-6.586 6.586-6.586-6.586 6.586-6.586zM2 10l8 8 8-8-8-8-8 8z"></path>
+        </symbol>
+        <symbol id="svg-icon-dodecagon" viewBox="0 0 20 20">
+            <path d="M7.214 17h5.572l4.214-4.214v-5.572l-4.214-4.214h-5.572l-4.214 4.214v5.572l4.214 4.214zM13.2 18h-6.4l-4.8-4.8v-6.4l4.8-4.8h6.4l4.8 4.8v6.4l-4.8 4.8z"></path>
+            <path d="M8 8v1h-1v1h1v3h1v-5h-1z"></path>
+            <path d="M12.682 8.318c0.183 0.183 0.296 0.424 0.318 0.682v1h-1v-1h-2v-1h2c0.258 0.023 0.499 0.135 0.682 0.318zM11 11v-1h1v1h-1zM11 11v1h2v1h-3v-2h1z"></path>
+        </symbol>
+        <symbol id="svg-icon-donut" viewBox="0 0 20 20">
+            <path d="M10 17c-3.866 0-7-3.134-7-7s3.134-7 7-7c3.866 0 7 3.134 7 7s-3.134 7-7 7zM10 18c4.418 0 8-3.582 8-8s-3.582-8-8-8c-4.418 0-8 3.582-8 8s3.582 8 8 8z"></path>
+            <path d="M10 14c-2.209 0-4-1.791-4-4s1.791-4 4-4c2.209 0 4 1.791 4 4s-1.791 4-4 4zM10 15c2.761 0 5-2.239 5-5s-2.239-5-5-5c-2.761 0-5 2.239-5 5s2.239 5 5 5z"></path>
+        </symbol>
+        <symbol id="svg-icon-doubleWave" viewBox="0 0 20 20">
+            <path d="M3 14.041c0.167-0.027 0.334-0.041 0.5-0.041 0.603 0 1.123 0.202 1.55 0.433 0.367 0.199 0.724 0.454 1.029 0.671 0.039 0.028 0.076 0.055 0.113 0.081 0.725 0.515 1.233 0.815 1.809 0.815 0.361 0 0.577-0.080 0.737-0.174 0.186-0.109 0.346-0.264 0.594-0.521 0.013-0.014 0.027-0.028 0.041-0.042 0.221-0.229 0.531-0.551 0.932-0.8 0.461-0.286 1.010-0.463 1.696-0.463 0.688 0 1.232 0.179 1.683 0.488 0.357 0.245 0.633 0.565 0.817 0.778 0.023 0.027 0.045 0.053 0.066 0.076 0.207 0.237 0.347 0.374 0.524 0.473 0.163 0.091 0.427 0.186 0.911 0.186 0.216 0 0.502-0.107 0.75-0.306 0.118-0.094 0.197-0.186 0.239-0.251 0.004-0.007 0.008-0.013 0.011-0.018v-8.465c-0.166 0.026-0.333 0.039-0.5 0.039-0.606 0-1.121-0.204-1.542-0.439-0.346-0.193-0.685-0.442-0.973-0.652-0.047-0.034-0.092-0.068-0.136-0.099-0.686-0.499-1.202-0.809-1.849-0.809-0.56 0-0.803 0.218-1.293 0.707-0.009 0.009-0.017 0.017-0.026 0.026-0.51 0.511-1.266 1.267-2.681 1.267-0.688 0-1.232-0.179-1.683-0.488-0.357-0.245-0.633-0.565-0.817-0.778-0.023-0.027-0.045-0.053-0.066-0.076-0.207-0.237-0.347-0.374-0.524-0.473-0.163-0.091-0.427-0.186-0.911-0.186-0.315 0-0.61 0.098-0.802 0.232-0.185 0.129-0.198 0.228-0.198 0.268v8.541zM3 15.059c-0.355 0.080-0.711 0.238-1 0.441v-10c0-0.9 1-1.5 2-1.5 1.32 0 1.803 0.557 2.26 1.083 0.409 0.471 0.796 0.917 1.74 0.917 1 0 1.5-0.5 2-1s1-1 2-1c1.072 0 1.856 0.574 2.585 1.108 0.631 0.462 1.219 0.892 1.915 0.892 0.164 0 0.332-0.019 0.5-0.056 0.345-0.075 0.69-0.226 1-0.444v10c0 0.6-1 1.5-2 1.5-1.32 0-1.803-0.557-2.26-1.083-0.408-0.471-0.796-0.917-1.74-0.917-0.984 0-1.452 0.484-1.927 0.976-0.491 0.508-0.99 1.024-2.073 1.024-0.984 0-1.765-0.556-2.502-1.082-0.661-0.471-1.288-0.918-1.998-0.918-0.161 0-0.331 0.021-0.5 0.059z"></path>
+        </symbol>
+        <symbol id="svg-icon-downArrow" viewBox="0 0 20 20">
+            <path d="M8 9h-3l5.5 7.333 5.5-7.333h-3v-6h-5v6zM18 8l-7.5 10-7.5-10h4v-6h7v6h4z"></path>
+        </symbol>
+        <symbol id="svg-icon-downArrowCallout" viewBox="0 0 20 20">
+            <path d="M12 10h4v-7h-11v7h4v4h-1.413l2.913 2.648 2.913-2.648h-1.413v-4zM16 13l-5.5 5-5.5-5h3v-2h-4v-9h13v9h-4v2h3z"></path>
+        </symbol>
+        <symbol id="svg-icon-ellipse" viewBox="0 0 20 20">
+            <path d="M10 5c3.9 0 7 2.2 7 5s-3.1 5-7 5c-3.9 0-7-2.2-7-5s3.1-5 7-5zM10 4c-4.4 0-8 2.7-8 6s3.6 6 8 6c4.4 0 8-2.7 8-6s-3.6-6-8-6z"></path>
+        </symbol>
+        <symbol id="svg-icon-ellipseRibbon" viewBox="0 0 20 20">
+            <path d="M4.566 9l-1.8-3h3.234v6h-3.234l1.8-3zM7 8.436c0.848 0.364 1.897 0.564 3 0.564s2.152-0.199 3-0.564v4.314c0 0.1-0.082 0.393-0.662 0.719-0.548 0.308-1.373 0.531-2.338 0.531s-1.79-0.222-2.338-0.531c-0.58-0.326-0.662-0.62-0.662-0.719v-4.314zM14 6h3.234l-1.8 3 1.8 3h-3.234v-6zM13.976 13h5.024l-2.4-4 2.4-4h-7c-0.552 0-1 0.448-1 1v1.937c-0.32 0.041-0.655 0.063-1 0.063s-0.68-0.022-1-0.063v-1.937c0-0.552-0.448-1-1-1h-7l2.4 4-2.4 4h5.024c0.221 1.125 1.917 2 3.976 2s3.754-0.875 3.976-2z"></path>
+        </symbol>
+        <symbol id="svg-icon-ellipseRibbon2" viewBox="0 0 20 20">
+            <path d="M15.434 11l1.8 3h-3.234v-6h3.234l-1.8 3zM13 11.563c-0.848-0.364-1.897-0.563-3-0.563s-2.152 0.199-3 0.563v-4.313c0-0.1 0.082-0.393 0.662-0.719 0.548-0.308 1.373-0.531 2.338-0.531s1.79 0.222 2.338 0.531c0.579 0.326 0.662 0.62 0.662 0.719v4.313zM6 14h-3.234l1.8-3-1.8-3h3.234v6zM6.024 7h-5.024l2.4 4-2.4 4h7c0.552 0 1-0.448 1-1v-1.937c0.32-0.041 0.655-0.063 1-0.063s0.68 0.022 1 0.063v1.937c0 0.552 0.448 1 1 1h7l-2.4-4 2.4-4h-5.024c-0.221-1.125-1.917-2-3.976-2s-3.754 0.875-3.976 2z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartAlternateProcess" viewBox="0 0 20 20">
+            <path d="M14 5h-8c-1.657 0-3 1.343-3 3v4c0 1.657 1.343 3 3 3h8c1.657 0 3-1.343 3-3v-4c0-1.657-1.343-3-3-3zM6 4h8c2.209 0 4 1.791 4 4v4c0 2.209-1.791 4-4 4h-8c-2.209 0-4-1.791-4-4v-4c0-2.209 1.791-4 4-4z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartCollate" viewBox="0 0 20 20">
+            <path d="M5 17l4.5-7-4.5-7h9l-4.5 7 4.5 7h-9zM9.5 8.151l2.668-4.151h-5.337l2.668 4.151zM9.5 11.849l-2.668 4.151h5.337l-2.668-4.151z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartConnector" viewBox="0 0 20 20">
+            <path d="M10 15c2.761 0 5-2.239 5-5s-2.239-5-5-5c-2.761 0-5 2.239-5 5s2.239 5 5 5zM16 10c0 3.314-2.686 6-6 6s-6-2.686-6-6c0-3.314 2.686-6 6-6s6 2.686 6 6z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartDecision" viewBox="0 0 20 20">
+            <path d="M3 9.5l7.5-4.5 7.5 4.5-7.5 4.5-7.5-4.5zM4.944 9.5l5.556 3.334 5.556-3.334-5.556-3.334-5.556 3.334z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartDelay" viewBox="0 0 20 20">
+            <path d="M9.999 4c3.252 0.007 5.976 2.727 6.001 6.005 0.009 3.285-2.732 5.988-6.001 5.995h-5.999l-0-12h5.999zM10 3h-7l0 14h7c3.813-0.007 7.012-3.151 7-7-0.027-3.822-3.193-6.993-7-7z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartDisplay" viewBox="0 0 20 20">
+            <path d="M7.6 16l-3.467-6.5 3.467-6.5h5.87c0.769 0 1.629 0.524 2.352 1.727 0.71 1.183 1.179 2.874 1.179 4.773s-0.468 3.59-1.179 4.773c-0.722 1.203-1.583 1.727-2.352 1.727h-5.87zM3 9.5l4 7.5h6.47c2.517 0 4.53-3.4 4.53-7.5s-2.013-7.5-4.53-7.5h-6.47l-4 7.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartDocument" viewBox="0 0 20 20">
+            <path d="M17 5h-14v8.679c0.307 0.4 0.804 0.93 1.435 1.385 0.763 0.55 1.644 0.936 2.565 0.936 1.674 0 2.79-0.518 4.24-1.192 0.064-0.030 0.129-0.060 0.194-0.090l0.030-0.014c1.499-0.695 3.203-1.485 5.537-1.666v-8.038zM18 14c-2.639 0-4.443 0.836-6.146 1.625-0.077 0.036-0.153 0.071-0.229 0.106-1.43 0.665-2.726 1.268-4.626 1.268-2.4 0-4.333-2-5-3v-10h16v10z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartExtract" viewBox="0 0 20 20">
+            <path d="M3 16l6.5-13 6.5 13h-13zM4.618 15h9.764l-4.882-9.764-4.882 9.764z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartInputOutput" viewBox="0 0 20 20">
+            <path d="M2 16l4.966-12h11.034l-5.076 12h-10.924zM3.496 15h8.765l4.23-10h-8.857l-4.138 10z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartInternalStorage" viewBox="0 0 20 20">
+            <path d="M16 4h-12v12h12v-12zM17 3v14h-14v-14h14z"></path>
+            <path d="M6 3h-1v14h1v-14z"></path>
+            <path d="M17 5h-14v1h14v-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartMagneticDisk" viewBox="0 0 20 20">
+            <path d="M15.998 7.985c0.382-0.162 0.718-0.34 1-0.53v6.737c0 0 0 0 0 0-0.049 0.047-0.131 0.115-0.26 0.199-0.371 0.242-0.956 0.51-1.701 0.759-1.484 0.496-3.389 0.85-4.984 0.85s-3.501-0.354-5-0.851c-0.495-0.164-0.924-0.337-1.271-0.506-0.18-0.088-0.338-0.175-0.472-0.26-0.148-0.094-0.244-0.17-0.301-0.225-0.003-0.003-0.006-0.006-0.009-0.008v-6.697c0.282 0.191 0.618 0.369 1 0.531 1.466 0.623 3.611 1.016 6 1.016s4.532-0.392 5.998-1.015zM2.439 14.988c0.098 0.080 0.21 0.16 0.336 0.24 0.487 0.308 1.171 0.607 1.963 0.87 1.584 0.525 3.597 0.902 5.315 0.902s3.731-0.377 5.301-0.902c0.785-0.263 1.459-0.562 1.931-0.87 0.021-0.014 0.042-0.028 0.062-0.041 0.097-0.066 0.181-0.13 0.253-0.191 0.032-0.027 0.062-0.054 0.090-0.082 0.184-0.177 0.293-0.353 0.308-0.524 0.002-0.027 0.002-0.055 0-0.082v-8.243c0.001-0.022 0.002-0.043 0.002-0.065s-0.001-0.043-0.002-0.065v-0.027l-0.003-0.008c-0.008-0.096-0.029-0.19-0.061-0.284-0.467-1.371-3.403-2.453-7.084-2.599-0.261-0.011-0.527-0.017-0.798-0.017h-0.053c-4.070 0-7.431 1.14-7.935 2.615-0.041 0.121-0.064 0.245-0.065 0.37-0 0.005-0 0.010-0 0.015l0 0.015-0 8.292c0 0.103 0.035 0.209 0.101 0.316 0.009 0.014 0.018 0.028 0.028 0.043 0.006 0.009 0.013 0.018 0.020 0.027 0.043 0.058 0.094 0.116 0.154 0.173 0.042 0.040 0.087 0.081 0.136 0.121zM3.003 6.249l-0.003-0.247-0-0.002c0-0.026 0.010-0.17 0.292-0.419 0.281-0.249 0.744-0.519 1.402-0.766 1.309-0.491 3.185-0.815 5.306-0.815h0.053c0.257 0 0.509 0.005 0.756 0.016l0.003 0c1.885 0.075 3.519 0.405 4.664 0.865 0.575 0.231 0.982 0.477 1.236 0.703 0.256 0.228 0.285 0.369 0.288 0.403l0 0.002 0 0.002 0 0.008-0 0.008-0.002 0.028v0.212l-0.559 0.378c-1.124 0.759-3.51 1.374-6.439 1.374-2.93 0-5.317-0.616-6.44-1.375l-0.557-0.376zM2.948 14.092c-0 0-0 0 0 0s0 0.001 0.001 0.002c0 0.001 0.001 0.002 0.002 0.003z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartMagneticDrum" viewBox="0 0 20 20">
+            <path d="M12.015 15.998c0.162 0.382 0.34 0.718 0.531 1h-6.737c0 0 0 0 0 0-0.047-0.049-0.115-0.131-0.199-0.26-0.242-0.371-0.51-0.956-0.759-1.701-0.496-1.484-0.85-3.389-0.85-4.984s0.354-3.501 0.851-5c0.164-0.495 0.337-0.924 0.506-1.271 0.088-0.18 0.175-0.338 0.26-0.472 0.094-0.148 0.17-0.244 0.225-0.301 0.003-0.003 0.006-0.006 0.008-0.009h6.697c-0.191 0.282-0.369 0.618-0.531 1-0.623 1.466-1.016 3.611-1.016 6s0.393 4.532 1.015 5.998zM5.012 2.439c-0.080 0.098-0.16 0.21-0.24 0.336-0.308 0.487-0.607 1.171-0.87 1.963-0.525 1.584-0.902 3.597-0.902 5.315s0.377 3.731 0.902 5.301c0.262 0.785 0.562 1.459 0.87 1.931 0.014 0.021 0.028 0.042 0.041 0.062 0.066 0.097 0.13 0.181 0.191 0.253 0.027 0.032 0.054 0.062 0.082 0.090 0.177 0.184 0.353 0.293 0.524 0.308 0.028 0.002 0.055 0.002 0.082 0h8.243c0.022 0.001 0.043 0.002 0.065 0.002s0.043-0.001 0.065-0.002h0.027l0.008-0.003c0.096-0.008 0.19-0.029 0.284-0.061 1.371-0.467 2.453-3.403 2.599-7.084 0.011-0.261 0.017-0.527 0.017-0.798v-0.053c0-4.070-1.14-7.431-2.615-7.935-0.121-0.041-0.244-0.064-0.37-0.065-0.005-0-0.010-0-0.015-0l-0.015 0-8.292-0c-0.103 0-0.209 0.035-0.316 0.101-0.014 0.009-0.029 0.018-0.043 0.028-0.009 0.006-0.018 0.013-0.027 0.020-0.058 0.043-0.115 0.094-0.173 0.154-0.040 0.042-0.081 0.087-0.121 0.136zM13.751 3.003l0.249-0.003c0.026 0 0.17 0.010 0.419 0.292 0.249 0.281 0.519 0.744 0.766 1.402 0.491 1.309 0.815 3.185 0.815 5.306v0.053c0 0.257-0.005 0.509-0.016 0.756l-0 0.003c-0.075 1.885-0.405 3.519-0.865 4.664-0.231 0.575-0.477 0.982-0.703 1.236-0.228 0.256-0.369 0.285-0.403 0.288l-0.002 0-0.002 0-0.008 0-0.008-0-0.028-0.002h-0.212l-0.378-0.559c-0.759-1.124-1.374-3.51-1.374-6.439 0-2.93 0.616-5.317 1.375-6.44l0.376-0.557zM5.908 2.948c0-0 0-0 0 0s-0.001 0-0.002 0.001c-0.001 0-0.002 0.001-0.003 0.002z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartMagneticTape" viewBox="0 0 20 20">
+            <path d="M13.829 15h3.171v1h-7c-3.314 0-6-2.686-6-6s2.686-6 6-6c3.314 0 6 2.686 6 6 0 1.276-0.397 2.456-1.075 3.428l-1.097 1.572zM16.326 13c0.432-0.909 0.674-1.926 0.674-3 0-3.866-3.134-7-7-7s-7 3.134-7 7c0 3.866 3.134 7 7 7h8v-3h-2.255c0.22-0.315 0.415-0.65 0.581-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartManualInput" viewBox="0 0 20 20">
+            <path d="M3 9.735l14-4.375v9.64h-14v-5.265zM2 9v7h16v-12l-16 5z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartManualOperation" viewBox="0 0 20 20">
+            <path d="M6.721 15l-3.333-10h13.196l-3.556 10h-6.307zM6 16h7.733l4.267-12h-16l4 12z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartMerge" viewBox="0 0 20 20">
+            <path d="M16 3l-6.5 13-6.5-13h13zM14.382 4h-9.764l4.882 9.764 4.882-9.764z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartMultidocument" viewBox="0 0 20 20">
+            <path d="M13 9v5c-1.61 0.094-3.179 0.538-4.6 1.3-0.718 0.455-1.55 0.698-2.4 0.7-0.568 0.044-1.138-0.052-1.661-0.278s-0.982-0.577-1.339-1.022v-5.7h10zM14 8h-12v7c0.419 0.668 1.014 1.208 1.72 1.561s1.494 0.505 2.28 0.439c3 0 3-2 8-2v-7z"></path>
+            <path d="M4 6v2h1v-1h10v6h-1v1h2v-8h-12z"></path>
+            <path d="M6 4v2h1v-1h10v7h-1v1h2v-9h-12z"></path>
+            <path d="M6 5.998h-2v1.998h-2v6.992c0.419 0.667 1.014 1.207 1.72 1.559s1.494 0.504 2.28 0.438c1.309 0 2.047-0.381 2.879-0.809 1.074-0.554 2.303-1.188 5.121-1.188v-0.999h2v-0.999h2v-8.99h-12v1.998zM7 5.998v-0.999h10v6.992h-1v-5.993h-9zM14 7.995h-9v-0.999h10v5.993h-1v-4.994zM13 8.994v4.994c-1.61 0.094-3.179 0.537-4.6 1.298-0.718 0.455-1.55 0.697-2.4 0.699-0.568 0.044-1.138-0.052-1.661-0.278s-0.982-0.577-1.339-1.021v-5.694h10z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartOffpageConnector" viewBox="0 0 20 20">
+            <path d="M6 9.948l4.5 3.75 4.5-3.75v-4.948h-9v4.948zM16 10.417l-5.5 4.583-5.5-4.583v-6.417h11v6.417z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartOnlineStorage" viewBox="0 0 20 20">
+            <path d="M5.318 12.682c-0.844-0.844-1.318-1.988-1.318-3.182s0.474-2.338 1.318-3.182 1.989-1.318 3.182-1.318h5.964c-0.208 0.278-0.397 0.57-0.566 0.876-0.613 1.11-0.934 2.357-0.934 3.624s0.321 2.515 0.934 3.624c0.169 0.306 0.358 0.598 0.566 0.876h-5.964c-1.193 0-2.338-0.474-3.182-1.318zM8.5 4c-1.459 0-2.858 0.579-3.889 1.611s-1.611 2.43-1.611 3.889c0 1.459 0.579 2.858 1.611 3.889s2.43 1.611 3.889 1.611h8.5c-0.45-0.283-0.861-0.619-1.226-1-0.389-0.406-0.726-0.862-1-1.359-0.531-0.962-0.809-2.043-0.809-3.141s0.278-2.179 0.809-3.141c0.274-0.496 0.611-0.953 1-1.359 0.365-0.381 0.777-0.717 1.226-1h-8.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartOr" viewBox="0 0 20 20">
+            <path d="M10 15.981c-3.191-0.243-5.738-2.79-5.981-5.981h5.981v5.981zM4.019 9c0.243-3.191 2.79-5.738 5.981-5.981v5.981h-5.981zM16.981 10c-0.243 3.191-2.79 5.738-5.981 5.981v-5.981h5.981zM16.981 9h-5.981v-5.981c3.191 0.243 5.738 2.79 5.981 5.981zM17.984 9c-0.257-3.909-3.509-7-7.484-7-4.142 0-7.5 3.358-7.5 7.5s3.358 7.5 7.5 7.5c3.974 0 7.226-3.091 7.484-7h0.016v-1h-0.016z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartPredefinedProcess" viewBox="0 0 20 20">
+            <path d="M17 5h-14v10h14v-10zM18 4v12h-16v-12h16z"></path>
+            <path d="M5 4h-1v12h1v-12z"></path>
+            <path d="M16 4h-1v12h1v-12z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartPreparation" viewBox="0 0 20 20">
+            <path d="M7.378 14l-4.035-4.5 4.035-4.5h5.244l4.035 4.5-4.035 4.5h-5.244zM2 9.5l4.932 5.5h6.137l4.932-5.5-4.932-5.5h-6.137l-4.932 5.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartProcess" viewBox="0 0 20 20">
+            <path d="M17 5h-14v10h14v-10zM18 4v12h-16v-12h16z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartPunchedCard" viewBox="0 0 20 20">
+            <path d="M3 8.448l3.417-3.448h10.583v10h-14v-6.552zM2 8.036v7.964h16v-12h-12l-4 4.036z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartPunchedTape" viewBox="0 0 20 20">
+            <path d="M3 12.594v-6.591c0.321 0.163 0.65 0.301 0.972 0.418 1.029 0.373 2.145 0.579 3.028 0.579 1.45 0 2.503-0.565 3.376-1.033 0.053-0.028 0.105-0.057 0.157-0.084 0.907-0.484 1.724-0.882 2.967-0.882 1.106 0 1.814 0.219 2.338 0.501 0.435 0.235 0.78 0.53 1.162 0.892v6.57c-0.953-0.558-2.121-0.963-3.5-0.963-1.737 0-2.915 0.589-3.916 1.090l-0.032 0.016c-0.992 0.496-1.808 0.894-3.053 0.894-1.391 0-2.068-0.232-2.486-0.482-0.339-0.203-0.542-0.42-0.845-0.743-0.053-0.057-0.109-0.117-0.17-0.18zM2 13c0.127 0.127 0.246 0.254 0.363 0.379 0.804 0.859 1.518 1.621 4.137 1.621 1.5 0 2.5-0.5 3.5-1s2-1 3.5-1c1.418 0 2.585 0.503 3.5 1.152 0.376 0.266 0.709 0.557 1 0.848v-9.033c-0.013-0.013-0.027-0.026-0.040-0.039-0.987-0.955-1.993-1.928-4.46-1.928-2 0-2.59 0.547-3.565 1.068-0.89 0.476-1.742 0.932-2.935 0.932-1.123 0-2.805-0.402-4-1.142-0.402-0.249-0.748-0.536-1-0.858v9z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartSort" viewBox="0 0 20 20">
+            <path d="M6.357 10h8.287l-4.143-4.52-4.143 4.52zM16 10v1l-5.5 6-5.5-6v-1l5.5-6 5.5 6zM6.357 11l4.143 4.52 4.143-4.52h-8.287z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartSummingJunction" viewBox="0 0 20 20">
+            <path d="M14.729 15.436l-4.229-4.229-4.229 4.229c1.137 0.975 2.614 1.564 4.229 1.564s3.092-0.589 4.229-1.564zM15.436 14.729c0.975-1.137 1.564-2.614 1.564-4.229s-0.589-3.092-1.564-4.229l-4.229 4.229 4.229 4.229zM14.729 5.564c-1.137-0.975-2.614-1.564-4.229-1.564s-3.092 0.589-4.229 1.564l4.229 4.229 4.229-4.229zM5.564 6.271c-0.975 1.137-1.564 2.614-1.564 4.229s0.589 3.092 1.564 4.229l4.229-4.229-4.229-4.229zM18 10.5c0 4.142-3.358 7.5-7.5 7.5s-7.5-3.358-7.5-7.5c0-4.142 3.358-7.5 7.5-7.5s7.5 3.358 7.5 7.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-flowChartTerminator" viewBox="0 0 20 20">
+            <path d="M3.934 12.099c-0.606-0.568-0.934-1.325-0.934-2.099s0.327-1.531 0.934-2.099c0.608-0.57 1.447-0.901 2.333-0.901h7.467c0.887 0 1.725 0.331 2.333 0.901 0.606 0.568 0.934 1.325 0.934 2.099s-0.327 1.531-0.934 2.099c-0.608 0.57-1.447 0.901-2.333 0.901h-7.467c-0.886 0-1.725-0.331-2.333-0.901zM3.25 12.828c0.8 0.75 1.885 1.172 3.017 1.172h7.467c1.132 0 2.217-0.421 3.017-1.172s1.25-1.767 1.25-2.828c0-1.061-0.449-2.078-1.25-2.828s-1.885-1.172-3.017-1.172h-7.467c-1.132 0-2.217 0.421-3.017 1.172s-1.25 1.768-1.25 2.828c0 1.061 0.45 2.078 1.25 2.828z"></path>
+        </symbol>
+        <symbol id="svg-icon-foldedCorner" viewBox="0 0 20 20">
+            <path d="M16 12v-8h-12v12h8v-4h4zM17 12v2l-3 3h-11v-14h14v9zM16 13h-3v3h0.6l2.4-2.4v-0.6z"></path>
+        </symbol>
+        <symbol id="svg-icon-frame" viewBox="0 0 20 20">
+            <path d="M17 3v14h-14v-14h14zM4 16h12v-12h-12v12zM18 2h-16v16h16v-16zM5 15v-10h10v10h-10z"></path>
+        </symbol>
+        <symbol id="svg-icon-halfFrame" viewBox="0 0 20 20">
+            <path d="M5 5v10l-3 3v-16h16l-3 3h-10zM4 14.586v-10.586h10.586l1-1h-12.586v12.586l1-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-heart" viewBox="0 0 20 20">
+            <path d="M15.902 10.516l0.010-0.010c1.451-1.488 1.451-3.912 0-5.4-1.438-1.474-3.758-1.474-5.196-0l-0.716 0.734-0.716-0.734c-1.438-1.474-3.758-1.474-5.196 0-1.451 1.488-1.451 3.912 0 5.4l0.009 0.009 0.002 0.002 5.901 6.051 5.902-6.052zM10 18l-6.627-6.796c-1.83-1.877-1.83-4.92 0-6.796 1.773-1.818 4.614-1.875 6.454-0.17 0.059 0.055 0.117 0.111 0.174 0.17 0.057-0.058 0.115-0.115 0.174-0.17 1.84-1.705 4.68-1.649 6.454 0.17 1.83 1.877 1.83 4.92 0 6.796l-0.011 0.011-6.617 6.785z"></path>
+        </symbol>
+        <symbol id="svg-icon-heptagon" viewBox="0 0 20 20">
+            <path d="M7.003 17l-3.924-5.108 1.399-6.2 5.544-2.575 5.197 2.786 1.685 6.021-3.807 5.076h-6.094zM2 12.129l4.51 5.871h7.087l4.403-5.871-1.933-6.906-6.013-3.223-6.443 2.993-1.611 7.137z"></path>
+            <path d="M11 7h-3v1h3v1h1v-2h-1z"></path>
+            <path d="M11 9h-1v2h1v-2z"></path>
+            <path d="M10 11h-1v2h1v-2z"></path>
+        </symbol>
+        <symbol id="svg-icon-hexagon" viewBox="0 0 20 20">
+            <path d="M6.531 16l-3.383-6 3.383-6h6.74l3.566 6-3.566 6h-6.74zM2 10l3.947 7h7.893l4.16-7-4.16-7h-7.893l-3.947 7z"></path>
+        </symbol>
+        <symbol id="svg-icon-homePlate" viewBox="0 0 20 20">
+            <path d="M4 5v9h7.367l4.257-4.5-4.257-4.5h-7.367zM11.797 4l5.203 5.5-5.203 5.5h-8.797v-11h8.797z"></path>
+        </symbol>
+        <symbol id="svg-icon-horizontalScroll" viewBox="0 0 20 20">
+            <path d="M4 7c0.552 0 1 0.448 1 1s-0.448 1-1 1c-0.552 0-1-0.448-1-1s0.448-1 1-1zM5 6h-1c-1.105 0-2 0.895-2 2v8c0 1.105 0.895 2 2 2s2-0.895 2-2h10c1.105 0 2-0.895 2-2v-9c0-1.105-0.895-2-2-2s-2 0.895-2 2v1h-9zM17 5c0 0.552-0.448 1-1 1s-1-0.448-1-1c0-0.552 0.448-1 1-1s1 0.448 1 1zM17 7v7c0 0.552-0.448 1-1 1h-10v-8h11zM4 10c0.364 0 0.706-0.097 1-0.268v6.268c0 0.552-0.448 1-1 1s-1-0.448-1-1v-6.268c0.294 0.17 0.636 0.268 1 0.268z"></path>
+        </symbol>
+        <symbol id="svg-icon-irregularSeal1" viewBox="0 0 20 20">
+            <path d="M9.199 11.387l1.801 3.002v-2.237l3.802-0.634-2.321-1.161 2.048-2.731-2.529 0.613v-2.631l-1.908 3.179-2.092-2.79v2h-3l2.731 2.048-1.428 0.952h1.978l-0.435 1.74 1.353-1.353zM6 16l1-4h-4l3-2-4-3h5v-4l3 4 3-5v4.97l4-0.97-3 4 4 2-6 1v5l-3-5-3 3z"></path>
+        </symbol>
+        <symbol id="svg-icon-irregularSeal2" viewBox="0 0 20 20">
+            <path d="M7.030 12.617v2.956l2.968-2.99 1.157 1.157-0.599-2.395 3.827 1.531-1.251-1.876h1.566l-1.5-1 1.5-1h-1.174l1.572-3.929-3.095 1.547v-1.315l-0.658 0.986-1.342-0.671v3l-3.261-1.63 0.691 2.012h-2.474l2.479 1.894-1.648 2.133 1.242-0.41zM2 8h4.030l-1.030-3 4 2v-3l2 1 2-3v3l4-2-2 5h3l-3 2 3 2h-3l2 3-5-2 1 4-3-3-3.97 4v-4l-3.030 1 3.030-3.922-4.030-3.078z"></path>
+        </symbol>
+        <symbol id="svg-icon-leftArrow" viewBox="0 0 20 20">
+            <path d="M11 8v-3l-7.333 5.5 7.333 5.5v-3h6v-5h-6zM12 18l-10-7.5 10-7.5v4h6v7h-6v4z"></path>
+        </symbol>
+        <symbol id="svg-icon-leftArrowCallout" viewBox="0 0 20 20">
+            <path d="M10 12v4h7v-11h-7v4h-4v-1.413l-2.649 2.913 2.649 2.913v-1.413h4zM7 16l-5-5.5 5-5.5v3h2v-4h9v13h-9v-4h-2v3z"></path>
+        </symbol>
+        <symbol id="svg-icon-leftBrace" viewBox="0 0 20 20">
+            <path d="M11.4 3.9c-0.482 0.176-0.891 0.507-1.163 0.942s-0.39 0.948-0.337 1.458v1.6c0.046 0.471-0.054 0.944-0.287 1.355s-0.586 0.741-1.013 0.945c0.427 0.203 0.781 0.533 1.013 0.945s0.333 0.885 0.287 1.355v1.5c0 1.4 0.5 2.2 1.5 2.5l-0.2 0.9c-0.764-0.208-1.457-0.623-2-1.2-0.421-0.655-0.63-1.423-0.6-2.2v-1.5c0-1.2-0.6-1.8-1.6-1.8v-1c1 0 1.6-0.6 1.6-1.8v-1.5c-0.030-0.777 0.179-1.545 0.6-2.2 0.558-0.558 1.245-0.971 2-1.2l0.2 0.9z"></path>
+        </symbol>
+        <symbol id="svg-icon-leftBracket" viewBox="0 0 20 20">
+            <path d="M10.001 16.998c-0.53 0-1.039-0.211-1.414-0.586s-0.586-0.884-0.586-1.414v-8.998c0-0.53 0.211-1.039 0.586-1.414s0.883-0.586 1.414-0.586h1.999v-1h-1.999c-0.398-0.014-0.794 0.054-1.164 0.2s-0.706 0.366-0.988 0.648c-0.281 0.281-0.502 0.618-0.647 0.988s-0.214 0.766-0.2 1.164v8.998c-0.014 0.398 0.054 0.794 0.2 1.164s0.366 0.707 0.647 0.988c0.281 0.281 0.618 0.502 0.988 0.648s0.766 0.214 1.164 0.2h1.999v-1h-1.999z"></path>
+        </symbol>
+        <symbol id="svg-icon-leftRightArrow" viewBox="0 0 20 20">
+            <path d="M13 13v2.149l3.719-4.649-3.719-4.649v2.149h-6v-2.149l-3.719 4.649 3.719 4.649v-2.149h6zM8 18l-6-7.5 6-7.5v4h4v-4l6 7.5-6 7.5v-4h-4v4z"></path>
+        </symbol>
+        <symbol id="svg-icon-leftRightArrowCallout" viewBox="0 0 20 20">
+            <path d="M8 12h-4v0.37l-1.662-1.87 1.662-1.87v0.37h4v-5h4v5h4v-0.37l1.662 1.87-1.662 1.87v-0.37h-4v5h-4v-5zM1 10.5l4 4.5v-2h2v5h6v-5h2v2l4-4.5-4-4.5v2h-2v-5h-6v5h-2v-2l-4 4.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-leftRightUpArrow" viewBox="0 0 20 20">
+            <path d="M10.5 3l3.5 4h-2v5h3v-2l4 3.5-4 3.5v-2h-9v2l-4-3.5 4-3.5v2h3v-5h-2l3.5-4zM11.796 6l-1.296-1.481-1.296 1.481h0.796v7h-5v-0.796l-1.481 1.296 1.481 1.296v-0.796h11v0.796l1.481-1.296-1.481-1.296v0.796h-5v-7h0.796z"></path>
+        </symbol>
+        <symbol id="svg-icon-leftUpArrow" viewBox="0 0 20 20">
+            <path d="M13 12h-6v-1.755l-2.505 2.255 2.505 2.255v-1.755h7v-7h1.755l-2.255-2.505-2.255 2.505h1.755v6zM9 7l4.5-5 4.5 5h-3v7h-7v3l-5-4.5 5-4.5v3h4v-4h-3z"></path>
+        </symbol>
+        <symbol id="svg-icon-lightningBolt" viewBox="0 0 20 20">
+            <path d="M8.933 3.3l2.133 2.8-1.493 0.6 4.053 3.9-0.96 0.4 2.347 4-3.307-1.9 1.28-0.6-5.227-3.2 1.707-0.9-5.227-3.3 4.693-1.8zM9 2l-7 3 5.333 3.3-1.707 0.9 5.227 3.2-1.387 0.6 8.533 5-3.84-6.5 1.173-0.6-3.947-3.8 1.28-0.6-3.667-4.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-line" viewBox="0 0 20 20">
+            <path d="M16.647 17.354l-14-14 0.707-0.707 14 14-0.707 0.707z"></path>
+        </symbol>
+        <symbol id="svg-icon-lineWithArrow" viewBox="0 0 20 20">
+            <path d="M16 15.293v-2.293h1v4h-4v-1h2.293l-12.646-12.646 0.707-0.707 12.646 12.646z"></path>
+        </symbol>
+        <symbol id="svg-icon-lineWithTwoArrows" viewBox="0 0 20 20">
+            <path d="M3 3v4h1v-2.293l11.293 11.293h-2.293v1h4v-4h-1v2.293l-11.293-11.293h2.293v-1h-4zM4 4v0z"></path>
+        </symbol>
+        <symbol id="svg-icon-mathDivide" viewBox="0 0 20 20">
+            <path fill="#444" style="fill: var(--color1, #444)" d="M16 9h-11v2h11v-2zM17 8v4h-13v-4h13z"></path>
+            <path fill="#fff" style="fill: var(--color2, #fff)" d="M10.5 7c0.828 0 1.5-0.672 1.5-1.5s-0.672-1.5-1.5-1.5c-0.828 0-1.5 0.672-1.5 1.5s0.672 1.5 1.5 1.5z"></path>
+            <path fill="#444" style="fill: var(--color1, #444)" d="M10.5 6c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM12 5.5c0 0.828-0.672 1.5-1.5 1.5s-1.5-0.672-1.5-1.5 0.672-1.5 1.5-1.5c0.828 0 1.5 0.672 1.5 1.5z"></path>
+            <path fill="#fff" style="fill: var(--color2, #fff)" d="M10.5 16c0.828 0 1.5-0.672 1.5-1.5s-0.672-1.5-1.5-1.5c-0.828 0-1.5 0.672-1.5 1.5s0.672 1.5 1.5 1.5z"></path>
+            <path fill="#444" style="fill: var(--color1, #444)" d="M10.5 15c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM12 14.5c0 0.828-0.672 1.5-1.5 1.5s-1.5-0.672-1.5-1.5 0.672-1.5 1.5-1.5c0.828 0 1.5 0.672 1.5 1.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-mathEqual" viewBox="0 0 20 20">
+            <path d="M16 6h-12v2h12v-2zM17 5v4h-14v-4h14z"></path>
+            <path d="M16 11h-12v2h12v-2zM17 10v4h-14v-4h14z"></path>
+        </symbol>
+        <symbol id="svg-icon-mathMinus" viewBox="0 0 20 20">
+            <path d="M16 9h-12v2h12v-2zM17 8v4h-14v-4h14z"></path>
+        </symbol>
+        <symbol id="svg-icon-mathMultiply" viewBox="0 0 20 20">
+            <path d="M7.717 9.947l-3.717-3.717 2.23-2.23 3.717 3.717 3.823-3.717 2.23 2.23-3.717 3.717 3.717 3.823-2.23 2.23-3.823-3.717-3.717 3.717-2.23-2.23 3.717-3.823zM5.414 6.23l3.707 3.707-3.717 3.823 0.826 0.826 3.707-3.707 3.823 3.717 0.836-0.836-3.717-3.823 3.707-3.707-0.826-0.826-3.823 3.717-3.707-3.707-0.816 0.816z"></path>
+        </symbol>
+        <symbol id="svg-icon-mathNotEqual" viewBox="0 0 20 20">
+            <path d="M3 17l10-13h4l-10 13h-4zM5.031 16h1.477l8.462-11h-1.477l-8.462 11z"></path>
+            <path d="M8.877 11h-5.877v4h2.8l3.077-4zM7.277 15l3.077-4h6.646v4h-9.723zM6.846 12l-1.538 2h-1.308v-2h2.846zM9.308 14h6.692v-2h-5.154l-1.539 2z"></path>
+            <path d="M12.723 6h-9.723v4h6.646l3.077-4zM11.123 10l3.077-4h2.8v4h-5.877zM10.692 7l-1.538 2h-5.154v-2h6.692zM13.154 9h2.846v-2h-1.308l-1.538 2z"></path>
+        </symbol>
+        <symbol id="svg-icon-mathPlus" viewBox="0 0 20 20">
+            <path d="M12 12v5h-4v-5h-5v-4h5v-5h4v5h5v4h-5zM11 16v-5h5v-2h-5v-5h-2v5h-5v2h5v5h2z"></path>
+        </symbol>
+        <symbol id="svg-icon-moon" viewBox="0 0 20 20">
+            <path d="M15.24 17.68c-0.46 0.133-0.922 0.221-1.381 0.267-4.528 0.448-8.797-3.223-8.859-7.947 0-4.766 4.348-8.399 8.861-7.948 0.459 0.046 0.921 0.134 1.379 0.268-0.384 0.232-0.746 0.493-1.086 0.778-2.011 1.69-3.213 4.245-3.181 6.902-0.032 2.656 1.169 5.21 3.179 6.9 0.34 0.286 0.703 0.547 1.087 0.78zM12.767 16.974c-1.784-1.846-2.822-4.363-2.794-6.974-0.028-2.612 1.011-5.131 2.798-6.977-3.566 0.175-6.767 3.168-6.771 6.971 0.053 3.787 3.207 6.796 6.767 6.98z"></path>
+        </symbol>
+        <symbol id="svg-icon-noSmoking" viewBox="0 0 20 20">
+            <path d="M15.657 4.343c3.124 3.124 3.124 8.19 0 11.314s-8.189 3.124-11.314 0c-3.124-3.124-3.124-8.19 0-11.314s8.19-3.124 11.314 0zM13.864 11.036c0.356-1.335 0.011-2.818-1.036-3.864s-2.53-1.392-3.864-1.036l4.9 4.9zM14.656 11.827c-0.126 0.323-0.288 0.635-0.484 0.931l-6.93-6.93c0.296-0.196 0.608-0.357 0.931-0.484 1.794-0.703 3.913-0.33 5.363 1.12s1.823 3.568 1.12 5.363zM6.136 8.964l4.9 4.901c-1.335 0.356-2.818 0.010-3.864-1.036s-1.392-2.53-1.036-3.864zM5.344 8.173c-0.703 1.794-0.33 3.913 1.12 5.363s3.568 1.823 5.363 1.12c0.323-0.127 0.635-0.288 0.931-0.484l-6.93-6.93c-0.196 0.296-0.357 0.608-0.484 0.931zM14.95 14.95c2.734-2.734 2.734-7.166 0-9.899s-7.166-2.734-9.899 0-2.734 7.166 0 9.899c2.734 2.734 7.166 2.734 9.899 0z"></path>
+        </symbol>
+        <symbol id="svg-icon-notchedRightArrow" viewBox="0 0 20 20">
+            <path d="M11 13.016h-5.832l2.147-2.516-2.147-2.516h5.832v-2.676l5.538 5.192-5.538 5.192v-2.676zM3 14.016h7v3.984l8-7.5-8-7.5v3.984h-7l3 3.516-3 3.516z"></path>
+        </symbol>
+        <symbol id="svg-icon-octagon" viewBox="0 0 20 20">
+            <path fill="none" stroke="#444" style="stroke: var(--color1, #444)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="4" stroke-width="1" d="M7.007 17.5l-4.507-4.507v-5.986l4.507-4.507h5.986l4.507 4.507v5.986l-4.507 4.507h-5.986z"></path>
+            <path d="M8 6v7h4v-7h-4zM11 12h-2v-2h2v2zM11 9h-2v-2h2v2z"></path>
+        </symbol>
+        <symbol id="svg-icon-parallelogram" viewBox="0 0 20 20">
+            <path d="M16.5 6l-4.2 10h-8.8l4.2-10h8.8zM18 5h-11l-5 12h11l5-12z"></path>
+        </symbol>
+        <symbol id="svg-icon-pentagon" viewBox="0 0 20 20">
+            <path d="M10 3.203l6.811 4.561-2.733 8.235h-8.156l-2.733-8.235 6.811-4.561zM18 7.357l-8-5.357-8 5.357 3.2 9.643h9.6l3.2-9.643z"></path>
+        </symbol>
+        <symbol id="svg-icon-pie" viewBox="0 0 20 20">
+            <path d="M10 10h8c0 0.336-0.021 0.669-0.063 1-0.155 1.228-0.593 2.408-1.286 3.445-0.879 1.316-2.128 2.341-3.59 2.946s-3.070 0.764-4.622 0.455c-1.552-0.309-2.977-1.071-4.096-2.189s-1.881-2.544-2.189-4.096c-0.309-1.552-0.15-3.16 0.455-4.622s1.631-2.711 2.946-3.59c1.037-0.693 2.217-1.131 3.445-1.286 0.331-0.042 0.664-0.063 1-0.063v8zM16.928 11h-7.928v-7.928c-1.029 0.149-2.017 0.525-2.889 1.108-1.151 0.769-2.048 1.862-2.578 3.142s-0.668 2.687-0.398 4.044c0.27 1.358 0.937 2.605 1.916 3.584s2.226 1.646 3.584 1.916 2.765 0.132 4.044-0.398c1.279-0.53 2.372-1.427 3.142-2.578 0.582-0.872 0.959-1.86 1.108-2.889z"></path>
+        </symbol>
+        <symbol id="svg-icon-plaque" viewBox="0 0 20 20">
+            <path d="M6.765 17c-0.36-0.956-1.024-1.762-1.559-2.334-0.616-0.659-1.372-1.154-2.206-1.44v-6.451c0.834-0.286 1.591-0.781 2.206-1.44 0.534-0.573 1.198-1.379 1.559-2.334h6.47c0.36 0.956 1.024 1.762 1.559 2.334 0.616 0.659 1.372 1.154 2.206 1.44v6.451c-0.834 0.287-1.591 0.781-2.206 1.44-0.534 0.573-1.198 1.379-1.559 2.334h-6.47zM2 14c0.937 0.157 1.804 0.629 2.475 1.348s1.378 1.648 1.525 2.652h8c0.147-1.004 0.854-1.933 1.525-2.652s1.538-1.191 2.475-1.348v-8c-0.938-0.157-1.804-0.629-2.475-1.348s-1.378-1.647-1.525-2.652h-8c-0.147 1.004-0.854 1.933-1.525 2.652s-1.538 1.191-2.475 1.348v8z"></path>
+        </symbol>
+        <symbol id="svg-icon-plus" viewBox="0 0 20 20">
+            <path d="M13 13v5h-6v-5h-5v-6h5v-5h6v5h5v6h-5zM12 17v-5h5v-4h-5v-5h-4v5h-5v4h5v5h4z"></path>
+        </symbol>
+        <symbol id="svg-icon-polyline1" viewBox="0 0 20 20">
+            <path d="M7.224 4.929c0.155-0.38 0.276-0.966 0.276-1.929h1c0 1.037-0.129 1.764-0.349 2.306-0.226 0.556-0.535 0.883-0.821 1.133-0.084 0.073-0.157 0.134-0.221 0.188-0.17 0.141-0.282 0.235-0.383 0.383-0.115 0.168-0.225 0.436-0.225 0.991 0 0.595 0.073 1.001 0.177 1.249 0.1 0.238 0.194 0.264 0.23 0.27 0.074 0.012 0.258-0.007 0.581-0.23 0.312-0.214 0.69-0.575 1.123-1.104 1.027-1.283 1.981-1.999 2.828-2.244 0.889-0.257 1.647 0.018 2.092 0.643 0.826 1.157 0.423 3.213-1.255 4.332-1.087 0.725-1.63 1.351-1.865 1.845-0.223 0.47-0.178 0.84-0.028 1.14 0.162 0.324 0.468 0.604 0.814 0.808 0.182 0.107 0.354 0.181 0.496 0.227-0.214-0.676-0.29-1.247-0.256-1.722 0.038-0.527 0.212-0.959 0.506-1.264 0.295-0.307 0.678-0.45 1.056-0.45 0.662 0 1.188 0.297 1.516 0.756 0.319 0.446 0.432 1.017 0.354 1.564-0.123 0.857-0.708 1.663-1.735 2.006 0.206 0.423 0.466 0.891 0.789 1.408l-0.848 0.53c-0.401-0.642-0.72-1.23-0.966-1.766-0.036 0.001-0.073 0.001-0.11 0.001-0.373 0-0.868-0.17-1.308-0.428-0.45-0.265-0.926-0.672-1.202-1.223-0.287-0.574-0.336-1.267 0.019-2.016 0.344-0.724 1.051-1.474 2.214-2.249 1.322-0.881 1.419-2.325 0.995-2.918-0.179-0.251-0.484-0.413-1.001-0.263-0.559 0.162-1.354 0.695-2.326 1.91l-0.003 0.004-0-0c-0.466 0.57-0.913 1.008-1.332 1.297-0.408 0.281-0.862 0.467-1.312 0.392-0.488-0.081-0.807-0.437-0.988-0.87-0.177-0.424-0.254-0.981-0.254-1.635 0-0.695 0.14-1.177 0.4-1.556 0.188-0.274 0.442-0.484 0.637-0.645 0.049-0.041 0.094-0.078 0.134-0.113 0.213-0.187 0.405-0.392 0.554-0.757zM12.739 14.904c0.739-0.214 1.072-0.746 1.141-1.224 0.047-0.327-0.027-0.632-0.177-0.842-0.141-0.197-0.365-0.337-0.703-0.337-0.122 0-0.239 0.044-0.335 0.143-0.097 0.101-0.204 0.294-0.229 0.642-0.027 0.379 0.046 0.91 0.303 1.618z"></path>
+        </symbol>
+        <symbol id="svg-icon-polyline2" viewBox="0 0 20 20">
+            <path d="M12.8 6.1c-0.37 0.348-0.628 0.786-0.742 1.264s-0.081 0.975 0.096 1.436c0.564 1.352 2.15 1.283 3.525 1.223 0.272-0.012 0.537-0.023 0.783-0.023 0.135 0.020 0.26 0.079 0.357 0.168s0.16 0.206 0.182 0.332v4c-0.046 0.383-0.231 0.74-0.525 1.013s-0.678 0.444-1.091 0.487h-11.846c-0.135-0.020-0.26-0.079-0.357-0.168s-0.16-0.206-0.181-0.332v-7.3l3.446-3.2h7.323v0.3l-0.969 0.8zM16 11.011c-0.080 0.003-0.162 0.007-0.247 0.011-0.144 0.006-0.297 0.013-0.464 0.019-0.433 0.014-0.924 0.019-1.406-0.039-0.971-0.117-2.114-0.526-2.652-1.815l-0.006-0.013-0.005-0.013c-0.249-0.648-0.296-1.352-0.134-2.027 0.097-0.406 0.266-0.787 0.496-1.131h-4.743l-2.839 2.636v6.364h11.324c0.187-0.028 0.351-0.109 0.471-0.22 0.114-0.106 0.18-0.231 0.205-0.355v-3.414z"></path>
+        </symbol>
+        <symbol id="svg-icon-quadArrow" viewBox="0 0 20 20">
+            <path d="M10.547 1.095l3.513 3.953h-2.013v3h3v-2.013l3.953 3.513-3.953 3.513v-2.013h-3v3h2.013l-3.513 3.953-3.513-3.953h2.013v-3h-3v2.013l-3.953-3.513 3.953-3.513v2.013h3v-3h-2.013l3.513-3.953zM9.261 4.047h0.787v5h-5v-0.787l-1.447 1.287 1.447 1.287v-0.787h5v5h-0.787l1.287 1.447 1.287-1.447h-0.787v-5h5v0.787l1.447-1.287-1.447-1.287v0.787h-5v-5h0.787l-1.287-1.447-1.287 1.447z"></path>
+        </symbol>
+        <symbol id="svg-icon-quadArrowCallout" viewBox="0 0 20 20">
+            <path d="M7 15h2v-2h-2v-2h-2v2l-3-3.5 3-3.5v2h2v-2h2v-2h-2l3.5-3 3.5 3h-2v2h2v2h2v-2l3 3.5-3 3.5v-2h-2v2h-2v2h2l-3.5 3-3.5-3zM10.5 16.683l0.797-0.683h-0.297v-4h2v-2h4v0.297l0.683-0.797-0.683-0.797v0.297h-4v-2h-2v-4h0.297l-0.797-0.683-0.797 0.683h0.297v4h-2v2h-4v-0.297l-0.683 0.797 0.683 0.797v-0.297h4v2h2v4h-0.297l0.797 0.683z"></path>
+        </symbol>
+        <symbol id="svg-icon-rect" viewBox="0 0 20 20">
+            <path d="M17 5v10h-14v-10h14zM18 4h-16v12h16v-12z"></path>
+        </symbol>
+        <symbol id="svg-icon-rect-1" viewBox="0 0 20 20">
+            <path d="M17 5v10h-14v-10h14zM18 4h-16v12h16v-12z"></path>
+        </symbol>
+        <symbol id="svg-icon-ribbon" viewBox="0 0 20 20">
+            <path d="M15.434 9l1.8-3h-3.234v6h3.234l-1.8-3zM13 8h-6v6h6v-6zM19 5l-2.4 4 2.4 4h-5v1c0 0.552-0.448 1-1 1h-6c-0.552 0-1-0.448-1-1v-1h-5l2.4-4-2.4-4h7c0.552 0 1 0.448 1 1v1h2v-1c0-0.552 0.448-1 1-1h7zM2.766 6l1.8 3-1.8 3h3.234v-6h-3.234z"></path>
+        </symbol>
+        <symbol id="svg-icon-ribbon2" viewBox="0 0 20 20">
+            <path d="M13 12v-6h-6v6h6zM6 8h-3.234l1.8 3-1.8 3h3.234v-6zM1 15l2.4-4-2.4-4h5v-1c0-0.552 0.448-1 1-1h6c0.552 0 1 0.448 1 1v1h5l-2.4 4 2.4 4h-7c-0.552 0-1-0.448-1-1v-1h-2v1c0 0.552-0.448 1-1 1h-7zM17.234 14l-1.8-3 1.8-3h-3.234v6h3.234z"></path>
+        </symbol>
+        <symbol id="svg-icon-rightArrow" viewBox="0 0 20 20">
+            <path d="M9 13v3l7.333-5.5-7.333-5.5v3h-6v5h6zM8 3l10 7.5-10 7.5v-4h-6v-7h6v-4z"></path>
+        </symbol>
+        <symbol id="svg-icon-rightArrowCallout" viewBox="0 0 20 20">
+            <path d="M10 9v-4h-7v11h7v-4h4v1.413l2.648-2.913-2.648-2.913v1.413h-4zM13 5l5 5.5-5 5.5v-3h-2v4h-9v-13h9v4h2v-3z"></path>
+        </symbol>
+        <symbol id="svg-icon-rightBrace" viewBox="0 0 20 20">
+            <path d="M8 16.5c0.482-0.176 0.891-0.507 1.163-0.942s0.39-0.948 0.337-1.458v-1.6c-0.046-0.471 0.054-0.944 0.287-1.355s0.586-0.741 1.013-0.945c-0.427-0.203-0.781-0.533-1.013-0.945s-0.333-0.885-0.287-1.355v-1.5c0-1.4-0.5-2.2-1.5-2.5l0.2-0.9c0.764 0.208 1.457 0.623 2 1.2 0.421 0.655 0.63 1.423 0.6 2.2v1.5c0 1.2 0.6 1.8 1.6 1.8v1c-1 0-1.6 0.6-1.6 1.8v1.5c0.030 0.777-0.179 1.545-0.6 2.2-0.558 0.558-1.245 0.971-2 1.2l-0.2-0.9z"></path>
+        </symbol>
+        <symbol id="svg-icon-rightBracket" viewBox="0 0 20 20">
+            <path d="M8.999 3.002h-1.999v1h1.999c0.53 0 1.039 0.211 1.414 0.586s0.586 0.884 0.586 1.414v8.998c0 0.53-0.211 1.039-0.586 1.414s-0.883 0.586-1.414 0.586h-1.999v1h1.999c0.398 0.014 0.794-0.054 1.164-0.2s0.706-0.366 0.988-0.648c0.281-0.281 0.502-0.618 0.648-0.988s0.214-0.766 0.2-1.164v-8.998c0.014-0.398-0.054-0.794-0.2-1.164s-0.366-0.706-0.648-0.988c-0.281-0.281-0.617-0.502-0.988-0.648s-0.766-0.214-1.164-0.2z"></path>
+        </symbol>
+        <symbol id="svg-icon-round1Rect" viewBox="0 0 20 20">
+            <path d="M15 5c1.105 0 2 0.895 2 2v8h-14v-10h12zM2 4v12h16v-9c0-1.657-1.343-3-3-3h-13z"></path>
+        </symbol>
+        <symbol id="svg-icon-round2DiagRect" viewBox="0 0 20 20">
+            <path d="M17 5v8c0 1.105-0.895 2-2 2h-12v-8c0-1.105 0.895-2 2-2h12zM5 4c-1.657 0-3 1.343-3 3v9h13c1.657 0 3-1.343 3-3v-9h-13z"></path>
+        </symbol>
+        <symbol id="svg-icon-round2SameRect" viewBox="0 0 20 20">
+            <path d="M15 5c1.105 0 2 0.895 2 2v8h-14v-8c0-1.105 0.895-2 2-2h10zM5 4c-1.657 0-3 1.343-3 3v9h16v-9c0-1.657-1.343-3-3-3h-10z"></path>
+        </symbol>
+        <symbol id="svg-icon-roundRect" viewBox="0 0 20 20">
+            <path d="M15 5c1.105 0 2 0.895 2 2v6c0 1.105-0.895 2-2 2h-10c-1.105 0-2-0.895-2-2v-6c0-1.105 0.895-2 2-2h10zM5 4c-1.657 0-3 1.343-3 3v6c0 1.657 1.343 3 3 3h10c1.657 0 3-1.343 3-3v-6c0-1.657-1.343-3-3-3h-10z"></path>
+        </symbol>
+        <symbol id="svg-icon-rtTriangle" viewBox="0 0 20 20">
+            <path d="M4 5.4l10.6 10.6h-10.6v-10.6zM3 3v14h14l-14-14z"></path>
+        </symbol>
+        <symbol id="svg-icon-smileyFace" viewBox="0 0 20 20">
+            <path d="M10 16.5c3.59 0 6.5-2.91 6.5-6.5s-2.91-6.5-6.5-6.5c-3.59 0-6.5 2.91-6.5 6.5s2.91 6.5 6.5 6.5zM17.5 10c0 4.142-3.358 7.5-7.5 7.5s-7.5-3.358-7.5-7.5c0-4.142 3.358-7.5 7.5-7.5s7.5 3.358 7.5 7.5z"></path>
+            <path d="M7.5 7c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5zM6 7.5c0-0.828 0.672-1.5 1.5-1.5s1.5 0.672 1.5 1.5c0 0.828-0.672 1.5-1.5 1.5s-1.5-0.672-1.5-1.5z"></path>
+            <path d="M12.5 7c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5zM11 7.5c0-0.828 0.672-1.5 1.5-1.5s1.5 0.672 1.5 1.5c0 0.828-0.672 1.5-1.5 1.5s-1.5-0.672-1.5-1.5z"></path>
+            <path d="M5.416 12c0.772 1.766 2.534 3 4.584 3s3.812-1.234 4.584-3h-1.119c-0.692 1.196-1.984 2-3.465 2s-2.773-0.804-3.465-2h-1.119z"></path>
+        </symbol>
+        <symbol id="svg-icon-snip1Rect" viewBox="0 0 20 20">
+            <path d="M3 5v10h14v-6.586l-3.414-3.414h-10.586zM14 4l4 4v8h-16v-12h12z"></path>
+        </symbol>
+        <symbol id="svg-icon-snip2DiagRect" viewBox="0 0 20 20">
+            <path d="M6.414 15h10.586v-6.586l-3.414-3.414h-10.586v6.586l3.414 3.414zM6 16l-4-4v-8h12l4 4v8h-12z"></path>
+        </symbol>
+        <symbol id="svg-icon-snip2SameRect" viewBox="0 0 20 20">
+            <path d="M6.414 5h7.172l3.414 3.414v6.586h-14v-6.586l3.414-3.414zM14 4h-8l-4 4v8h16v-8l-4-4z"></path>
+        </symbol>
+        <symbol id="svg-icon-snipRoundRect" viewBox="0 0 20 20">
+            <path d="M3 7c0-1.105 0.895-2 2-2h8.586l3.414 3.414v6.586h-14v-8zM14 4h-9c-1.657 0-3 1.343-3 3v9h16v-8l-4-4z"></path>
+        </symbol>
+        <symbol id="svg-icon-spline" viewBox="0 0 20 20">
+            <path d="M2.471 12.168c0-0 0-0-0.471-0.168s-0.471-0.168-0.471-0.168l0.001-0.002 0.002-0.005 0.006-0.016 0.023-0.062c0.020-0.053 0.049-0.131 0.087-0.229 0.076-0.196 0.188-0.475 0.331-0.809 0.286-0.667 0.701-1.561 1.213-2.457 0.51-0.893 1.129-1.811 1.831-2.512 0.692-0.692 1.532-1.24 2.479-1.24 0.776 0 1.418 0.196 1.945 0.562 0.521 0.362 0.895 0.867 1.181 1.43 0.455 0.897 0.728 2.037 0.993 3.148 0.059 0.248 0.118 0.495 0.179 0.738 0.344 1.375 0.746 2.651 1.505 3.588 0.731 0.902 1.832 1.534 3.698 1.534v1c-2.135 0-3.534-0.744-4.474-1.904-0.912-1.126-1.354-2.6-1.698-3.975-0.068-0.272-0.132-0.539-0.195-0.8-0.265-1.104-0.503-2.096-0.899-2.876-0.238-0.468-0.516-0.823-0.86-1.062-0.338-0.235-0.775-0.383-1.374-0.383-0.553 0-1.151 0.327-1.771 0.947-0.611 0.611-1.18 1.443-1.669 2.301-0.488 0.853-0.885 1.71-1.162 2.355-0.138 0.322-0.245 0.59-0.318 0.777-0.036 0.093-0.064 0.166-0.082 0.216l-0.020 0.056-0.005 0.013-0.001 0.004z"></path>
+        </symbol>
+        <symbol id="svg-icon-star4" viewBox="0 0 20 20">
+            <path d="M12.5 7.5l5.5 2-5.5 2-2 5.5-2-5.5-5.5-2 5.5-2 2-5.5 2 5.5zM15.074 9.5l-3.354-1.22-1.22-3.354-1.22 3.354-3.354 1.22 3.354 1.22 1.22 3.354 1.22-3.354 3.354-1.22z"></path>
+        </symbol>
+        <symbol id="svg-icon-star5" viewBox="0 0 20 20">
+            <path d="M12.5 7.997h6l-5 3.503 2 6-5-3.5-5 3.5 2-6-5-3.503h6l2-5.997 2 5.997zM15.33 8.997h-3.551l-1.279-3.836-1.279 3.836h-3.551l3.015 2.112-1.279 3.837 3.094-2.166 3.094 2.166-1.279-3.837 3.015-2.112z"></path>
+        </symbol>
+        <symbol id="svg-icon-star6" viewBox="0 0 20 20">
+            <path d="M8 12h-2.826l2.143-2.5-2.143-2.5h2.826l2.5-3.333 2.5 3.333h2.826l-2.143 2.5 2.143 2.5h-3.38l-2.021 3.233-2.425-3.233zM3 13h4.5l3 4 2.5-4h5l-3-3.5 3-3.5h-4.5l-3-4-3 4h-4.5l3 3.5-3 3.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-star7" viewBox="0 0 20 20">
+            <path d="M10.5 13.321l2.747 1.717-0.337-2.697 3.129-1.173-2.224-1.854 1.169-3.116-3.021 0.378-1.463-2.559-1.463 2.559-3.020-0.378 1.169 3.116-2.224 1.854 3.129 1.173-0.337 2.697 2.747-1.717zM6.5 17l0.5-4-4-1.5 3-2.5-1.5-4 4 0.5 2-3.5 2 3.5 4-0.5-1.5 4 3 2.5-4 1.5 0.5 4-4-2.5-4 2.5z"></path>
+        </symbol>
+        <symbol id="svg-icon-star8" viewBox="0 0 20 20">
+            <path fill="none" stroke="#444" style="stroke: var(--color1, #444)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="4" stroke-width="1" d="M10.5 1.781l2.266 2.719h2.734v2.734l2.719 2.266-2.719 2.266v2.734h-2.734l-2.266 2.719-2.266-2.719h-2.734v-2.734l-2.719-2.266 2.719-2.266v-2.734h2.734l2.266-2.719z"></path>
+            <path d="M9 7v5h3v-5h-3zM11 11h-1v-1h1v1zM11 9h-1v-1h1v1z"></path>
+        </symbol>
+        <symbol id="svg-icon-star10" viewBox="0 0 20 20">
+            <path d="M8.413 14.607l1.587 1.855 1.587-1.855 2.419 0.616 0.189-2.498 2.231-0.76-1.355-1.966 1.355-1.966-2.231-0.76-0.189-2.498-2.419 0.616-1.587-1.855-1.587 1.855-2.42-0.616-0.189 2.498-2.231 0.76 1.355 1.966-1.355 1.966 2.231 0.76 0.189 2.498 2.42-0.616zM5.086 16.487l-0.229-3.027-2.857-0.973 1.714-2.487-1.714-2.486 2.857-0.973 0.229-3.027 2.971 0.757 1.943-2.27 1.943 2.27 2.971-0.757 0.229 3.027 2.857 0.973-1.714 2.486 1.714 2.487-2.857 0.973-0.229 3.027-2.971-0.757-1.943 2.27-1.943-2.27-2.971 0.757z"></path>
+            <path d="M10 8v5h3v-5h-3zM12 12h-1v-3h1v3z"></path>
+            <path d="M8 8v1h-1v1h1v3h1v-5h-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-star12" viewBox="0 0 20 20">
+            <path d="M10.5 1l1.54 2.753 2.71-1.614-0.043 3.154 3.154-0.043-1.614 2.71 2.753 1.54-2.753 1.54 1.614 2.71-3.154-0.043 0.043 3.154-2.71-1.614-1.54 2.753-1.54-2.753-2.71 1.614 0.043-3.154-3.154 0.043 1.614-2.71-2.753-1.54 2.753-1.54-1.614-2.71 3.154 0.043-0.043-3.154 2.71 1.614 1.54-2.753zM13.726 3.913l-2.057 1.225-1.169-2.089-1.169 2.089-2.057-1.225 0.032 2.394-2.394-0.032 1.225 2.057-2.089 1.169 2.089 1.169-1.225 2.057 2.394-0.032-0.032 2.394 2.057-1.225 1.169 2.089 1.169-2.089 2.057 1.225-0.032-2.394 2.394 0.032-1.225-2.057 2.089-1.169-2.089-1.169 1.225-2.057-2.394 0.032 0.032-2.394z"></path>
+            <path d="M8 7v1h-1v1h1v3h1v-5h-1z"></path>
+            <path d="M12.682 7.318c0.183 0.183 0.296 0.424 0.318 0.682v1h-1v-1h-2v-1h2c0.258 0.023 0.499 0.135 0.682 0.318zM11 10v-1h1v1h-1zM11 10v1h2v1h-3v-2h1z"></path>
+        </symbol>
+        <symbol id="svg-icon-star16" viewBox="0 0 20 20">
+            <path d="M12.26 2.932l2.49-0.793 0.558 2.553 2.553 0.558-0.793 2.49 1.932 1.76-1.932 1.76 0.793 2.49-2.553 0.558-0.558 2.553-2.49-0.793-1.76 1.932-1.76-1.932-2.49 0.793-0.558-2.553-2.553-0.558 0.793-2.49-1.932-1.76 1.932-1.76-0.793-2.49 2.553-0.558 0.558-2.553 2.49 0.793 1.76-1.932 1.76 1.932zM14.008 3.425l-2.055 0.654-1.453-1.594-1.453 1.594-2.055-0.654-0.461 2.107-2.107 0.461 0.654 2.055-1.594 1.453 1.594 1.453-0.654 2.055 2.107 0.461 0.461 2.107 2.055-0.654 1.453 1.594 1.452-1.594 2.055 0.654 0.461-2.107 2.107-0.461-0.654-2.055 1.594-1.453-1.594-1.453 0.654-2.055-2.107-0.461-0.461-2.107z"></path>
+            <path d="M8 7v1h-1v1h1v3h1v-5h-1z"></path>
+            <path d="M13 8v-1h-2c-0.258 0.023-0.499 0.135-0.682 0.318s-0.296 0.424-0.318 0.682v4h3v-3h-2v-1h2zM12 10v1h-1v-1h1z"></path>
+        </symbol>
+        <symbol id="svg-icon-star24" viewBox="0 0 20 20">
+            <path d="M12.26 2.932l2.49-0.793 0.558 2.553 2.553 0.558-0.793 2.49 1.932 1.76-1.932 1.76 0.793 2.49-2.553 0.558-0.558 2.553-2.49-0.793-1.76 1.932-1.76-1.932-2.49 0.793-0.558-2.553-2.553-0.558 0.793-2.49-1.932-1.76 1.932-1.76-0.793-2.49 2.553-0.558 0.558-2.553 2.49 0.793 1.76-1.932 1.76 1.932zM14.008 3.425l-2.055 0.654-1.453-1.594-1.453 1.594-2.055-0.654-0.461 2.107-2.107 0.461 0.654 2.055-1.594 1.453 1.594 1.453-0.654 2.055 2.107 0.461 0.461 2.107 2.055-0.654 1.453 1.594 1.452-1.594 2.055 0.654 0.461-2.107 2.107-0.461-0.654-2.055 1.594-1.453-1.594-1.453 0.654-2.055-2.107-0.461-0.461-2.107z"></path>
+            <path d="M9.682 7.318c0.183 0.183 0.295 0.424 0.318 0.682v1h-1v-1h-2v-1h2c0.258 0.023 0.499 0.135 0.682 0.318zM8 10v-1h1v1h-1zM8 10v1h2v1h-3v-2h1z"></path>
+            <path d="M13 7v2h-1v-2h-1v3h2v2h1v-5h-1z"></path>
+        </symbol>
+        <symbol id="svg-icon-star32" viewBox="0 0 20 20">
+            <path d="M12.26 2.932l2.49-0.793 0.558 2.553 2.553 0.558-0.793 2.49 1.932 1.76-1.932 1.76 0.793 2.49-2.553 0.558-0.558 2.553-2.49-0.793-1.76 1.932-1.76-1.932-2.49 0.793-0.558-2.553-2.553-0.558 0.793-2.49-1.932-1.76 1.932-1.76-0.793-2.49 2.553-0.558 0.558-2.553 2.49 0.793 1.76-1.932 1.76 1.932zM14.008 3.425l-2.055 0.654-1.453-1.594-1.453 1.594-2.055-0.654-0.461 2.107-2.107 0.461 0.654 2.055-1.594 1.453 1.594 1.453-0.654 2.055 2.107 0.461 0.461 2.107 2.055-0.654 1.453 1.594 1.452-1.594 2.055 0.654 0.461-2.107 2.107-0.461-0.654-2.055 1.594-1.453-1.594-1.453 0.654-2.055-2.107-0.461-0.461-2.107z"></path>
+            <path d="M13.682 7.318c0.183 0.183 0.296 0.424 0.318 0.682v1h-1v-1h-2v-1h2c0.258 0.023 0.499 0.135 0.682 0.318zM12 10v-1h1v1h-1zM12 10v1h2v1h-3v-2h1z"></path>
+            <path d="M7 7v1h2v1h-2v1h2v1h-2v1h3v-5h-3z"></path>
+        </symbol>
+        <symbol id="svg-icon-stripedRightArrow" viewBox="0 0 20 20">
+            <path d="M11 12v2.692l5.538-5.192-5.538-5.192v2.692h-4v5h4zM10 2l8 7.5-8 7.5v-4h-4v-7h4v-4z"></path>
+            <path d="M5 6h-1v7h1v-7z"></path>
+            <path d="M3 6h-1v7h1v-7z"></path>
+        </symbol>
+        <symbol id="svg-icon-sun" viewBox="0 0 20 20">
+            <path d="M10 6.136c0.764 0 1.511 0.227 2.147 0.651s1.131 1.028 1.423 1.734c0.292 0.706 0.369 1.483 0.22 2.232s-0.517 1.438-1.057 1.978c-0.54 0.54-1.229 0.908-1.978 1.057s-1.526 0.073-2.232-0.22c-0.706-0.292-1.309-0.788-1.734-1.423s-0.651-1.382-0.651-2.147c0-1.025 0.407-2.007 1.132-2.732s1.707-1.132 2.732-1.132zM10 5c-0.989 0-1.956 0.293-2.778 0.843s-1.463 1.33-1.842 2.244c-0.378 0.914-0.477 1.919-0.285 2.889s0.669 1.861 1.368 2.56c0.699 0.699 1.59 1.175 2.56 1.368s1.975 0.094 2.889-0.285c0.914-0.378 1.694-1.019 2.244-1.842s0.843-1.789 0.843-2.778c0-1.326-0.527-2.598-1.464-3.536s-2.209-1.464-3.536-1.464z"></path>
+            <path d="M10 2l-1.5 1.5h3l-1.5-1.5z"></path>
+            <path d="M16.5 3.5h-2l2 2v-2z"></path>
+            <path d="M3.5 3.5v2l2-2h-2z"></path>
+            <path d="M10 18l1.5-1.5h-3l1.5 1.5z"></path>
+            <path d="M18 10l-1.5-1.5v3l1.5-1.5z"></path>
+            <path d="M2 10l1.5 1.5v-3l-1.5 1.5z"></path>
+            <path d="M3.5 16.5h2l-2-2v2z"></path>
+            <path d="M16.5 16.5v-2l-2 2h2z"></path>
+        </symbol>
+        <symbol id="svg-icon-teardrop" viewBox="0 0 20 20">
+            <path d="M10 17.998c-2.113-0.028-4.132-0.879-5.626-2.373s-2.346-3.513-2.374-5.626c0.028-2.113 0.879-4.132 2.374-5.626s3.513-2.346 5.626-2.373h8v8.959c-0.213 1.961-1.152 3.77-2.633 5.073s-3.395 2.004-5.367 1.966zM3 9.999c0.028 1.848 0.774 3.612 2.081 4.919 1.31 1.31 3.080 2.057 4.932 2.081l-0.013 1 0.019-1c1.722 0.033 3.394-0.579 4.687-1.717 1.28-1.126 2.097-2.686 2.293-4.378v-7.903h-6.993c-1.85 0.026-3.618 0.772-4.926 2.081-1.307 1.307-2.053 3.071-2.081 4.919z"></path>
+        </symbol>
+        <symbol id="svg-icon-textRect" viewBox="0 0 20 20">
+            <path d="M17 4v11h-14v-11h14zM18 3h-16v13h16v-13z"></path>
+            <path d="M15 6h-4v1h4v-1z"></path>
+            <path d="M15 9h-4v1h4v-1z"></path>
+            <path d="M15 12h-10v1h10v-1z"></path>
+            <path d="M9.947 10.276l-0.894 0.447-0.362-0.724h-2.382l-0.362 0.724-0.894-0.447 2.447-4.894 2.447 4.894zM8.191 9l-0.691-1.382-0.691 1.382h1.382z"></path>
+        </symbol>
+        <symbol id="svg-icon-trapezoid" viewBox="0 0 20 20">
+            <path d="M13.3 5l3.3 11h-13.2l3.3-11h6.6zM14 4h-8l-4 13h16l-4-13z"></path>
+        </symbol>
+        <symbol id="svg-icon-triangle" viewBox="0 0 20 20">
+            <path d="M10 5l6.187 10h-12.373l6.187-10zM10 3l-8 13h16l-8-13z"></path>
+        </symbol>
+        <symbol id="svg-icon-upArrow" viewBox="0 0 20 20">
+            <path d="M13 11h3l-5.5-7.333-5.5 7.333h3v6h5v-6zM3 12l7.5-10 7.5 10h-4v6h-7v-6h-4z"></path>
+        </symbol>
+        <symbol id="svg-icon-upArrowCallout" viewBox="0 0 20 20">
+            <path d="M9 10h-4v7h11v-7h-4v-4h1.413l-2.913-2.649-2.913 2.649h1.413v4zM5 7l5.5-5 5.5 5h-3v2h4v9h-13v-9h4v-2h-3z"></path>
+        </symbol>
+        <symbol id="svg-icon-upDownArrow" viewBox="0 0 20 20">
+            <path d="M7 13h-2.149l4.649 3.719 4.649-3.719h-2.149v-6h2.149l-4.649-3.719-4.649 3.719h2.149v6zM2 8l7.5-6 7.5 6h-4v4h4l-7.5 6-7.5-6h4v-4h-4z"></path>
+        </symbol>
+        <symbol id="svg-icon-uturnArrow" viewBox="0 0 20 20">
+            <path d="M13 10.4h-2.108l2.608 3.825 2.608-3.825h-2.108v-2.4c0-2.761-2.239-5-5-5s-5 2.239-5 5v9h1v-9c0-2.209 1.791-4 4-4s4 1.791 4 4v2.4zM18 9.4l-4.5 6.6-4.5-6.6h3v-1.4c0-1.657-1.343-3-3-3s-3 1.343-3 3v10h-3v-10c0-3.314 2.686-6 6-6s6 2.686 6 6v1.4h3z"></path>
+        </symbol>
+        <symbol id="svg-icon-verticalScroll" viewBox="0 0 20 20">
+            <path fill="none" stroke="#000" style="stroke: var(--color3, #000)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="4" stroke-width="1" d="M6.5 5.5h9v10.5c0 0.828-0.672 1.5-1.5 1.5h-7.5v-12z"></path>
+            <path fill="none" stroke="#000" style="stroke: var(--color3, #000)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="4" stroke-width="1" d="M6.5 4c0-0.828 0.672-1.5 1.5-1.5h8c0.828 0 1.5 0.672 1.5 1.5s-0.672 1.5-1.5 1.5h-9.5v-1.5z"></path>
+            <path fill="none" stroke="#000" style="stroke: var(--color3, #000)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="4" stroke-width="1" d="M9.5 4c0 0.828-0.672 1.5-1.5 1.5s-1.5-0.672-1.5-1.5c0-0.828 0.672-1.5 1.5-1.5s1.5 0.672 1.5 1.5z"></path>
+            <path fill="none" stroke="#000" style="stroke: var(--color3, #000)" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="4" stroke-width="1" d="M6.5 16c0 0.828-0.672 1.5-1.5 1.5s-1.5-0.672-1.5-1.5c0-0.828 0.672-1.5 1.5-1.5s1.5 0.672 1.5 1.5z"></path>
+            <path fill="#000" style="fill: var(--color3, #000)" d="M5 14h2v1h-2v-1z"></path>
+            <path fill="#000" style="fill: var(--color3, #000)" d="M5 17h2v1h-2v-1z"></path>
+            <path fill="#444" style="fill: var(--color1, #444)" d="M7 4c0 0.552 0.448 1 1 1s1-0.448 1-1c0-0.552-0.448-1-1-1s-1 0.448-1 1zM6 5v-1c0-1.105 0.895-2 2-2h8c1.105 0 2 0.895 2 2s-0.895 2-2 2v10c0 1.105-0.895 2-2 2h-9c-1.105 0-2-0.895-2-2s0.895-2 2-2h1v-9zM5 17c0.552 0 1-0.448 1-1s-0.448-1-1-1c-0.552 0-1 0.448-1 1s0.448 1 1 1zM7 17h7c0.552 0 1-0.448 1-1v-10h-8v11zM10 4c0 0.364-0.097 0.706-0.268 1h6.268c0.552 0 1-0.448 1-1s-0.448-1-1-1h-6.268c0.17 0.294 0.268 0.636 0.268 1z"></path>
+        </symbol>
+        <symbol id="svg-icon-wave" viewBox="0 0 20 20">
+            <path d="M17 12.594v-6.591c-0.321 0.163-0.65 0.301-0.972 0.418-1.029 0.373-2.145 0.579-3.028 0.579-1.45 0-2.503-0.565-3.376-1.033-0.053-0.028-0.105-0.057-0.157-0.084-0.907-0.484-1.724-0.882-2.967-0.882-1.106 0-1.814 0.219-2.338 0.501-0.435 0.235-0.78 0.53-1.162 0.892v6.57c0.953-0.558 2.121-0.963 3.5-0.963 1.736 0 2.915 0.589 3.916 1.090l0.032 0.016c0.992 0.496 1.808 0.894 3.053 0.894 1.391 0 2.068-0.232 2.486-0.482 0.339-0.203 0.542-0.42 0.845-0.743 0.053-0.057 0.109-0.117 0.169-0.18zM18 13c-0.127 0.127-0.246 0.254-0.363 0.379-0.804 0.859-1.518 1.621-4.137 1.621-1.5 0-2.5-0.5-3.5-1s-2-1-3.5-1c-1.418 0-2.585 0.503-3.5 1.152-0.376 0.266-0.709 0.557-1 0.848v-9.033c0.013-0.013 0.027-0.026 0.040-0.039 0.987-0.955 1.993-1.928 4.46-1.928 2 0 2.59 0.547 3.565 1.068 0.89 0.476 1.742 0.932 2.935 0.932 1.123 0 2.805-0.402 4-1.142 0.402-0.249 0.748-0.536 1-0.858v9z"></path>
+        </symbol>
+        <symbol id="svg-icon-wedgeEllipseCallout" viewBox="0 0 20 20">
+            <path d="M8 13.053v1.889l1.954-1.535h0.346c1.453 0 3.185-0.46 4.527-1.339 1.329-0.87 2.172-2.070 2.172-3.569 0-1.16-0.629-2.26-1.799-3.107-1.172-0.848-2.836-1.393-4.701-1.393-1.827 0-3.49 0.627-4.682 1.534-1.213 0.924-1.818 2.036-1.818 2.966 0 1.044 0.388 1.745 1.003 2.363 0.513 0.515 1.13 0.927 1.844 1.404 0.231 0.154 0.471 0.315 0.722 0.488l0.431 0.298zM7 17v-3.422c-0.215-0.149-0.433-0.294-0.651-0.44-1.687-1.126-3.349-2.235-3.349-4.638 0-2.696 3.4-5.5 7.5-5.5s7.5 2.389 7.5 5.5c0 3.871-4.433 5.907-7.7 5.907l-3.3 2.593z"></path>
+        </symbol>
+        <symbol id="svg-icon-wedgeRectCallout" viewBox="0 0 20 20">
+            <path d="M5.468 13l2.032 2.438 2.032-2.438h6.468v-9h-12v9h1.468zM7.5 17l-2.5-3h-2v-11h14v11h-7l-2.5 3z"></path>
+        </symbol>
+        <symbol id="svg-icon-wedgeRoundRectCallout" viewBox="0 0 20 20">
+            <path d="M7.468 13l2.032 2.438 2.032-2.438h2.468c1.105 0 2-0.895 2-2v-5c0-1.105-0.895-2-2-2h-8c-1.105 0-2 0.895-2 2v5c0 1.105 0.895 2 2 2h1.468zM9.5 17l-2.5-3h-1c-1.657 0-3-1.343-3-3v-5c0-1.657 1.343-3 3-3h8c1.657 0 3 1.343 3 3v5c0 1.657-1.343 3-3 3h-2l-2.5 3z"></path>
+        </symbol>
+</svg>

apps/common/main/resources/less/buttons.less

@@ -198,6 +198,10 @@
 
     .btn.small;
 
+    &.bg-white {
+        background-color: #fff;
+    }
+
     &:before,
     &:after {
         content: "";
@@ -404,7 +408,7 @@
 
     &.split {
 
-        &.over,
+        &.over:not(.disabled),
         &.open {
             box-shadow: inset 0 0 0 1px @color-gray;
 
@@ -413,7 +417,7 @@
             }
         }
 
-        &.over {
+        &.over:not(.disabled) {
             button {
                 &:not(.active) {
                     &:hover {

apps/common/main/resources/less/combobox.less

@@ -99,4 +99,11 @@
             display: none;
         }
     }
+
+    .font-item {
+        vertical-align:middle;
+        margin: 0 0 0 -10px;
+        padding-top: 0;
+        padding-bottom: 0;
+    }
 }

apps/common/main/resources/less/dropdown-menu.less

@@ -16,6 +16,15 @@
         }
     }
 
+    &.internal-menu {
+        border: none;
+        border-radius: 0;
+        .box-shadow(none);
+        margin: 0;
+        padding: 0;
+        overflow: hidden;
+    }
+
     li {
         & > a {
             padding: 5px 20px;
@@ -60,47 +69,4 @@
             background-repeat: no-repeat;
         }
     }
-
-    .menu-scroll {
-        position: absolute;
-        background-color: @dropdown-bg;
-        height: 16px;
-        width: 100%;
-        cursor: pointer;
-
-        &.top {
-            top: 0;
-
-            &::before {
-                content: '';
-                position: absolute;
-                left: 48%;
-                top: 7px;
-                border-top: none;
-                border-bottom: 3px solid;
-                border-right: 3px solid transparent;
-                border-left: 3px solid transparent;
-            }
-        }
-
-        &.bottom {
-            bottom: 0;
-
-            &::before {
-                content: '';
-                position: absolute;
-                left: 48%;
-                top: 7px;
-                border-bottom: none;
-                border-top: 3px solid;
-                border-right: 3px solid transparent;
-                border-left: 3px solid transparent;
-            }
-        }
-
-        &.disabled {
-            opacity: 0.3;
-            cursor: default;
-        }
-    }
 }

apps/common/main/resources/less/toolbar.less

@@ -301,7 +301,7 @@
 
 .style-off-tabs {
     .toolbar {
-        @underscore_height: 2px;
+        @underscore_height: 3px;
 
         .tabs, .extra {
             background-color: transparent;
@@ -329,6 +329,7 @@
 
                 &.active {
                     background-color: transparent;
+                    font-weight: bold;
 
                     &:after {
                         opacity: 1;
@@ -343,6 +344,17 @@
 
                 > a {
                     color: @gray-deep;
+
+                    &::after {
+                        display:block;
+                        content:attr(data-title);
+                        font-weight:bold;
+                        height:1px;
+                        color:transparent;
+                        overflow:hidden;
+                        visibility:hidden;
+                        margin-bottom:-1px;
+                    }
                 }
             }
         }
@@ -502,3 +514,64 @@
 .button-normal-icon(~'x-huge .btn-bookmarks', 56, @toolbar-big-icon-size);
 .button-normal-icon(btn-blankpage,         57, @toolbar-big-icon-size);
 .button-normal-icon(btn-print-area,         58, @toolbar-big-icon-size);
+.button-normal-icon(btn-cell-group,         59, @toolbar-big-icon-size);
+.button-normal-icon(btn-cell-ungroup,       60, @toolbar-big-icon-size);
+.button-normal-icon(btn-to-columns,         61, @toolbar-big-icon-size);
+.button-normal-icon(btn-watermark,          63, @toolbar-big-icon-size);
+.button-normal-icon(btn-color-schema,       64, @toolbar-big-icon-size);
+.button-normal-icon(btn-ins-formula,        65, @toolbar-big-icon-size);
+.button-normal-icon(btn-autosumm,           66, @toolbar-big-icon-size);
+.button-normal-icon(btn-recent,             67, @toolbar-big-icon-size);
+.button-normal-icon(btn-finance,            68, @toolbar-big-icon-size);
+.button-normal-icon(btn-logic,              69, @toolbar-big-icon-size);
+.button-normal-icon(btn-func-text,          70, @toolbar-big-icon-size);
+.button-normal-icon(btn-datetime,           71, @toolbar-big-icon-size);
+.button-normal-icon(btn-lookup,             72, @toolbar-big-icon-size);
+.button-normal-icon(btn-func-math,          73, @toolbar-big-icon-size);
+.button-normal-icon(btn-more,               74, @toolbar-big-icon-size);
+.button-normal-icon(btn-pagenum,            75, @toolbar-big-icon-size);
+
+[applang=ru] {
+    .btn-toolbar {
+        &:not(.x-huge) {
+            .icon:not(svg) {
+                &.btn-bold, &.btn-italic, &.btn-strikeout, &.btn-underline, &.btn-ic-docspell, &.btn-sort-down, &.btn-sort-up, &.btn-currency-style {
+                    .background-ximage('@{common-image-path}/controls/toolbar-menu-ru.png', '@{common-image-path}/controls/toolbar-menu-ru@2x.png', 60px);
+                }
+            }
+        }
+    }
+
+    .img-toolbarmenu.btn-ic-docspell {
+        .background-ximage('@{common-image-path}/controls/toolbar-menu-ru.png', '@{common-image-path}/controls/toolbar-menu-ru@2x.png', 60px);
+    }
+
+    .button-normal-icon(btn-notes,            77, @toolbar-big-icon-size);
+    .button-normal-icon(btn-controls,         78, @toolbar-big-icon-size);
+
+    .button-normal-icon(btn-bold,             0, @toolbar-icon-size);
+    .button-normal-icon(btn-italic,           1, @toolbar-icon-size);
+    .button-normal-icon(btn-strikeout,        2, @toolbar-icon-size);
+    .button-normal-icon(btn-underline,        3, @toolbar-icon-size);
+    .button-normal-icon(btn-ic-docspell,      4, @toolbar-icon-size);
+    .button-normal-icon(btn-sort-down,        5, @toolbar-icon-size);
+    .button-normal-icon(btn-sort-up,          6, @toolbar-icon-size);
+    .button-normal-icon(btn-currency-style,   7, @toolbar-icon-size);
+}
+
+
+.item-shape {
+    .icon {
+        width: 20px;
+        height: 20px;
+    }
+
+    svg.icon {
+        display: inline-block;
+        vertical-align: middle;
+        fill: #444444;
+    }
+
+    width: 20px;
+    height: 20px;
+}

apps/common/main/resources/less/window.less

@@ -85,6 +85,12 @@
         &.resizing {
             cursor: inherit !important;
         }
+
+        .title {
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
     }
 
     > .body {

apps/common/mobile/lib/controller/Collaboration.js

@@ -0,0 +1,956 @@
+/*
+ *
+ * (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
+ *
+ *  Created by Julia Svinareva on 12/7/19
+ *  Copyright (c) 2019 Ascensio System SIA. All rights reserved.
+ *
+ */
+
+if (Common === undefined)
+    var Common = {};
+
+Common.Controllers = Common.Controllers || {};
+
+define([
+    'core',
+    'jquery',
+    'underscore',
+    'backbone',
+    'common/mobile/lib/view/Collaboration'
+], function (core, $, _, Backbone) {
+    'use strict';
+
+    Common.Controllers.Collaboration = Backbone.Controller.extend(_.extend((function() {
+        // Private
+        var rootView,
+            _userId,
+            editUsers = [],
+            editor = !!window.DE ? 'DE' : !!window.PE ? 'PE' : 'SSE',
+            displayMode = "markup",
+            canViewReview,
+            arrChangeReview = [],
+            dateChange = [],
+            _fileKey;
+
+
+        return {
+            models: [],
+            collections: [],
+            views: [
+                'Common.Views.Collaboration'
+            ],
+
+            initialize: function() {
+                var me = this;
+                me.addListeners({
+                    'Common.Views.Collaboration': {
+                        'page:show' : me.onPageShow
+                    }
+                });
+                Common.NotificationCenter.on('comments:filterchange',   _.bind(this.onFilterChange, this));
+            },
+
+            setApi: function(api) {
+                this.api = api;
+                this.api.asc_registerCallback('asc_onAuthParticipantsChanged', _.bind(this.onChangeEditUsers, this));
+                this.api.asc_registerCallback('asc_onParticipantsChanged',     _.bind(this.onChangeEditUsers, this));
+                this.api.asc_registerCallback('asc_onAddComment', _.bind(this.onApiAddComment, this));
+                this.api.asc_registerCallback('asc_onAddComments', _.bind(this.onApiAddComments, this));
+                this.api.asc_registerCallback('asc_onChangeCommentData', _.bind(this.onApiChangeCommentData, this));
+                this.api.asc_registerCallback('asc_onRemoveComment', _.bind(this.onApiRemoveComment, this));
+                if (editor === 'DE') {
+                    this.api.asc_registerCallback('asc_onShowRevisionsChange', _.bind(this.changeReview, this));
+                }
+            },
+
+            onLaunch: function () {
+                this.createView('Common.Views.Collaboration').render();
+            },
+
+            setMode: function(mode) {
+                this.appConfig = mode;
+                _userId = mode.user.id;
+                if (editor === 'DE') {
+                    _fileKey = mode.fileKey;
+                }
+                return this;
+            },
+
+
+            showModal: function() {
+                var me = this,
+                    isAndroid = Framework7.prototype.device.android === true,
+                    modalView,
+                    appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE,
+                    mainView = appPrefix.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('Common.Views.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('Common.Views.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
+                });
+
+                if (!Common.SharedSettings.get('phone')) {
+                    this.picker = $$(modalView);
+                    var $overlay = $('.modal-overlay');
+
+                    $$(this.picker).on('opened', function () {
+                        $overlay.on('removeClass', function () {
+                            if (!$overlay.hasClass('modal-overlay-visible')) {
+                                $overlay.addClass('modal-overlay-visible')
+                            }
+                        });
+                    }).on('close', function () {
+                        $overlay.off('removeClass');
+                        $overlay.removeClass('modal-overlay-visible')
+                    });
+                }
+
+                Common.NotificationCenter.trigger('collaborationcontainer:show');
+                this.onPageShow(this.getView('Common.Views.Collaboration'));
+
+                appPrefix.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('#edit-users-view' == pageId) {
+                    me.initEditUsers();
+                    Common.Utils.addScrollIfNeed('.page[data-page=edit-users-view]', '.page[data-page=edit-users-view] .page-content');
+                } else if ('#comments-view' == pageId) {
+                    me.initComments();
+                    Common.Utils.addScrollIfNeed('.page[data-page=comments-view]', '.page[data-page=comments-view] .page-content');
+                } else {
+                    if(editor === 'DE' && !this.appConfig.canReview && !canViewReview) {
+                        $('#reviewing-settings').hide();
+                    }
+                }
+            },
+
+            //Edit users
+
+            onChangeEditUsers: function(users) {
+                editUsers = users;
+            },
+
+            initEditUsers: function() {
+                var usersArray = [];
+                _.each(editUsers, function(item){
+                    var fio = item.asc_getUserName().split(' ');
+                    var initials = fio[0].substring(0, 1).toUpperCase();
+                    if (fio.length > 1) {
+                        initials += fio[fio.length - 1].substring(0, 1).toUpperCase();
+                    }
+                    if(!item.asc_getView()) {
+                        var userAttr = {
+                            color: item.asc_getColor(),
+                            id: item.asc_getId(),
+                            idOriginal: item.asc_getIdOriginal(),
+                            name: item.asc_getUserName(),
+                            view: item.asc_getView(),
+                            initial: initials
+                        };
+                        if(item.asc_getIdOriginal() == _userId) {
+                            usersArray.unshift(userAttr);
+                        } else {
+                            usersArray.push(userAttr);
+                        }
+                    }
+                });
+                var userSort = _.chain(usersArray).groupBy('idOriginal').value();
+                var templateUserItem = _.template([
+                    '<%  _.each(users, function (user) { %>',
+                    '<li id="<%= user[0].id %>" class="<% if (user[0].view) {%> viewmode <% } %> item-content">' +
+                    '<div class="user-name item-inner">' +
+                    '<div class="color" style="background-color: <%= user[0].color %>;"><%= user[0].initial %></div>'+
+                    '<label><%= user[0].name %></label>' +
+                    '<% if (user.length>1) { %><label class="length"> (<%= user.length %>)</label><% } %>' +
+                    '</div>'+
+                    '</li>',
+                    '<% }); %>'].join(''));
+                var templateUserList = _.template(
+                    '<div class="item-content"><div class="item-inner">' +
+                    this.textEditUser +
+                    '</div></div>' +
+                    '<ul>' +
+                    templateUserItem({users: userSort}) +
+                    '</ul>');
+                $('#user-list').html(templateUserList());
+            },
+
+            //Review
+
+            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');
+                }
+                if (!this.appConfig.canReview) {
+                    $('#settings-review').hide();
+                    $('#settings-accept-all').hide();
+                    $('#settings-reject-all').hide();
+                }
+            },
+
+            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);
+                    var prefix = !!window.DE ? 'de' : !!window.PE ? 'pe' : 'sse';
+                    Common.localStorage.setItem(prefix + "-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;
+            },
+
+            setCanViewReview: function(config) {
+                canViewReview = config;
+            },
+
+            onReviewViewClick: function(event) {
+                var value = $(event.currentTarget).val();
+                this.turnDisplayMode(value);
+                !this.appConfig.canReview && Common.localStorage.setItem("de-view-review-mode", value);
+            },
+
+            turnDisplayMode: function(value, suppressEvent) {
+                displayMode = value.toLocaleLowerCase();
+                if (this.api) {
+                    if (displayMode === 'final')
+                        this.api.asc_BeginViewModeInReview(true);
+
+                    else if (displayMode === 'original')
+                        this.api.asc_BeginViewModeInReview(false);
+                    else
+                        this.api.asc_EndViewModeInReview();
+                }
+                !suppressEvent && this.initReviewingSettingsView();
+                DE.getController('Toolbar').setDisplayMode(displayMode);
+            },
+
+
+            initChange: function() {
+                var goto = false;
+                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);
+                    goto = arrChangeReview[0].goto;
+                }
+                if (goto) {
+                    $('#btn-goto-change').show();
+                } else {
+                    $('#btn-goto-change').hide();
+                }
+                $('#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));
+                $('#btn-goto-change').single('click', _.bind(this.onGotoNextChange, this));
+
+                if(this.appConfig.isReviewOnly) {
+                    $('#btn-accept-change').remove();
+                    $('#btn-reject-change').remove();
+                    if(arrChangeReview.length != 0 && arrChangeReview[0].editable) {
+                        $('.accept-reject').html('<div id="btn-delete-change"><i class="icon icon-delete-change"></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');
+                }
+                if (!this.appConfig.canReview) {
+                    $('#btn-accept-change').addClass('disabled');
+                    $('#btn-reject-change').addClass('disabled');
+                }
+            },
+
+            onPrevChange: function() {
+                this.api.asc_GetPrevRevisionsChange();
+            },
+
+            onNextChange: function() {
+                this.api.asc_GetNextRevisionsChange();
+            },
+
+            onAcceptCurrentChange: function() {
+                var me = this;
+                if (this.api) {
+                    this.api.asc_AcceptChanges(dateChange[0]);
+                    setTimeout(function () {
+                        me.api.asc_GetNextRevisionsChange();
+                    }, 10);
+                }
+            },
+
+            onRejectCurrentChange: function() {
+                var me = this;
+                if (this.api) {
+                    this.api.asc_RejectChanges(dateChange[0]);
+                    setTimeout(function () {
+                        me.api.asc_GetNextRevisionsChange();
+                    }, 10);
+                }
+            },
+
+            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').hide();
+                        $('#btn-goto-change').hide();
+                        $('#btn-delete-change').hide();
+                    } else {
+                        $('#current-change').show();
+                        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(),
+                            movetype = item.get_MoveType(),
+                            settings = false;
+                        switch (item.get_Type()) {
+                            case Asc.c_oAscRevisionsChangeType.TextAdd:
+                                changetext = (movetype==Asc.c_oAscRevisionsMove.NoMove) ? me.textInserted : me.textParaMoveTo;
+                                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 = (movetype==Asc.c_oAscRevisionsMove.NoMove) ? me.textDeleted : (item.is_MovedDown() ? me.textParaMoveFromDown : me.textParaMoveFromUp);
+                                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;
+                            case Asc.c_oAscRevisionsChangeType.TablePr:
+                                changetext = me.textTableChanged;
+                                break;
+                            case Asc.c_oAscRevisionsChangeType.RowsAdd:
+                                changetext = me.textTableRowsAdd;
+                                break;
+                            case Asc.c_oAscRevisionsChangeType.RowsRem:
+                                changetext = me.textTableRowsDel;
+                                break;
+
+                        }
+                        var date = (item.get_DateTime() == '') ? new Date() : new Date(item.get_DateTime()),
+                            user = item.get_UserName(),
+                            goto = (item.get_MoveType() == Asc.c_oAscRevisionsMove.MoveTo || item.get_MoveType() == Asc.c_oAscRevisionsMove.MoveFrom);
+                        date = me.dateToLocaleTimeString(date);
+                        var editable = (item.get_UserId() == _userId);
+
+
+                        arr.push({date: date, user: user, changetext: changetext, goto: goto, editable: editable});
+                    });
+                    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]);
+                }
+            },
+
+            onGotoNextChange: function() {
+                if (this.api) {
+                    this.api.asc_FollowRevisionMove(dateChange[0]);
+                }
+            },
+
+            //Comments
+
+            groupCollectionComments: [],
+            collectionComments: [],
+            groupCollectionFilter: [],
+            filter: [],
+
+            initComments: function() {
+                this.getView('Common.Views.Collaboration').renderComments((this.groupCollectionFilter.length !== 0) ? this.groupCollectionFilter : (this.collectionComments.length !== 0) ? this.collectionComments : false);
+                $('.comment-quote').single('click', _.bind(this.onSelectComment, this));
+            },
+
+            readSDKReplies: function (data) {
+                var i = 0,
+                    replies = [],
+                    date = null;
+                var repliesCount = data.asc_getRepliesCount();
+                if (repliesCount) {
+                    for (i = 0; i < repliesCount; ++i) {
+                        date = (data.asc_getReply(i).asc_getOnlyOfficeTime()) ? new Date(this.stringOOToLocalDate(data.asc_getReply(i).asc_getOnlyOfficeTime())) :
+                            ((data.asc_getReply(i).asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getReply(i).asc_getTime())));
+
+                        var user = _.findWhere(editUsers, {idOriginal: data.asc_getReply(i).asc_getUserId()});
+                        replies.push({
+                            userid              : data.asc_getReply(i).asc_getUserId(),
+                            username            : data.asc_getReply(i).asc_getUserName(),
+                            usercolor           : (user) ? user.asc_getColor() : null,
+                            date                : this.dateToLocaleTimeString(date),
+                            reply               : data.asc_getReply(i).asc_getText(),
+                            time                : date.getTime()
+                        });
+                    }
+                }
+                return replies;
+            },
+
+            readSDKComment: function(id, data) {
+                var date = (data.asc_getOnlyOfficeTime()) ? new Date(this.stringOOToLocalDate(data.asc_getOnlyOfficeTime())) :
+                    ((data.asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getTime())));
+                var user = _.findWhere(editUsers, {idOriginal: data.asc_getUserId()}),
+                    groupname = id.substr(0, id.lastIndexOf('_')+1).match(/^(doc|sheet[0-9_]+)_/);
+                var comment = {
+                    uid                 : id,
+                    userid              : data.asc_getUserId(),
+                    username            : data.asc_getUserName(),
+                    usercolor           : (user) ? user.asc_getColor() : null,
+                    date                : this.dateToLocaleTimeString(date),
+                    quote               : data.asc_getQuoteText(),
+                    comment             : data.asc_getText(),
+                    resolved            : data.asc_getSolved(),
+                    unattached          : !_.isUndefined(data.asc_getDocumentFlag) ? data.asc_getDocumentFlag() : false,
+                    time                : date.getTime(),
+                    replys              : [],
+                    groupName           : (groupname && groupname.length>1) ? groupname[1] : null
+                }
+                if (comment) {
+                    var replies = this.readSDKReplies(data);
+                    if (replies.length) {
+                        comment.replys = replies;
+                    }
+                }
+                return comment;
+            },
+
+            onApiChangeCommentData: function(id, data) {
+                var me = this,
+                    i = 0,
+                    date = null,
+                    replies = null,
+                    repliesCount = 0,
+                    dateReply = null,
+                    comment = _.findWhere(me.collectionComments, {uid: id}) || this.findCommentInGroup(id);
+
+                if (comment) {
+
+                    date = (data.asc_getOnlyOfficeTime()) ? new Date(this.stringOOToLocalDate(data.asc_getOnlyOfficeTime())) :
+                        ((data.asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getTime())));
+
+                    var user = _.findWhere(editUsers, {idOriginal: data.asc_getUserId()});
+                    comment.comment = data.asc_getText();
+                    comment.userid = data.asc_getUserId();
+                    comment.username = data.asc_getUserName();
+                    comment.usercolor = (user) ? user.asc_getColor() : null;
+                    comment.resolved = data.asc_getSolved();
+                    comment.quote = data.asc_getQuoteText();
+                    comment.time = date.getTime();
+                    comment.date = me.dateToLocaleTimeString(date);
+
+                    replies = _.clone(comment.replys);
+
+                    replies.length = 0;
+
+                    repliesCount = data.asc_getRepliesCount();
+                    for (i = 0; i < repliesCount; ++i) {
+
+                        dateReply = (data.asc_getReply(i).asc_getOnlyOfficeTime()) ? new Date(this.stringOOToLocalDate(data.asc_getReply(i).asc_getOnlyOfficeTime())) :
+                            ((data.asc_getReply(i).asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getReply(i).asc_getTime())));
+
+                        user = _.findWhere(editUsers, {idOriginal: data.asc_getReply(i).asc_getUserId()});
+                        replies.push({
+                            userid              : data.asc_getReply(i).asc_getUserId(),
+                            username            : data.asc_getReply(i).asc_getUserName(),
+                            usercolor           : (user) ? user.asc_getColor() : null,
+                            date                : me.dateToLocaleTimeString(dateReply),
+                            reply               : data.asc_getReply(i).asc_getText(),
+                            time                : dateReply.getTime()
+                        });
+                    }
+                    comment.replys = replies;
+                    if($('.page-comments').length > 0) {
+                        this.initComments();
+                    }
+                }
+            },
+
+            onApiAddComment: function (id, data) {
+                var comment = this.readSDKComment(id, data);
+                if (comment) {
+                    comment.groupName ? this.addCommentToGroupCollection(comment) : this.collectionComments.push(comment);
+                }
+                if($('.page-comments').length > 0) {
+                    this.initComments();
+                }
+            },
+
+            onApiAddComments: function (data) {
+                for (var i = 0; i < data.length; ++i) {
+                    var comment = this.readSDKComment(data[i].asc_getId(), data[i]);
+                    comment.groupName ? this.addCommentToGroupCollection(comment) : this.collectionComments.push(comment);
+                }
+                if($('.page-comments').length > 0) {
+                    this.initComments();
+                }
+            },
+
+            stringOOToLocalDate: function (date) {
+                if (typeof date === 'string')
+                    return parseInt(date);
+                return 0;
+            },
+
+            addCommentToGroupCollection: function (comment) {
+                var groupname = comment.groupName;
+                if (!this.groupCollectionComments[groupname])
+                    this.groupCollectionComments[groupname] = [];
+                this.groupCollectionComments[groupname].push(comment);
+                if (this.filter.indexOf(groupname) != -1) {
+                    this.groupCollectionFilter.push(comment);
+                }
+            },
+
+            findCommentInGroup: function (id) {
+                for (var name in this.groupCollectionComments) {
+                    var store = this.groupCollectionComments[name],
+                        model = _.findWhere(store, {uid: id});
+                    if (model) return model;
+                }
+            },
+
+            onApiRemoveComment: function (id) {
+                function remove (collection, key) {
+                    if(collection instanceof Array) {
+                        var index = collection.indexOf(key);
+                        if(index != -1) {
+                            collection.splice(index, 1);
+                        }
+                    }
+                }
+                if (this.groupCollectionComments) {
+                    for (var name in this.groupCollectionComments) {
+                        var store = this.groupCollectionComments[name],
+                            comment = _.findWhere(store, {uid: id});
+                        if (comment) {
+                            remove(this.groupCollectionComments[name], comment);
+                            if (this.filter.indexOf(name) != -1) {
+                                remove(this.groupCollectionFilter, comment);
+                            }
+                        }
+                    }
+                }
+                if (this.collectionComments.length > 0) {
+                    var comment = _.findWhere(this.collectionComments, {uid: id});
+                    if (comment) {
+                        remove(this.collectionComments, comment);
+                    }
+                }
+                if($('.page-comments').length > 0) {
+                    this.initComments();
+                }
+            },
+
+            onFilterChange: function (filter) {
+                if (filter) {
+                    var me = this,
+                        comments = [];
+                    this.filter = filter;
+                    filter.forEach(function(item){
+                        if (!me.groupCollectionComments[item])
+                            me.groupCollectionComments[item] = [];
+                        comments = comments.concat(me.groupCollectionComments[item]);
+                    });
+                    this.groupCollectionFilter = comments;
+                }
+            },
+
+            onSelectComment: function (e) {
+                var id = $(e.currentTarget).data('id');
+                this.api.asc_selectComment(id);
+            },
+
+
+            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',
+            textTableChanged: '<b>Table Settings Changed</b>',
+            textTableRowsAdd: '<b>Table Rows Added<b/>',
+            textTableRowsDel: '<b>Table Rows Deleted<b/>',
+            textParaMoveTo: '<b>Moved:</b>',
+            textParaMoveFromUp: '<b>Moved Up:</b>',
+            textParaMoveFromDown: '<b>Moved Down:</b>',
+            textEditUser: 'Document is currently being edited by several users.'
+
+        }
+    })(), Common.Controllers.Collaboration || {}))
+});

apps/common/mobile/lib/controller/Plugins.js

@@ -0,0 +1,310 @@
+/*
+ *
+ * (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
+ *
+ */
+
+/**
+ *  Plugins.js
+ *
+ *  Created by Julia Svinareva on 8/7/19
+ *  Copyright (c) 2019 Ascensio System SIA. All rights reserved.
+ *
+ */
+
+if (Common === undefined)
+    var Common = {};
+
+Common.Controllers = Common.Controllers || {};
+
+define([
+    'core',
+    'jquery',
+    'underscore',
+    'backbone'
+], function (core, $, _, Backbone) {
+    'use strict';
+
+    Common.Controllers.Plugins = Backbone.Controller.extend(_.extend((function() {
+        // Private
+        var modal;
+
+        return {
+            configPlugins: {autostart:[]},// {config: 'from editor config', plugins: 'loaded plugins', UIplugins: 'loaded customization plugins', autostart: 'autostart guids'}
+            serverPlugins: {autostart:[]},
+            models: [],
+            collections: [],
+            views: [
+            ],
+
+            initialize: function() {
+                var me = this;
+            },
+
+            setApi: function(api) {
+                this.api = api;
+                this.api.asc_registerCallback("asc_onPluginShow", _.bind(this.showPluginModal, this));
+                this.api.asc_registerCallback("asc_onPluginClose", _.bind(this.pluginClose, this));
+                this.api.asc_registerCallback("asc_onPluginResize", _.bind(this.pluginResize, this));
+                this.api.asc_registerCallback('asc_onPluginsInit', _.bind(this.registerPlugins, this));
+            },
+
+            onLaunch: function () {
+                Common.Gateway.on('init', this.loadConfig.bind(this));
+            },
+
+            setMode: function(mode) {
+                this.appConfig = mode;
+                this.loadPlugins();
+            },
+
+
+            showPluginModal: function(plugin, variationIndex, frameId, urlAddition) {
+                var me = this,
+                    isAndroid = Framework7.prototype.device.android === true;
+
+                var variation = plugin.get_Variations()[variationIndex];
+                if (variation.get_Visual()) {
+                    var url = variation.get_Url();
+                    url = ((plugin.get_BaseUrl().length == 0) ? url : plugin.get_BaseUrl()) + url;
+                    if (urlAddition)
+                        url += urlAddition;
+                    var isCustomWindow = variation.get_CustomWindow(),
+                        arrBtns = variation.get_Buttons(),
+                        newBtns = [],
+                        size = variation.get_Size(); //size[0] - width, size[1] - height
+                    if (_.isArray(arrBtns)) {
+                        _.each(arrBtns, function(b, index){
+                            if ((me.appConfig.isEdit || b.isViewer !== false))
+                                newBtns[index] = {
+                                    text: b.text,
+                                    attributes: {result: index}
+                                };
+                        });
+                    }
+                    uiApp.closeModal();
+
+                    modal = uiApp.modal({
+                        title: '',
+                        text: '',
+                        afterText:
+                            '<div id="plugin-frame" class="">'+
+                            '</div>',
+                        buttons: isCustomWindow ? undefined : newBtns
+                    });
+                    $('#plugin-frame').html('<div class="preloader"></div>');
+                    me.iframe = document.createElement("iframe");
+                    me.iframe.id           = frameId;
+                    me.iframe.name         = 'pluginFrameEditor';
+                    me.iframe.width        = '100%';
+                    me.iframe.height       = '100%';
+                    me.iframe.align        = "top";
+                    me.iframe.frameBorder  = 0;
+                    me.iframe.scrolling    = "no";
+                    me.iframe.src = url;
+                    setTimeout(function () {
+                        $('#plugin-frame').html(me.iframe);
+                    }, 100);
+                    $$(modal).find('.modal-button').on('click', _.bind(me.onDlgBtnClick, me));
+                    $$(modal).css({
+                        margin: '0',
+                        width: '90%',
+                        left: '5%',
+                        height: 'auto',
+                        top: '20px'
+                    });
+                    $$(modal).find('.modal-inner').css({padding: '0'});
+                    if (Common.SharedSettings.get('phone')) {
+                        var height = Math.min(size[1], 240);
+                        $$(modal).find('#plugin-frame').css({height: height + 'px'});
+                    } else {
+                        var height = Math.min(size[1], 500);
+                        $$(modal).find('#plugin-frame').css({height: height + 'px'});
+                    }
+
+                    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');
+                    }
+                }
+            },
+
+            onDlgBtnClick: function (e) {
+                var index = $(e.currentTarget).index();
+                this.api.asc_pluginButtonClick(index);
+            },
+
+            pluginClose: function (plugin) {
+                if (this.iframe) {
+                    this.iframe = null;
+                }
+            },
+
+            pluginResize: function(size) {
+                if (Common.SharedSettings.get('phone')) {
+                    var height = Math.min(size[1], 240);
+                    $$(modal).find('#plugin-frame').css({height: height + 'px'});
+                } else {
+                    var height = Math.min(size[1], 500);
+                    $$(modal).find('#plugin-frame').css({height: height + 'px'});
+                }
+            },
+
+            loadConfig: function(data) {
+                this.configPlugins.config = data.config.plugins;
+            },
+
+            loadPlugins: function() {
+                var me = this;
+                if (me.configPlugins.config) {
+                    me.getPlugins(me.configPlugins.config.pluginsData)
+                        .then(function(loaded)
+                        {
+                            me.configPlugins.plugins = loaded;
+                            me.mergePlugins();
+                        });
+                } else {
+                    me.configPlugins.plugins = false;
+                }
+                var server_plugins_url = '../../../../plugins.json';
+                Common.Utils.loadConfig(server_plugins_url, function (obj) {
+                    if ( obj != 'error' ) {
+                        me.serverPlugins.config = obj;
+                        me.getPlugins(me.serverPlugins.config.pluginsData)
+                            .then(function(loaded)
+                            {
+                                me.serverPlugins.plugins = loaded;
+                                me.mergePlugins();
+                            });
+                    } else
+                        me.serverPlugins.plugins = false;
+                });
+            },
+
+            mergePlugins: function() {
+                var me = this;
+                if (me.serverPlugins.plugins !== undefined && me.configPlugins.plugins !== undefined) {
+                    var arr = [],
+                        plugins = this.configPlugins;
+                    if (plugins.plugins && plugins.plugins.length>0) {
+                        arr = plugins.plugins;
+                    }
+                    plugins = this.serverPlugins;
+                    if (plugins.plugins && plugins.plugins.length>0) {
+                        arr = arr.concat(plugins.plugins);
+                    }
+                    this.registerPlugins(arr);
+                }
+            },
+
+            registerPlugins: function(plugins) {
+                var me = this;
+                var arr = [];
+                plugins.forEach(function(item){
+                    var plugin = new Asc.CPlugin();
+                    plugin.set_Name(item['name']);
+                    plugin.set_Guid(item['guid']);
+                    plugin.set_BaseUrl(item['baseUrl']);
+
+                    var variations = item['variations'],
+                        variationsArr = [];
+                    variations.forEach(function(itemVar){
+                        var variation = new Asc.CPluginVariation();
+                        variation.set_Description(itemVar['description']);
+                        variation.set_Url(itemVar['url']);
+                        variation.set_Icons(itemVar['icons']);
+                        variation.set_Visual(itemVar['isVisual']);
+                        variation.set_CustomWindow(itemVar['isCustomWindow']);
+                        variation.set_System(itemVar['isSystem']);
+                        variation.set_Viewer(itemVar['isViewer']);
+                        variation.set_EditorsSupport(itemVar['EditorsSupport']);
+                        variation.set_Modal(itemVar['isModal']);
+                        variation.set_InsideMode(itemVar['isInsideMode']);
+                        variation.set_InitDataType(itemVar['initDataType']);
+                        variation.set_InitData(itemVar['initData']);
+                        variation.set_UpdateOleOnResize(itemVar['isUpdateOleOnResize']);
+                        variation.set_Buttons(itemVar['buttons']);
+                        variation.set_Size(itemVar['size']);
+                        variation.set_InitOnSelectionChanged(itemVar['initOnSelectionChanged']);
+                        variation.set_Events(itemVar['events']);
+
+                        variationsArr.push(variation);
+                    });
+
+                    plugin["set_Variations"](variationsArr);
+                    arr.push(plugin);
+                });
+                me.api.asc_pluginsRegister('', arr);
+            },
+
+            getPlugins: function(pluginsData, fetchFunction) {
+                if (!pluginsData || pluginsData.length<1)
+                    return Promise.resolve([]);
+
+                fetchFunction = fetchFunction || function (url) {
+                    return fetch(url)
+                        .then(function(response) {
+                            if ( response.ok ) return response.json();
+                            else return Promise.reject(url);
+                        }).then(function(json) {
+                            json.baseUrl = url.substring(0, url.lastIndexOf("config.json"));
+                            return json;
+                        });
+                };
+
+                var loaded = [];
+                return pluginsData.map(fetchFunction).reduce(function (previousPromise, currentPromise) {
+                    return previousPromise
+                        .then(function()
+                        {
+                            return currentPromise;
+                        })
+                        .then(function(item)
+                        {
+                            loaded.push(item);
+                            return Promise.resolve(item);
+                        })
+                        .catch(function(item)
+                        {
+                            return Promise.resolve(item);
+                        });
+
+                }, Promise.resolve())
+                    .then(function ()
+                    {
+                        return Promise.resolve(loaded);
+                    });
+            },
+
+            textCancel: 'Cancel',
+            textLoading: 'Loading'
+        }
+    })(), Common.Controllers.Plugins || {}))
+});

apps/common/mobile/lib/template/Collaboration.template

@@ -0,0 +1,239 @@
+<!-- Root view -->
+<div id="collaboration-root-view">
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="center sliding"><%= 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="list-edit-users" class="item-link" data-page="#edit-users-view">
+                                <div class="item-content">
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textEditUsers %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                        <li>
+                            <a id="comments-settings" class="item-link" data-page="#comments-view">
+                                <div class="item-content">
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textСomments %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                        <% if (editor === 'DE') { %>
+                        <li>
+                            <a id="reviewing-settings" class="item-link" data-page="#reviewing-settings-view">
+                                <div class="item-content">
+                                    <div class="item-inner">
+                                        <div class="item-title"><%= scope.textReviewing %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                        <% } %>
+                    </ul>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Editable Users view -->
+<div id="edit-users-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.textEditUsers %></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="edit-users-view">
+            <div class="page-content">
+                <div id="user-list" class="list-block">
+                </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-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-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-inner">
+                                        <div class="item-title"><%= scope.textChange %></div>
+                                    </div>
+                                </div>
+                            </a>
+                        </li>
+                        <li>
+                            <div id="settings-accept-all" class="item-content">
+                                <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-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-prev-change"></i></a>
+                <a href="#" id="btn-next-change" class="link icon-only"><i class="icon icon-next-change"></i></a>
+                </span>
+                    <span class="right-buttons">
+                <a href="#" id="btn-goto-change" class="link icon-only" style="display: none;"><i class="icon icon-goto"></i></a>
+                <span class="accept-reject">
+                <a href="#" id="btn-accept-change" class="link icon-only"><i class="icon icon-accept"></i></a>
+                <a href="#" id="btn-reject-change" class="link icon-only"><i class="icon icon-reject"></i></a>
+                </span>
+                </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>
+
+<!-- Comments view -->
+<div id="comments-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.textСomments %></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-comments" data-page="comments-view">
+            <div class="page-content">
+                <div class="list-block">
+                    <ul id="comments-list"></ul>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

apps/common/mobile/lib/view/Collaboration.js

@@ -0,0 +1,215 @@
+/*
+ *
+ * (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
+ *
+ *  Created by Julia Svinareva on 12/7/19
+ *  Copyright (c) 2019 Ascensio System SIA. All rights reserved.
+ *
+ */
+
+if (Common === undefined)
+    var Common = {};
+
+Common.Views = Common.Views || {};
+
+define([
+    'text!common/mobile/lib/template/Collaboration.template',
+    'jquery',
+    'underscore',
+    'backbone'
+], function (settingsTemplate, $, _, Backbone) {
+    'use strict';
+
+    Common.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,
+                    editor  : !!window.DE ? 'DE' : !!window.PE ? 'PE' : 'SSE'
+                }));
+
+                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 me = this;
+                var prefix = !!window.DE ? DE : !!window.PE ? PE : SSE;
+                var rootView = prefix.getController('Common.Controllers.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]);
+                }
+            },
+
+            renderComments: function (comments) {
+                var $pageComments = $('.page-comments .page-content');
+                if (!comments) {
+                    if ($('.comment').length > 0) {
+                        $('.comment').remove();
+                    }
+                    var template = '<div id="no-comments" style="text-align: center; margin-top: 35px;">' + this.textNoComments + '</div>';
+                    $pageComments.append(_.template(template));
+                } else {
+                    if ($('#no-comments').length > 0) {
+                        $('#no-comments').remove();
+                    }
+                    var $listComments = $('#comments-list'),
+                        items = [];
+                    _.each(comments, function (comment) {
+                        var itemTemplate = [
+                            '<li class="comment item-content">',
+                            '<div class="item-inner">',
+                            '<p class="user-name"><%= item.username %></p>',
+                            '<p class="comment-date"><%= item.date %></p>',
+                            '<% if(item.quote) {%>',
+                            '<p class="comment-quote" data-id="<%= item.uid %>"><%= item.quote %></p>',
+                            '<% } %>',
+                            '<p class="comment-text"><%= item.comment %></p>',
+                            '<% if(replys > 0) {%>',
+                            '<ul class="list-reply">',
+                            '<% _.each(item.replys, function (reply) { %>',
+                            '<li class="reply-item">',
+                            '<p class="user-name"><%= reply.username %></p>',
+                            '<p class="reply-date"><%= reply.date %></p>',
+                            '<p class="reply-text"><%= reply.reply %></p>',
+                            '</li>',
+                            '<% }); %>',
+                            '</ul>',
+                            '<% } %>',
+                            '</div>',
+                            '</li>'
+                        ].join('');
+                        items.push(_.template(itemTemplate)({
+                            android: Framework7.prototype.device.android,
+                            item: comment,
+                            replys: comment.replys.length,
+                        }));
+                    });
+                    $listComments.html(items);
+                }
+            },
+
+
+
+            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: 'Review Change',
+            textEditUsers: 'Users',
+            textNoComments: "This document doesn\'t contain comments"
+        }
+    })(), Common.Views.Collaboration || {}))
+});

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

@@ -32,7 +32,7 @@
   }
 
   .logo {
-    background: url('../../../../common/mobile/resources/img/about/onlyoffice.svg') no-repeat center;
+    background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
     margin-top: 20px;
   }
 }

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

@@ -0,0 +1,157 @@
+.page-change {
+  .block-description {
+    background-color: #fff;
+    padding-top: 15px;
+    padding-bottom: 15px;
+    margin: 0;
+    max-width: 100%;
+    word-wrap: break-word;
+  }
+  #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: 20px;
+    margin: 0;
+    margin-top: 10px;
+  }
+  .block-btn, .content-block.block-btn:first-child {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    margin: 26px 0;
+
+    #btn-next-change, #btn-reject-change {
+      margin-left: 20px;
+    }
+    #btn-goto-change {
+      margin-right: 20px;
+    }
+    .right-buttons {
+      display: flex;
+    }
+    .link {
+      display: inline-block;
+    }
+  }
+}
+.navbar .center-collaboration {
+  display: flex;
+  justify-content: space-around;
+}
+.container-collaboration {
+  .navbar .right.close-collaboration {
+    position: absolute;
+    right: 10px;
+  }
+  .page-content .list-block:first-child {
+    margin-top: -1px;
+  }
+}
+
+//Edit users
+@initialEditUser: #373737;
+
+#user-list {
+  .item-content {
+    padding-left: 0;
+  }
+  .item-inner {
+    justify-content: flex-start;
+    padding-left: 15px;
+  }
+  .length {
+    margin-left: 4px;
+  }
+  .color {
+    min-width: 40px;
+    min-height: 40px;
+    margin-right: 20px;
+    text-align: center;
+    border-radius: 50px;
+    line-height: 40px;
+    color: @initialEditUser;
+    font-weight: 500;
+
+  }
+  ul:before {
+    content: none;
+  }
+}
+
+//Comments
+.page-comments {
+  .list-block .item-inner {
+    display: block;
+    padding: 16px 0;
+    word-wrap: break-word;
+  }
+  p {
+    margin: 0;
+  }
+  .user-name {
+    font-size: 17px;
+    line-height: 22px;
+    color: #000000;
+    margin: 0;
+    font-weight: bold;
+  }
+  .comment-date, .reply-date {
+    font-size: 12px;
+    line-height: 18px;
+    color: #6d6d72;
+    margin: 0;
+    margin-top: 0px;
+  }
+  .comment-text, .reply-text {
+    color: #000000;
+    font-size: 15px;
+    line-height: 25px;
+    margin: 0;
+    max-width: 100%;
+    padding-right: 15px;
+  }
+  .reply-item {
+    margin-top: 15px;
+    .user-name {
+      padding-top: 16px;
+    }
+    &:before {
+      content: '';
+      position: absolute;
+      left: auto;
+      bottom: 0;
+      right: auto;
+      top: 0;
+      height: 1px;
+      width: 100%;
+      background-color: @listBlockBorderColor;
+      display: block;
+      z-index: 15;
+      -webkit-transform-origin: 50% 100%;
+      transform-origin: 50% 100%;
+    }
+  }
+  .comment-quote {
+    color: @themeColor;
+    border-left: 1px solid @themeColor;
+    padding-left: 10px;
+    margin: 5px 0;
+    font-size: 15px;
+  }
+}
+.settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after {
+  display: none;
+}

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/ios/_container.less

@@ -1,6 +1,8 @@
 // Container
 .phone.ios {
-  .container-edit {
+  .container-edit,
+  .container-collaboration,
+  .container-filter {
     .navbar {
       .hairline(top, @toolbarBorderColor);
     }
@@ -15,7 +17,9 @@
 
 .container-edit,
 .container-add,
-.container-settings {
+.container-settings,
+.container-collaboration,
+.container-filter {
   &.popover {
     width: 360px;
   }

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

@@ -33,6 +33,6 @@
   }
 
   .logo {
-    background: url('../../../../common/mobile/resources/img/about/onlyoffice.svg') no-repeat center;
+    background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
   }
 }

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

@@ -0,0 +1,156 @@
+.page-change {
+  .block-description {
+    background-color: #fff;
+    padding-top: 15px;
+    padding-bottom: 15px;
+    margin: 0;
+    max-width: 100%;
+    word-wrap: break-word;
+  }
+  #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: 20px;
+    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;
+    }
+    #btn-goto-change {
+      margin-right: 20px;
+    }
+    .right-buttons {
+      display: flex;
+    }
+    .link {
+      display: inline-block;
+    }
+  }
+}
+.container-collaboration {
+  .navbar .right.close-collaboration {
+    position: absolute;
+    right: 5px;
+  }
+  .page-content .list-block:first-child {
+    margin-top: -1px;
+  }
+}
+
+
+//Edit users
+@initialEditUser: #373737;
+
+#user-list {
+  .item-content {
+    padding-left: 0;
+  }
+  .item-inner {
+    justify-content: flex-start;
+    padding-left: 15px;
+  }
+  .length {
+    margin-left: 4px;
+  }
+  .color {
+    min-width: 40px;
+    min-height: 40px;
+    margin-right: 20px;
+    text-align: center;
+    border-radius: 50px;
+    line-height: 40px;
+    color: @initialEditUser;
+    font-weight: 400;
+  }
+  ul:before {
+    content: none;
+  }
+}
+
+
+//Comments
+.page-comments {
+  .list-block .item-inner {
+    display: block;
+    padding: 16px 0;
+    word-wrap: break-word;
+  }
+  p {
+    margin: 0;
+  }
+  .user-name {
+    font-size: 17px;
+    line-height: 22px;
+    color: #000000;
+    margin: 0;
+    font-weight: bold;
+  }
+  .comment-date, .reply-date {
+    font-size: 12px;
+    line-height: 18px;
+    color: #6d6d72;
+    margin: 0;
+    margin-top: 0px;
+  }
+  .comment-text, .reply-text {
+    color: #000000;
+    font-size: 15px;
+    line-height: 25px;
+    margin: 0;
+    max-width: 100%;
+    padding-right: 15px;
+  }
+  .reply-item {
+    margin-top: 15px;
+    .user-name {
+      padding-top: 16px;
+    }
+    &:before {
+      content: '';
+      position: absolute;
+      left: auto;
+      bottom: 0;
+      right: auto;
+      top: 0;
+      height: 1px;
+      width: 100%;
+      background-color: @listBlockBorderColor;
+      display: block;
+      z-index: 15;
+      -webkit-transform-origin: 50% 100%;
+      transform-origin: 50% 100%;
+    }
+  }
+  .comment-quote {
+    color: @themeColor;
+    border-left: 1px solid @themeColor;
+    padding-left: 10px;
+    margin: 5px 0;
+    font-size: 15px;
+  }
+}
+.settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after {
+  display: none;
+}

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/common/mobile/resources/less/material/_container.less

@@ -1,7 +1,9 @@
 // Container
 
 .phone.android {
-  .container-edit {
+  .container-edit,
+  .container-collaboration,
+  .container-filter {
 
     .page-content {
       .list-block:first-child {
@@ -13,7 +15,9 @@
 
 .container-edit,
 .container-add,
-.container-settings {
+.container-settings,
+.container-collaboration,
+.container-filter {
   &.popover {
     width: 360px;
   }

apps/documenteditor/embed/index.html

@@ -164,7 +164,7 @@
              15%    { background: #f4f4f4; top:0; opacity:1; }
              20%    { background: #f4f4f4; top:0; opacity:0; }
              25%    { background: #f4f4f4; top:0; opacity:0; }
-             45%    { background: #EFEFEF; top:0; opacity:0,2; }
+             45%    { background: #EFEFEF; top:0; opacity:0.2; }
             100%    { top:100px; background: #55bce6; }
         }
 
@@ -175,7 +175,7 @@
              15%    { background: #f4f4f4; top:0; opacity:1; }
              20%    { background: #f4f4f4; top:0; opacity:0; }
              25%    { background: #fff; top:0; opacity:0; }
-             45%    { background: #EFEFEF; top:0; opacity:0,2; }
+             45%    { background: #EFEFEF; top:0; opacity:0.2; }
             100%    { top:100px; background: #55bce6; }
         }
 
@@ -249,6 +249,18 @@
            else if ( lang == 'ru') loading = 'Загрузка...';
            else if ( lang == 'sl') loading = 'Nalaganje...';
            else if ( lang == 'tr') loading = 'Yükleniyor...';
+           else if ( lang == 'bg') loading = 'Зареждане...';
+           else if ( lang == 'cs') loading = 'Nahrávám...';
+           else if ( lang == 'hu') loading = 'Betöltés...';
+           else if ( lang == 'ja') loading = '読み込み中...';
+           else if ( lang == 'ko') loading = '로드 중...';
+           else if ( lang == 'lv') loading = 'Ieladēšana ...';
+           else if ( lang == 'nl') loading = 'Laden...';
+           else if ( lang == 'pl') loading = 'Ładowanie...';
+           else if ( lang == 'sk') loading = 'Nahrávam...';
+           else if ( lang == 'uk') loading = 'Завантаження...';
+           else if ( lang == 'vi') loading = 'Đang tải...';
+           else if ( lang == 'zh') loading = '加载中...';
 
             document.write(
                 '<div id="loading-mask" class="loadmask">' +
@@ -330,6 +342,7 @@
       </script>
 
       <!--application-->
+      <script type="text/javascript" src="../../common/locale.js"></script>
       <script type="text/javascript" src="../../common/Gateway.js"></script>
       <script type="text/javascript" src="../../common/Analytics.js"></script>
       <script type="text/javascript" src="../../common/embed/lib/util/utils.js"></script>

apps/documenteditor/embed/index.html.deploy

@@ -162,7 +162,7 @@
              15%    { background: #f4f4f4; top:0; opacity:1; }
              20%    { background: #f4f4f4; top:0; opacity:0; }
              25%    { background: #f4f4f4; top:0; opacity:0; }
-             45%    { background: #EFEFEF; top:0; opacity:0,2; }
+             45%    { background: #EFEFEF; top:0; opacity:0.2; }
             100%    { top:100px; background: #55bce6; }
         }
 
@@ -173,7 +173,7 @@
              15%    { background: #f4f4f4; top:0; opacity:1; }
              20%    { background: #f4f4f4; top:0; opacity:0; }
              25%    { background: #fff; top:0; opacity:0; }
-             45%    { background: #EFEFEF; top:0; opacity:0,2; }
+             45%    { background: #EFEFEF; top:0; opacity:0.2; }
             100%    { top:100px; background: #55bce6; }
         }
     </style>
@@ -241,6 +241,18 @@
             else if ( lang == 'ru') loading = 'Загрузка...';
             else if ( lang == 'sl') loading = 'Nalaganje...';
             else if ( lang == 'tr') loading = 'Yükleniyor...';
+            else if ( lang == 'bg') loading = 'Зареждане...';
+            else if ( lang == 'cs') loading = 'Nahrávám...';
+            else if ( lang == 'hu') loading = 'Betöltés...';
+            else if ( lang == 'ja') loading = '読み込み中...';
+            else if ( lang == 'ko') loading = '로드 중...';
+            else if ( lang == 'lv') loading = 'Ieladēšana ...';
+            else if ( lang == 'nl') loading = 'Laden...';
+            else if ( lang == 'pl') loading = 'Ładowanie...';
+            else if ( lang == 'sk') loading = 'Nahrávam...';
+            else if ( lang == 'uk') loading = 'Завантаження...';
+            else if ( lang == 'vi') loading = 'Đang tải...';
+            else if ( lang == 'zh') loading = '加载中...';
 
             document.write(
                 '<div id="loading-mask" class="loadmask">' +

apps/documenteditor/embed/js/ApplicationController.js

@@ -30,7 +30,7 @@
  * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
  *
 */
-var ApplicationController = new(function(){
+DE.ApplicationController = new(function(){
     var me,
         api,
         config = {},
@@ -51,7 +51,7 @@ var ApplicationController = new(function(){
     // -------------------------
 
     if (typeof isBrowserSupported !== 'undefined' && !isBrowserSupported()){
-        Common.Gateway.reportError(undefined, 'Your browser is not supported.');
+        Common.Gateway.reportError(undefined, this.unsupportedBrowserErrorText);
         return;
     }
 
@@ -122,7 +122,7 @@ var ApplicationController = new(function(){
 
     function onCountPages(count) {
         maxPages = count;
-        $('#pages').text('of ' + count);
+        $('#pages').text(me.textOf + " " + count);
     }
 
     function onCurrentPage(number) {
@@ -134,10 +134,10 @@ var ApplicationController = new(function(){
         switch (id)
         {
             case Asc.c_oAscAsyncAction['Print']:
-                text = 'Downloading document...';
+                text = me.downloadTextText;
                 break;
             default:
-                text = 'Please wait...';
+                text = me.waitText;
                 break;
         }
 
@@ -204,11 +204,11 @@ var ApplicationController = new(function(){
 
     function onPrint() {
         if ( permissions.print!==false )
-            api.asc_Print($.browser.chrome || $.browser.safari || $.browser.opera);
+            api.asc_Print(new Asc.asc_CDownloadOptions(null, $.browser.chrome || $.browser.safari || $.browser.opera));
     }
 
     function onPrintUrl(url) {
-        common.utils.dialogPrint(url);
+        common.utils.dialogPrint(url, api);
     }
 
     function hidePreloader() {
@@ -248,18 +248,18 @@ var ApplicationController = new(function(){
         Common.Gateway.on('processmouse',       onProcessMouse);
         Common.Gateway.on('downloadas',         onDownloadAs);
 
-        ApplicationView.tools.get('#idt-fullscreen')
+        DE.ApplicationView.tools.get('#idt-fullscreen')
             .on('click', function(){
                 common.utils.openLink(embedConfig.fullscreenUrl);
             });
 
-        ApplicationView.tools.get('#idt-download')
+        DE.ApplicationView.tools.get('#idt-download')
             .on('click', function(){
                     if ( !!embedConfig.saveUrl ){
                         common.utils.openLink(embedConfig.saveUrl);
                     } else
                     if (api && permissions.print!==false){
-                        api.asc_Print($.browser.chrome || $.browser.safari || $.browser.opera);
+                        api.asc_Print(new Asc.asc_CDownloadOptions(null, $.browser.chrome || $.browser.safari || $.browser.opera));
                     }
 
                     Common.Analytics.trackEvent('Save');
@@ -354,14 +354,14 @@ var ApplicationController = new(function(){
 
     function onOpenDocument(progress) {
         var proc = (progress.asc_getCurrentFont() + progress.asc_getCurrentImage())/(progress.asc_getFontsCount() + progress.asc_getImagesCount());
-        $('#loadmask-text').html('Loading document: ' + Math.min(Math.round(proc * 100), 100) + '%');
+        $('#loadmask-text').html(me.textLoadingDocument + ': ' + Math.min(Math.round(proc * 100), 100) + '%');
     }
 
     function onError(id, level, errData) {
         if (id == Asc.c_oAscError.ID.LoadingScriptError) {
             $('#id-critical-error-title').text(me.criticalErrorTitle);
             $('#id-critical-error-message').text(me.scriptLoadError);
-            $('#id-critical-error-close').off().on('click', function(){
+            $('#id-critical-error-close').text(me.txtClose).off().on('click', function(){
                 window.location.reload();
             });
             $('#id-critical-error-dialog').css('z-index', 20002).modal('show');
@@ -410,8 +410,7 @@ var ApplicationController = new(function(){
 
             $('#id-critical-error-title').text(me.criticalErrorTitle);
             $('#id-critical-error-message').text(message);
-            $('#id-critical-error-close').off();
+            $('#id-critical-error-close').text(me.txtClose).off().on('click', function(){
-            $('#id-critical-error-close').on('click', function(){
                 window.location.reload();
             });
         }
@@ -420,8 +419,7 @@ var ApplicationController = new(function(){
 
             $('#id-critical-error-title').text(me.notcriticalErrorTitle);
             $('#id-critical-error-message').text(message);
-            $('#id-critical-error-close').off();
+            $('#id-critical-error-close').text(me.txtClose).off().on('click', function(){
-            $('#id-critical-error-close').on('click', function(){
                 $('#id-critical-error-dialog').modal('hide');
             });
         }
@@ -434,7 +432,7 @@ var ApplicationController = new(function(){
     function onExternalMessage(error) {
         if (error) {
             hidePreloader();
-            $('#id-error-mask-title').text('Error');
+            $('#id-error-mask-title').text(me.criticalErrorTitle);
             $('#id-error-mask-text').text(error.msg);
             $('#id-error-mask').css('display', 'block');
 
@@ -460,7 +458,7 @@ var ApplicationController = new(function(){
             Common.Gateway.reportError(Asc.c_oAscError.ID.AccessDeny, me.errorAccessDeny);
             return;
         }
-        if (api) api.asc_DownloadAs(Asc.c_oAscFileType.DOCX, true);
+        if (api) api.asc_DownloadAs(new Asc.asc_CDownloadOptions(Asc.c_oAscFileType.DOCX, true));
     }
 
     // Helpers
@@ -541,14 +539,20 @@ var ApplicationController = new(function(){
         create                  : createController,
         errorDefaultMessage     : 'Error code: %1',
         unknownErrorText        : 'Unknown error.',
-        convertationTimeoutText : 'Convertation timeout exceeded.',
+        convertationTimeoutText : 'Conversion timeout exceeded.',
-        convertationErrorText   : 'Convertation failed.',
+        convertationErrorText   : 'Conversion failed.',
         downloadErrorText       : 'Download failed.',
         criticalErrorTitle      : 'Error',
         notcriticalErrorTitle   : 'Warning',
         scriptLoadError: 'The connection is too slow, some of the components could not be loaded. Please reload the page.',
         errorFilePassProtect: 'The file is password protected and cannot be opened.',
         errorAccessDeny: 'You are trying to perform an action you do not have rights for.<br>Please contact your Document Server administrator.',
-        errorUserDrop: 'The file cannot be accessed right now.'
+        errorUserDrop: 'The file cannot be accessed right now.',
+        unsupportedBrowserErrorText: 'Your browser is not supported.',
+        textOf: 'of',
+        downloadTextText: 'Downloading document...',
+        waitText: 'Please, wait...',
+        textLoadingDocument: 'Loading document',
+        txtClose: 'Close'
     }
 })();

apps/documenteditor/embed/js/ApplicationView.js

@@ -30,7 +30,11 @@
  * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
  *
 */
-var ApplicationView = new(function(){
+if (DE === undefined) {
+    var DE = {};
+}
+
+DE.ApplicationView = new(function(){
     var $btnTools;
 
     // Initialize view
@@ -41,10 +45,10 @@ var ApplicationView = new(function(){
         $btnTools.addClass('dropdown-toggle').attr('data-toggle', 'dropdown').attr('aria-expanded', 'true');
         $btnTools.parent().append(
             '<ul class="dropdown-menu">' +
-                '<li><a id="idt-download"><span class="mi-icon svg-icon download"></span>Download</a></li>' +
+                '<li><a id="idt-download"><span class="mi-icon svg-icon download"></span>' + this.txtDownload + '</a></li>' +
-                '<li><a id="idt-share" data-toggle="modal"><span class="mi-icon svg-icon share"></span>Share</a></li>' +
+                '<li><a id="idt-share" data-toggle="modal"><span class="mi-icon svg-icon share"></span>' + this.txtShare + '</a></li>' +
-                '<li><a id="idt-embed" data-toggle="modal"><span class="mi-icon svg-icon embed"></span>Embed</a></li>' +
+                '<li><a id="idt-embed" data-toggle="modal"><span class="mi-icon svg-icon embed"></span>' + this.txtEmbed + '</a></li>' +
-                '<li><a id="idt-fullscreen"><span class="mi-icon svg-icon fullscr"></span>Full Screen</a></li>' +
+                '<li><a id="idt-fullscreen"><span class="mi-icon svg-icon fullscr"></span>' + this.txtFullScreen + '</a></li>' +
             '</ul>');
     }
 
@@ -56,6 +60,11 @@ var ApplicationView = new(function(){
         create: createView
         , tools: {
             get: getTools
-        }
+        },
+
+        txtDownload: 'Download',
+        txtShare: 'Share',
+        txtEmbed: 'Embed',
+        txtFullScreen: 'Full Screen'
     }
 })();

apps/documenteditor/embed/js/application.js

@@ -31,6 +31,7 @@
  *
 */
 +function ($) {
-    ApplicationView.create();
+    Common.Locale.apply();
-    ApplicationController.create();
+    DE.ApplicationView.create();
+    DE.ApplicationController.create();
 }();

apps/documenteditor/embed/locale/bg.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "Копиране в клипборда",
+  "common.view.modals.txtEmbed": "Вграждане",
+  "common.view.modals.txtHeight": "Височина",
+  "common.view.modals.txtShare": "Споделяне на връзка",
+  "common.view.modals.txtWidth": "Широчина",
+  "DE.ApplicationController.convertationErrorText": "Конвертирането е неуспешно.",
+  "DE.ApplicationController.convertationTimeoutText": "Превишава се времето на изтичане на реализациите.",
+  "DE.ApplicationController.criticalErrorTitle": "Грешка",
+  "DE.ApplicationController.downloadErrorText": "Изтеглянето се провали.",
+  "DE.ApplicationController.downloadTextText": "Документът се изтегли ...",
+  "DE.ApplicationController.errorAccessDeny": "Опитвате се да извършите действие, за което нямате права. <br> Моля, свържете се с администратора на сървъра за документи.",
+  "DE.ApplicationController.errorDefaultMessage": "Код на грешка: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Файлът е защитен с парола и не може да бъде отворен.",
+  "DE.ApplicationController.errorUserDrop": "Файлът не може да бъде достъпен в момента.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Внимание",
+  "DE.ApplicationController.scriptLoadError": "Връзката е твърде бавна, някои от компонентите не могат да бъдат заредени. Моля, презаредете страницата.",
+  "DE.ApplicationController.textLoadingDocument": "Зареждане на документ",
+  "DE.ApplicationController.textOf": "на",
+  "DE.ApplicationController.txtClose": "Затвори",
+  "DE.ApplicationController.unknownErrorText": "Неизвестна грешка.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Вашият браузър не се поддържа.",
+  "DE.ApplicationController.waitText": "Моля изчакай...",
+  "DE.ApplicationView.txtDownload": "Изтегли",
+  "DE.ApplicationView.txtEmbed": "Вграждане",
+  "DE.ApplicationView.txtFullScreen": "Цял екран",
+  "DE.ApplicationView.txtShare": "Дял"
+}

apps/documenteditor/embed/locale/cs.json

@@ -0,0 +1,24 @@
+{
+  "common.view.modals.txtCopy": "Zkopírovat do schránky",
+  "common.view.modals.txtHeight": "Výška",
+  "common.view.modals.txtWidth": "Šířka",
+  "DE.ApplicationController.convertationErrorText": "Konverze selhala.",
+  "DE.ApplicationController.convertationTimeoutText": "Vypršel čas konverze.",
+  "DE.ApplicationController.criticalErrorTitle": "Chyba",
+  "DE.ApplicationController.downloadErrorText": "Stahování selhalo.",
+  "DE.ApplicationController.downloadTextText": "Stahování dokumentu...",
+  "DE.ApplicationController.errorAccessDeny": "Pokoušíte se provést akci, na kterou nemáte oprávnění.<br>Prosím, kontaktujte administrátora vašeho Dokumentového serveru.",
+  "DE.ApplicationController.errorDefaultMessage": "Kód chyby: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Dokument je chráněn heslem a nelze otevřít.",
+  "DE.ApplicationController.errorUserDrop": "Tento soubor není nyní přístupný.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Varování",
+  "DE.ApplicationController.textLoadingDocument": "Načítání dokumentu",
+  "DE.ApplicationController.textOf": "z",
+  "DE.ApplicationController.txtClose": "Zavřít",
+  "DE.ApplicationController.unknownErrorText": "Neznámá chyba.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Váš prohlížeč není podporován.",
+  "DE.ApplicationController.waitText": "Prosím, čekejte...",
+  "DE.ApplicationView.txtDownload": "Stáhnout",
+  "DE.ApplicationView.txtFullScreen": "Celá obrazovka",
+  "DE.ApplicationView.txtShare": "Sdílet"
+}

apps/documenteditor/embed/locale/de.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "In die Zwischenablage kopieren",
+  "common.view.modals.txtEmbed": "Einbetten",
+  "common.view.modals.txtHeight": "Höhe",
+  "common.view.modals.txtShare": "Link teilen",
+  "common.view.modals.txtWidth": "Breite",
+  "DE.ApplicationController.convertationErrorText": "Konvertierung ist fehlgeschlagen.",
+  "DE.ApplicationController.convertationTimeoutText": "Timeout für die Konvertierung wurde überschritten.",
+  "DE.ApplicationController.criticalErrorTitle": "Fehler",
+  "DE.ApplicationController.downloadErrorText": "Herunterladen ist fehlgeschlagen.",
+  "DE.ApplicationController.downloadTextText": "Dokument wird heruntergeladen...",
+  "DE.ApplicationController.errorAccessDeny": "Sie haben versucht die Änderungen im Dokument, zu dem Sie keine Berechtigungen haben, vorzunehemen.<br>Wenden Sie sich an Ihren Serveradministrator.",
+  "DE.ApplicationController.errorDefaultMessage": "Fehlercode: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Das Dokument ist kennwortgeschützt und kann nicht geöffnet werden.",
+  "DE.ApplicationController.errorUserDrop": "Kein Zugriff auf diese Datei ist möglich.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Warnung",
+  "DE.ApplicationController.scriptLoadError": "Die Verbindung ist zu langsam, einige der Komponenten konnten nicht geladen werden. Bitte laden Sie die Seite erneut.",
+  "DE.ApplicationController.textLoadingDocument": "Dokument wird geladen...",
+  "DE.ApplicationController.textOf": "von",
+  "DE.ApplicationController.txtClose": "Schließen",
+  "DE.ApplicationController.unknownErrorText": "Unbekannter Fehler.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Ihr Webbrowser wird nicht unterstützt.",
+  "DE.ApplicationController.waitText": "Bitte warten...",
+  "DE.ApplicationView.txtDownload": "Herunterladen",
+  "DE.ApplicationView.txtEmbed": "Einbetten",
+  "DE.ApplicationView.txtFullScreen": "Vollbild-Modus",
+  "DE.ApplicationView.txtShare": "Freigeben"
+}

apps/documenteditor/embed/locale/en.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "Copy to clipboard",
+  "common.view.modals.txtEmbed": "Embed",
+  "common.view.modals.txtHeight": "Height",
+  "common.view.modals.txtShare": "Share Link",
+  "common.view.modals.txtWidth": "Width",
+  "DE.ApplicationController.convertationErrorText": "Conversion failed.",
+  "DE.ApplicationController.convertationTimeoutText": "Conversion timeout exceeded.",
+  "DE.ApplicationController.criticalErrorTitle": "Error",
+  "DE.ApplicationController.downloadErrorText": "Download failed.",
+  "DE.ApplicationController.downloadTextText": "Downloading document...",
+  "DE.ApplicationController.errorAccessDeny": "You are trying to perform an action you do not have rights for.<br>Please contact your Document Server administrator.",
+  "DE.ApplicationController.errorDefaultMessage": "Error code: %1",
+  "DE.ApplicationController.errorFilePassProtect": "The file is password protected and cannot be opened.",
+  "DE.ApplicationController.errorUserDrop": "The file cannot be accessed right now.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Warning",
+  "DE.ApplicationController.scriptLoadError": "The connection is too slow, some of the components could not be loaded. Please reload the page.",
+  "DE.ApplicationController.textLoadingDocument": "Loading document",
+  "DE.ApplicationController.textOf": "of",
+  "DE.ApplicationController.txtClose": "Close",
+  "DE.ApplicationController.unknownErrorText": "Unknown error.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Your browser is not supported.",
+  "DE.ApplicationController.waitText": "Please, wait...",
+  "DE.ApplicationView.txtDownload": "Download",
+  "DE.ApplicationView.txtEmbed": "Embed",
+  "DE.ApplicationView.txtFullScreen": "Full Screen",
+  "DE.ApplicationView.txtShare": "Share"
+}

apps/documenteditor/embed/locale/es.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "Copiar al portapapeles",
+  "common.view.modals.txtEmbed": "Incorporar",
+  "common.view.modals.txtHeight": "Altura",
+  "common.view.modals.txtShare": "Compartir enlace",
+  "common.view.modals.txtWidth": "Ancho",
+  "DE.ApplicationController.convertationErrorText": "Fallo de conversión.",
+  "DE.ApplicationController.convertationTimeoutText": "Límite de tiempo de conversión está superado.",
+  "DE.ApplicationController.criticalErrorTitle": "Error",
+  "DE.ApplicationController.downloadErrorText": "Fallo en descarga.",
+  "DE.ApplicationController.downloadTextText": "Cargando documento...",
+  "DE.ApplicationController.errorAccessDeny": "Usted no tiene permisos para realizar la acción que está intentando hacer.<br> Por favor, contacte con su Administrador del Servidor de Documentos.",
+  "DE.ApplicationController.errorDefaultMessage": "Código de error: %1",
+  "DE.ApplicationController.errorFilePassProtect": "El archivo está protegido por una contraseña y no puede ser abierto.",
+  "DE.ApplicationController.errorUserDrop": "No se puede acceder al archivo ahora mismo.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Aviso",
+  "DE.ApplicationController.scriptLoadError": "La conexión a Internet es demasiado lenta, no se podía cargar algunos componentes. Por favor, recargue la página.",
+  "DE.ApplicationController.textLoadingDocument": "Cargando documento",
+  "DE.ApplicationController.textOf": "de",
+  "DE.ApplicationController.txtClose": "Cerrar",
+  "DE.ApplicationController.unknownErrorText": "Error desconocido.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Su navegador no está soportado.",
+  "DE.ApplicationController.waitText": "Por favor, espere...",
+  "DE.ApplicationView.txtDownload": "Descargar",
+  "DE.ApplicationView.txtEmbed": "Incorporar",
+  "DE.ApplicationView.txtFullScreen": "Pantalla Completa",
+  "DE.ApplicationView.txtShare": "Compartir"
+}

apps/documenteditor/embed/locale/fr.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "Copier dans le Presse-papiers",
+  "common.view.modals.txtEmbed": "Incorporer",
+  "common.view.modals.txtHeight": "Hauteur",
+  "common.view.modals.txtShare": "Partager un lien",
+  "common.view.modals.txtWidth": "Largeur",
+  "DE.ApplicationController.convertationErrorText": "Échec de la conversion.",
+  "DE.ApplicationController.convertationTimeoutText": "Délai d'attente de la conversion dépassé ",
+  "DE.ApplicationController.criticalErrorTitle": "Erreur",
+  "DE.ApplicationController.downloadErrorText": "Échec du téléchargement.",
+  "DE.ApplicationController.downloadTextText": "Téléchargement du document...",
+  "DE.ApplicationController.errorAccessDeny": "Vous tentez d'exéсuter une action pour laquelle vous ne disposez pas des droits.<br>Veuillez contacter l'administrateur de Document Server.",
+  "DE.ApplicationController.errorDefaultMessage": "Code d'erreur: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Le fichier est protégé par le mot de passe et ne peut pas être ouvert.",
+  "DE.ApplicationController.errorUserDrop": "Impossible d'accéder au fichier.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Avertissement",
+  "DE.ApplicationController.scriptLoadError": "La connexion est trop lente, certains  éléments ne peuvent pas être chargés. Veuillez recharger la page.",
+  "DE.ApplicationController.textLoadingDocument": "Chargement du document",
+  "DE.ApplicationController.textOf": "de",
+  "DE.ApplicationController.txtClose": "Fermer",
+  "DE.ApplicationController.unknownErrorText": "Erreur inconnue.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Votre navigateur n'est pas pris en charge.",
+  "DE.ApplicationController.waitText": "Veuillez patienter...",
+  "DE.ApplicationView.txtDownload": "Télécharger",
+  "DE.ApplicationView.txtEmbed": "Incorporer",
+  "DE.ApplicationView.txtFullScreen": "Plein écran",
+  "DE.ApplicationView.txtShare": "Partager"
+}

apps/documenteditor/embed/locale/hu.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "Másolás a vágólapra",
+  "common.view.modals.txtEmbed": "Beágyaz",
+  "common.view.modals.txtHeight": "Magasság",
+  "common.view.modals.txtShare": "Hivatkozás megosztása",
+  "common.view.modals.txtWidth": "Szélesség",
+  "DE.ApplicationController.convertationErrorText": "Az átalakítás nem sikerült.",
+  "DE.ApplicationController.convertationTimeoutText": "Időtúllépés az átalakítás során.",
+  "DE.ApplicationController.criticalErrorTitle": "Hiba",
+  "DE.ApplicationController.downloadErrorText": "Sikertelen letöltés.",
+  "DE.ApplicationController.downloadTextText": "Dokumentum letöltése...",
+  "DE.ApplicationController.errorAccessDeny": "Olyan műveletet próbál végrehajtani, melyre nincs jogosultsága.<br>Vegye fel a kapcsolatot a Document Server adminisztrátorával.",
+  "DE.ApplicationController.errorDefaultMessage": "Hibakód: %1",
+  "DE.ApplicationController.errorFilePassProtect": "A dokumentum jelszóval védett, és nem nyitható meg.",
+  "DE.ApplicationController.errorUserDrop": "A dokumentum jelenleg nem elérhető",
+  "DE.ApplicationController.notcriticalErrorTitle": "Figyelmeztetés",
+  "DE.ApplicationController.scriptLoadError": "A kapcsolat túl lassú, néhány komponens nem töltődött be. Frissítse az oldalt.",
+  "DE.ApplicationController.textLoadingDocument": "Dokumentum betöltése",
+  "DE.ApplicationController.textOf": "of",
+  "DE.ApplicationController.txtClose": "Bezár",
+  "DE.ApplicationController.unknownErrorText": "Ismeretlen hiba.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "A böngészője nem támogatott.",
+  "DE.ApplicationController.waitText": "Kérjük várjon...",
+  "DE.ApplicationView.txtDownload": "Letöltés",
+  "DE.ApplicationView.txtEmbed": "Beágyaz",
+  "DE.ApplicationView.txtFullScreen": "Teljes képernyő",
+  "DE.ApplicationView.txtShare": "Megosztás"
+}

apps/documenteditor/embed/locale/it.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "Copia negli appunti",
+  "common.view.modals.txtEmbed": "Incorpora",
+  "common.view.modals.txtHeight": "Altezza",
+  "common.view.modals.txtShare": "Condividi collegamento",
+  "common.view.modals.txtWidth": "Larghezza",
+  "DE.ApplicationController.convertationErrorText": "Conversione fallita.",
+  "DE.ApplicationController.convertationTimeoutText": "È stato superato il tempo limite della conversione.",
+  "DE.ApplicationController.criticalErrorTitle": "Errore",
+  "DE.ApplicationController.downloadErrorText": "Scaricamento fallito",
+  "DE.ApplicationController.downloadTextText": "Scaricamento del documento in corso...",
+  "DE.ApplicationController.errorAccessDeny": "Stai tentando di eseguire un'azione per la quale non disponi di permessi sufficienti.<br>Si prega di contattare l'amministratore del Server dei Documenti.",
+  "DE.ApplicationController.errorDefaultMessage": "Codice errore: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Il file è protetto da una password. Impossibile aprirlo.",
+  "DE.ApplicationController.errorUserDrop": "Impossibile accedere al file subito.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Avviso",
+  "DE.ApplicationController.scriptLoadError": "La connessione è troppo lenta, alcuni componenti non possono essere caricati. Si prega di ricaricare la pagina.",
+  "DE.ApplicationController.textLoadingDocument": "Caricamento del documento",
+  "DE.ApplicationController.textOf": "di",
+  "DE.ApplicationController.txtClose": "Chiudi",
+  "DE.ApplicationController.unknownErrorText": "Errore sconosciuto.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Il tuo browser non è supportato.",
+  "DE.ApplicationController.waitText": "Per favore, attendi...",
+  "DE.ApplicationView.txtDownload": "Scarica",
+  "DE.ApplicationView.txtEmbed": "Incorpora",
+  "DE.ApplicationView.txtFullScreen": "Schermo intero",
+  "DE.ApplicationView.txtShare": "Condividi"
+}

apps/documenteditor/embed/locale/ja.json

@@ -0,0 +1,21 @@
+{
+  "common.view.modals.txtHeight": "高さ",
+  "common.view.modals.txtWidth": "幅",
+  "DE.ApplicationController.convertationErrorText": "変換に失敗しました",
+  "DE.ApplicationController.convertationTimeoutText": "変換のタイムアウトを超過しました。",
+  "DE.ApplicationController.criticalErrorTitle": "エラー",
+  "DE.ApplicationController.downloadErrorText": "ダウンロードに失敗しました",
+  "DE.ApplicationController.downloadTextText": "ドキュメントのダウンロード中...",
+  "DE.ApplicationController.errorDefaultMessage": "エラー コード: %1",
+  "DE.ApplicationController.errorFilePassProtect": "ドキュメントがパスワードで保護されているため開くことができません",
+  "DE.ApplicationController.errorUserDrop": "今、ファイルにアクセスすることはできません。",
+  "DE.ApplicationController.notcriticalErrorTitle": "警告",
+  "DE.ApplicationController.textLoadingDocument": "ドキュメントを読み込んでいます",
+  "DE.ApplicationController.textOf": "から",
+  "DE.ApplicationController.txtClose": "閉じる",
+  "DE.ApplicationController.unknownErrorText": "不明なエラー",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "お使いのブラウザがサポートされていません。",
+  "DE.ApplicationView.txtDownload": "ダウンロード",
+  "DE.ApplicationView.txtFullScreen": "全画面表示",
+  "DE.ApplicationView.txtShare": "シェア"
+}

apps/documenteditor/embed/locale/ko.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "클립보드로 복사",
+  "common.view.modals.txtEmbed": "퍼가기",
+  "common.view.modals.txtHeight": "높이",
+  "common.view.modals.txtShare": "링크 공유",
+  "common.view.modals.txtWidth": "너비",
+  "DE.ApplicationController.convertationErrorText": "변환 실패",
+  "DE.ApplicationController.convertationTimeoutText": "전환 시간 초과를 초과했습니다.",
+  "DE.ApplicationController.criticalErrorTitle": "오류",
+  "DE.ApplicationController.downloadErrorText": "다운로드하지 못했습니다.",
+  "DE.ApplicationController.downloadTextText": "문서 다운로드 중 ...",
+  "DE.ApplicationController.errorAccessDeny": "권한이없는 작업을 수행하려고합니다. <br> Document Server 관리자에게 문의하십시오.",
+  "DE.ApplicationController.errorDefaultMessage": "오류 코드 : %1",
+  "DE.ApplicationController.errorFilePassProtect": "이 문서는 암호로 보호되어있어 열 수 없습니다.",
+  "DE.ApplicationController.errorUserDrop": "파일에 지금 액세스 할 수 없습니다.",
+  "DE.ApplicationController.notcriticalErrorTitle": "경고",
+  "DE.ApplicationController.scriptLoadError": "연결 속도가 느려, 일부 요소들이 로드되지 않았습니다. 페이지를 다시 새로 고침해주세요.",
+  "DE.ApplicationController.textLoadingDocument": "문서로드 중",
+  "DE.ApplicationController.textOf": "중",
+  "DE.ApplicationController.txtClose": "완료",
+  "DE.ApplicationController.unknownErrorText": "알 수없는 오류.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "사용중인 브라우저가 지원되지 않습니다.",
+  "DE.ApplicationController.waitText": "잠시만 기달려주세요...",
+  "DE.ApplicationView.txtDownload": "다운로드",
+  "DE.ApplicationView.txtEmbed": "퍼가기",
+  "DE.ApplicationView.txtFullScreen": "전체 화면",
+  "DE.ApplicationView.txtShare": "공유"
+}

apps/documenteditor/embed/locale/lv.json

@@ -0,0 +1,22 @@
+{
+  "common.view.modals.txtCopy": "Nokopēts starpliktuvē",
+  "common.view.modals.txtHeight": "Augstums",
+  "common.view.modals.txtWidth": "Platums",
+  "DE.ApplicationController.convertationErrorText": "Konversija neizdevās.",
+  "DE.ApplicationController.convertationTimeoutText": "Konversijas taimauts pārsniegts.",
+  "DE.ApplicationController.criticalErrorTitle": "Kļūda",
+  "DE.ApplicationController.downloadErrorText": "Lejuplāde neizdevās.",
+  "DE.ApplicationController.downloadTextText": "Lejuplādē dokumentu...",
+  "DE.ApplicationController.errorAccessDeny": "Jūs mēģināt veikt darbību, kuru nedrīkstat veikt.<br>Lūdzu, sazinieties ar savu dokumentu servera administratoru.",
+  "DE.ApplicationController.errorDefaultMessage": "Kļūdas kods: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Fails ir aizsargāts ar paroli un to nevar atvērt.",
+  "DE.ApplicationController.errorUserDrop": "Failam šobrīd nevar piekļūt.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Brīdinājums",
+  "DE.ApplicationController.textLoadingDocument": "Ielādē dokumentu",
+  "DE.ApplicationController.textOf": "no",
+  "DE.ApplicationController.txtClose": "Aizvērt",
+  "DE.ApplicationController.unknownErrorText": "Nezināma kļūda.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Jūsu pārlūkprogramma nav atbalstīta.",
+  "DE.ApplicationView.txtDownload": "Lejupielādēt",
+  "DE.ApplicationView.txtShare": "Dalīties"
+}

apps/documenteditor/embed/locale/nl.json

@@ -0,0 +1,23 @@
+{
+  "common.view.modals.txtCopy": "Kopieer naar klembord",
+  "common.view.modals.txtHeight": "Hoogte",
+  "common.view.modals.txtWidth": "Breedte",
+  "DE.ApplicationController.convertationTimeoutText": "Time-out voor conversie overschreden.",
+  "DE.ApplicationController.criticalErrorTitle": "Fout",
+  "DE.ApplicationController.downloadErrorText": "Download mislukt.",
+  "DE.ApplicationController.downloadTextText": "Document wordt gedownload...",
+  "DE.ApplicationController.errorAccessDeny": "U probeert een actie uit te voeren waarvoor u geen rechten hebt.<br>Neem contact op met de beheerder van de documentserver.",
+  "DE.ApplicationController.errorDefaultMessage": "Foutcode: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Het bestand is beschermd met een wachtwoord en kan niet worden geopend.",
+  "DE.ApplicationController.errorUserDrop": "Toegang tot het bestand is op dit moment niet mogelijk.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Waarschuwing",
+  "DE.ApplicationController.scriptLoadError": "De verbinding is te langzaam, sommige componenten konden niet geladen worden. Laad de pagina opnieuw.",
+  "DE.ApplicationController.textLoadingDocument": "Document wordt geladen",
+  "DE.ApplicationController.textOf": "van",
+  "DE.ApplicationController.txtClose": "Sluiten",
+  "DE.ApplicationController.unknownErrorText": "Onbekende fout.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Uw browser wordt niet ondersteund.",
+  "DE.ApplicationView.txtDownload": "Downloaden",
+  "DE.ApplicationView.txtFullScreen": "Volledig scherm",
+  "DE.ApplicationView.txtShare": "Delen"
+}

apps/documenteditor/embed/locale/pl.json

@@ -0,0 +1,23 @@
+{
+  "common.view.modals.txtCopy": "Skopiuj do schowka",
+  "common.view.modals.txtHeight": "Wysokość",
+  "common.view.modals.txtWidth": "Szerokość",
+  "DE.ApplicationController.convertationTimeoutText": "Przekroczono limit czasu konwersji.",
+  "DE.ApplicationController.criticalErrorTitle": "Błąd",
+  "DE.ApplicationController.downloadErrorText": "Pobieranie nieudane.",
+  "DE.ApplicationController.downloadTextText": "Pobieranie dokumentu...",
+  "DE.ApplicationController.errorAccessDeny": "Próbujesz wykonać działanie, na które nie masz uprawnień.<br>Proszę skontaktować się z administratorem serwera dokumentów.",
+  "DE.ApplicationController.errorDefaultMessage": "Kod błędu: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Dokument jest chroniony hasłem i nie może być otwarty.",
+  "DE.ApplicationController.errorUserDrop": "Nie można uzyskać dostępu do tego pliku.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Ostrzeżenie",
+  "DE.ApplicationController.textLoadingDocument": "Ładowanie dokumentu",
+  "DE.ApplicationController.textOf": "z",
+  "DE.ApplicationController.txtClose": "Zamknij",
+  "DE.ApplicationController.unknownErrorText": "Nieznany błąd.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Twoja przeglądarka nie jest wspierana.",
+  "DE.ApplicationController.waitText": "Proszę czekać...",
+  "DE.ApplicationView.txtDownload": "Pobierz",
+  "DE.ApplicationView.txtFullScreen": "Pełny ekran",
+  "DE.ApplicationView.txtShare": "Udostępnij"
+}

apps/documenteditor/embed/locale/pt.json

@@ -0,0 +1,22 @@
+{
+  "common.view.modals.txtCopy": "Copiar para a área de transferência",
+  "common.view.modals.txtHeight": "Altura",
+  "common.view.modals.txtWidth": "Largura",
+  "DE.ApplicationController.convertationTimeoutText": "Tempo limite de conversão excedido.",
+  "DE.ApplicationController.criticalErrorTitle": "Erro",
+  "DE.ApplicationController.downloadErrorText": "Falha ao baixar",
+  "DE.ApplicationController.downloadTextText": "Baixando documento...",
+  "DE.ApplicationController.errorAccessDeny": "Você está tentando executar uma ação para a qual não tem direitos.<br>Entre em contato com o administrador do Document Server.",
+  "DE.ApplicationController.errorDefaultMessage": "Código do erro: %1",
+  "DE.ApplicationController.errorFilePassProtect": "O documento é protegido por senha e não pode ser aberto.",
+  "DE.ApplicationController.errorUserDrop": "O arquivo não pode ser acessado agora.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Aviso",
+  "DE.ApplicationController.textLoadingDocument": "Carregando documento",
+  "DE.ApplicationController.textOf": "de",
+  "DE.ApplicationController.txtClose": "Fechar",
+  "DE.ApplicationController.unknownErrorText": "Erro desconhecido.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Seu navegador não é suportado.",
+  "DE.ApplicationController.waitText": "Aguarde...",
+  "DE.ApplicationView.txtDownload": "Baixar",
+  "DE.ApplicationView.txtShare": "Compartilhar"
+}

apps/documenteditor/embed/locale/ru.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "Скопировать в буфер",
+  "common.view.modals.txtEmbed": "Встроить",
+  "common.view.modals.txtHeight": "Высота",
+  "common.view.modals.txtShare": "Поделиться ссылкой",
+  "common.view.modals.txtWidth": "Ширина",
+  "DE.ApplicationController.convertationErrorText": "Конвертация не удалась.",
+  "DE.ApplicationController.convertationTimeoutText": "Превышено время ожидания конвертации.",
+  "DE.ApplicationController.criticalErrorTitle": "Ошибка",
+  "DE.ApplicationController.downloadErrorText": "Загрузка не удалась.",
+  "DE.ApplicationController.downloadTextText": "Загрузка документа...",
+  "DE.ApplicationController.errorAccessDeny": "Вы пытаетесь выполнить действие, на которое у вас нет прав.<br>Пожалуйста, обратитесь к администратору Сервера документов.",
+  "DE.ApplicationController.errorDefaultMessage": "Код ошибки: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Файл защищен паролем и не может быть открыт.",
+  "DE.ApplicationController.errorUserDrop": "В настоящий момент файл недоступен.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Внимание",
+  "DE.ApplicationController.scriptLoadError": "Слишком медленное подключение, некоторые компоненты не удалось загрузить. Пожалуйста, обновите страницу.",
+  "DE.ApplicationController.textLoadingDocument": "Загрузка документа",
+  "DE.ApplicationController.textOf": "из",
+  "DE.ApplicationController.txtClose": "Закрыть",
+  "DE.ApplicationController.unknownErrorText": "Неизвестная ошибка.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Ваш браузер не поддерживается.",
+  "DE.ApplicationController.waitText": "Пожалуйста, подождите...",
+  "DE.ApplicationView.txtDownload": "Скачать файл",
+  "DE.ApplicationView.txtEmbed": "Встроить",
+  "DE.ApplicationView.txtFullScreen": "Во весь экран",
+  "DE.ApplicationView.txtShare": "Поделиться"
+}

apps/documenteditor/embed/locale/sk.json

@@ -0,0 +1,23 @@
+{
+  "common.view.modals.txtCopy": "Skopírovať do schránky",
+  "common.view.modals.txtHeight": "Výška",
+  "common.view.modals.txtWidth": "Šírka",
+  "DE.ApplicationController.convertationTimeoutText": "Prekročený čas konverzie.",
+  "DE.ApplicationController.criticalErrorTitle": "Chyba",
+  "DE.ApplicationController.downloadErrorText": "Sťahovanie zlyhalo.",
+  "DE.ApplicationController.downloadTextText": "Sťahovanie dokumentu...",
+  "DE.ApplicationController.errorAccessDeny": "Pokúšate sa vykonať akciu, na ktorú nemáte práva.<br>Prosím, kontaktujte svojho správcu dokumentového servera.",
+  "DE.ApplicationController.errorDefaultMessage": "Kód chyby: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Dokument je chránený heslom a nie je možné ho otvoriť.",
+  "DE.ApplicationController.errorUserDrop": "K súboru nie je možné práve teraz získať prístup.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Upozornenie",
+  "DE.ApplicationController.textLoadingDocument": "Načítavanie dokumentu",
+  "DE.ApplicationController.textOf": "z",
+  "DE.ApplicationController.txtClose": "Zatvoriť",
+  "DE.ApplicationController.unknownErrorText": "Neznáma chyba.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Váš prehliadač nie je podporovaný.",
+  "DE.ApplicationController.waitText": "Prosím čakajte...",
+  "DE.ApplicationView.txtDownload": "Stiahnuť",
+  "DE.ApplicationView.txtFullScreen": "Celá obrazovka",
+  "DE.ApplicationView.txtShare": "Zdieľať"
+}

apps/documenteditor/embed/locale/sl.json

@@ -0,0 +1,21 @@
+{
+  "common.view.modals.txtCopy": "Kopiraj v odložišče",
+  "common.view.modals.txtHeight": "Višina",
+  "common.view.modals.txtWidth": "Širina",
+  "DE.ApplicationController.convertationErrorText": "Pretvorba ni uspela.",
+  "DE.ApplicationController.convertationTimeoutText": "Pretvorbena prekinitev presežena.",
+  "DE.ApplicationController.criticalErrorTitle": "Napaka",
+  "DE.ApplicationController.downloadErrorText": "Prenos ni uspel.",
+  "DE.ApplicationController.downloadTextText": "Prenašanje dokumenta...",
+  "DE.ApplicationController.errorDefaultMessage": "Koda napake: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Dokument je zaščiten z geslom in ga ni mogoče odpreti.",
+  "DE.ApplicationController.errorUserDrop": "Do datoteke v tem trenutku ni možno dostopati.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Opozorilo",
+  "DE.ApplicationController.textLoadingDocument": "Nalaganje dokumenta",
+  "DE.ApplicationController.textOf": "od",
+  "DE.ApplicationController.txtClose": "Zapri",
+  "DE.ApplicationController.unknownErrorText": "Neznana napaka.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Vaš brskalnik ni podprt.",
+  "DE.ApplicationView.txtDownload": "Prenesi",
+  "DE.ApplicationView.txtShare": "Deli"
+}

apps/documenteditor/embed/locale/tr.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "Panoya kopyala",
+  "common.view.modals.txtEmbed": "Gömülü",
+  "common.view.modals.txtHeight": "Yükseklik",
+  "common.view.modals.txtShare": "Bağlantıyı Paylaş",
+  "common.view.modals.txtWidth": "Genişlik",
+  "DE.ApplicationController.convertationErrorText": "Değişim başarısız oldu.",
+  "DE.ApplicationController.convertationTimeoutText": "Değişim süresi aşıldı.",
+  "DE.ApplicationController.criticalErrorTitle": "Hata",
+  "DE.ApplicationController.downloadErrorText": "Yükleme başarısız oldu.",
+  "DE.ApplicationController.downloadTextText": "Döküman yükleniyor...",
+  "DE.ApplicationController.errorAccessDeny": "Hakkınız olmayan bir eylem gerçekleştirmeye çalışıyorsunuz.<br>Lütfen Belge Sunucu yöneticinize başvurun.",
+  "DE.ApplicationController.errorDefaultMessage": "Hata kodu: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Döküman şifre korumalı ve açılamadı",
+  "DE.ApplicationController.errorUserDrop": "Belgeye şu an erişilemiyor.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Uyarı",
+  "DE.ApplicationController.scriptLoadError": "Bağlantı çok yavaş, bileşenlerin bazıları yüklenemedi. Lütfen sayfayı yenileyin.",
+  "DE.ApplicationController.textLoadingDocument": "Döküman yükleniyor",
+  "DE.ApplicationController.textOf": "'in",
+  "DE.ApplicationController.txtClose": "Kapat",
+  "DE.ApplicationController.unknownErrorText": "Bilinmeyen hata.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Tarayıcınız desteklenmiyor.",
+  "DE.ApplicationController.waitText": "Lütfen bekleyin...",
+  "DE.ApplicationView.txtDownload": "İndir",
+  "DE.ApplicationView.txtEmbed": "Gömülü",
+  "DE.ApplicationView.txtFullScreen": "Tam Ekran",
+  "DE.ApplicationView.txtShare": "Paylaş"
+}

apps/documenteditor/embed/locale/uk.json

@@ -0,0 +1,22 @@
+{
+  "common.view.modals.txtCopy": "Копіювати в буфер обміну",
+  "common.view.modals.txtHeight": "Висота",
+  "common.view.modals.txtWidth": "Ширина",
+  "DE.ApplicationController.convertationTimeoutText": "Термін переходу перевищено.",
+  "DE.ApplicationController.criticalErrorTitle": "Помилка",
+  "DE.ApplicationController.downloadErrorText": "Завантаження не вдалося",
+  "DE.ApplicationController.downloadTextText": "Завантаження документу...",
+  "DE.ApplicationController.errorAccessDeny": "Ви намагаєтеся виконати дію, на яку у вас немає прав. <br> Будь ласка, зв'яжіться з адміністратором вашого Сервера документів.",
+  "DE.ApplicationController.errorDefaultMessage": "Код помилки: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Документ захищений паролем і його неможливо відкрити.",
+  "DE.ApplicationController.errorUserDrop": "На даний момент файл не доступний.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Застереження",
+  "DE.ApplicationController.textLoadingDocument": "Завантаження документа",
+  "DE.ApplicationController.textOf": "з",
+  "DE.ApplicationController.txtClose": "Закрити",
+  "DE.ApplicationController.unknownErrorText": "Невідома помилка.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Ваш браузер не підтримується",
+  "DE.ApplicationView.txtDownload": "Завантажити",
+  "DE.ApplicationView.txtFullScreen": "Повноекранний режим",
+  "DE.ApplicationView.txtShare": "Доступ"
+}

apps/documenteditor/embed/locale/vi.json

@@ -0,0 +1,22 @@
+{
+  "common.view.modals.txtCopy": "Sao chép vào khay nhớ tạm",
+  "common.view.modals.txtHeight": "Chiều cao",
+  "common.view.modals.txtWidth": "Chiều rộng",
+  "DE.ApplicationController.convertationTimeoutText": "Đã quá thời gian chờ chuyển đổi.",
+  "DE.ApplicationController.criticalErrorTitle": "Lỗi",
+  "DE.ApplicationController.downloadErrorText": "Tải về không thành công.",
+  "DE.ApplicationController.downloadTextText": "Đang tải tài liệu...",
+  "DE.ApplicationController.errorAccessDeny": "Bạn đang cố gắng thực hiện hành động mà bạn không có quyền.<br>Vui lòng liên hệ với quản trị viên Server Tài liệu của bạn.",
+  "DE.ApplicationController.errorDefaultMessage": "Mã lỗi: %1",
+  "DE.ApplicationController.errorFilePassProtect": "Tài liệu được bảo vệ bằng mật khẩu và không thể mở được.",
+  "DE.ApplicationController.errorUserDrop": "Không thể truy cập file ngay lúc này.",
+  "DE.ApplicationController.notcriticalErrorTitle": "Cảnh báo",
+  "DE.ApplicationController.textLoadingDocument": "Đang tải tài liệu",
+  "DE.ApplicationController.textOf": "trên",
+  "DE.ApplicationController.txtClose": "Đóng",
+  "DE.ApplicationController.unknownErrorText": "Lỗi không xác định.",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "Trình duyệt của bạn không được hỗ trợ.",
+  "DE.ApplicationView.txtDownload": "Tải về",
+  "DE.ApplicationView.txtFullScreen": "Toàn màn hình",
+  "DE.ApplicationView.txtShare": "Chia sẻ"
+}

apps/documenteditor/embed/locale/zh.json

@@ -0,0 +1,28 @@
+{
+  "common.view.modals.txtCopy": "复制到剪贴板",
+  "common.view.modals.txtEmbed": "嵌入",
+  "common.view.modals.txtHeight": "高度",
+  "common.view.modals.txtShare": "分享链接",
+  "common.view.modals.txtWidth": "宽度",
+  "DE.ApplicationController.convertationErrorText": "转换失败",
+  "DE.ApplicationController.convertationTimeoutText": "转换超时",
+  "DE.ApplicationController.criticalErrorTitle": "错误",
+  "DE.ApplicationController.downloadErrorText": "下载失败",
+  "DE.ApplicationController.downloadTextText": "正在下载文件...",
+  "DE.ApplicationController.errorAccessDeny": "您正在尝试执行您没有权限的操作。<br>请联系您的文档服务器管理员.",
+  "DE.ApplicationController.errorDefaultMessage": "错误代码：%1",
+  "DE.ApplicationController.errorFilePassProtect": "该文档受密码保护，无法被打开。",
+  "DE.ApplicationController.errorUserDrop": "该文件现在无法访问。",
+  "DE.ApplicationController.notcriticalErrorTitle": "警告",
+  "DE.ApplicationController.scriptLoadError": "连接速度过慢，部分组件无法被加载。请重新加载页面。",
+  "DE.ApplicationController.textLoadingDocument": "文件加载中…",
+  "DE.ApplicationController.textOf": "的",
+  "DE.ApplicationController.txtClose": "关闭",
+  "DE.ApplicationController.unknownErrorText": "示知错误",
+  "DE.ApplicationController.unsupportedBrowserErrorText": "你的浏览器不支持",
+  "DE.ApplicationController.waitText": "请稍候...",
+  "DE.ApplicationView.txtDownload": "下载",
+  "DE.ApplicationView.txtEmbed": "嵌入",
+  "DE.ApplicationView.txtFullScreen": "全屏",
+  "DE.ApplicationView.txtShare": "共享"
+}

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

@@ -46,6 +46,19 @@ var c_paragraphLinerule = {
     LINERULE_EXACT: 2
 };
 
+var c_paragraphSpecial = {
+    NONE_SPECIAL: 0,
+    FIRST_LINE: 1,
+    HANGING: 2
+};
+
+var c_paragraphTextAlignment = {
+    RIGHT: 0,
+    LEFT: 1,
+    CENTERED: 2,
+    JUSTIFIED: 3
+};
+
 var c_pageNumPosition = {
     PAGE_NUM_POSITION_TOP: 0x01,
     PAGE_NUM_POSITION_BOTTOM: 0x02,

apps/documenteditor/main/app/controller/LeftMenu.js

@@ -237,7 +237,7 @@ define([
                 if ( isopts ) close_menu = false;
                 else this.clickSaveCopyAsFormat(undefined);
                 break;
-            case 'print': this.api.asc_Print(Common.Utils.isChrome || Common.Utils.isSafari || Common.Utils.isOpera); break;
+            case 'print': this.api.asc_Print(new Asc.asc_CDownloadOptions(null, Common.Utils.isChrome || Common.Utils.isSafari || Common.Utils.isOpera)); break;
             case 'exit': Common.NotificationCenter.trigger('goback'); break;
             case 'edit':
                 this.getApplication().getController('Statusbar').setStatusCaption(this.requestEditRightsText);
@@ -302,13 +302,39 @@ define([
                         buttons: ['ok', 'cancel'],
                         callback: _.bind(function(btn){
                             if (btn == 'ok') {
-                                this.api.asc_DownloadAs(format);
+                                if (format == Asc.c_oAscFileType.TXT)
+                                    Common.NotificationCenter.trigger('download:advanced', Asc.c_oAscAdvancedOptionsID.TXT, this.api.asc_getAdvancedOptions(), 2, new Asc.asc_CDownloadOptions(format));
+                                else
+                                    this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(format));
+                                menu.hide();
+                            }
+                        }, this)
+                    });
+                } else if (format == Asc.c_oAscFileType.DOCX) {
+                    if (!Common.Utils.InternalSettings.get("de-settings-compatible") && !Common.localStorage.getBool("de-hide-save-compatible") && this.api.asc_isCompatibilityMode()) {
+                        Common.UI.warning({
+                            closable: false,
+                            width: 600,
+                            title: this.notcriticalErrorTitle,
+                            msg: this.txtCompatible,
+                            buttons: ['ok', 'cancel'],
+                            dontshow: true,
+                            callback: _.bind(function(btn, dontshow){
+                                if (dontshow) Common.localStorage.setItem("de-hide-save-compatible", 1);
+                                if (btn == 'ok') {
+                                    this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(format));
                                     menu.hide();
                                 }
                             }, this)
                         });
                     } else {
-                    this.api.asc_DownloadAs(format);
+                        var opts = new Asc.asc_CDownloadOptions(Asc.c_oAscFileType.DOCX);
+                        opts.asc_setCompatible(!!Common.Utils.InternalSettings.get("de-settings-compatible"));
+                        this.api.asc_DownloadAs(opts);
+                        menu.hide();
+                    }
+                } else {
+                    this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(format));
                     menu.hide();
                 }
             } else
@@ -326,14 +352,42 @@ define([
                         callback: _.bind(function(btn){
                             if (btn == 'ok') {
                                 this.isFromFileDownloadAs = ext;
-                                this.api.asc_DownloadAs(format, true);
+                                if (format == Asc.c_oAscFileType.TXT)
+                                    Common.NotificationCenter.trigger('download:advanced', Asc.c_oAscAdvancedOptionsID.TXT, this.api.asc_getAdvancedOptions(), 2, new Asc.asc_CDownloadOptions(format, true));
+                                else
+                                    this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(format, true));
+                                menu.hide();
+                            }
+                        }, this)
+                    });
+                } else if (format == Asc.c_oAscFileType.DOCX) {
+                    if (!Common.Utils.InternalSettings.get("de-settings-compatible") && !Common.localStorage.getBool("de-hide-save-compatible") && this.api.asc_isCompatibilityMode()) {
+                        Common.UI.warning({
+                            closable: false,
+                            width: 600,
+                            title: this.notcriticalErrorTitle,
+                            msg: this.txtCompatible,
+                            buttons: ['ok', 'cancel'],
+                            dontshow: true,
+                            callback: _.bind(function(btn, dontshow){
+                                if (dontshow) Common.localStorage.setItem("de-hide-save-compatible", 1);
+                                if (btn == 'ok') {
+                                    this.isFromFileDownloadAs = ext;
+                                    this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(format, true));
                                     menu.hide();
                                 }
                             }, this)
                         });
                     } else {
                         this.isFromFileDownloadAs = ext;
-                    this.api.asc_DownloadAs(format, true);
+                        var opts = new Asc.asc_CDownloadOptions(Asc.c_oAscFileType.DOCX, true);
+                        opts.asc_setCompatible(!!Common.Utils.InternalSettings.get("de-settings-compatible"));
+                        this.api.asc_DownloadAs(opts);
+                        menu.hide();
+                    }
+                } else {
+                    this.isFromFileDownloadAs = ext;
+                    this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(format, true));
                     menu.hide();
                 }
             } else {
@@ -354,6 +408,9 @@ define([
                         defFileName = defFileName.substring(0, idx) + this.isFromFileDownloadAs;
                 }
 
+                if (me.mode.canRequestSaveAs) {
+                    Common.Gateway.requestSaveAs(url, defFileName);
+                } else {
                     me._saveCopyDlg = new Common.Views.SaveAsDlg({
                         saveFolderUrl: me.mode.saveAsUrl,
                         saveFileUrl: url,
@@ -376,6 +433,7 @@ define([
                     });
                     me._saveCopyDlg.show();
                 }
+            }
             this.isFromFileDownloadAs = false;
         },
 
@@ -436,8 +494,10 @@ define([
         },
 
         onCreateNew: function(menu, type) {
+            if ( !Common.Controllers.Desktop.process('create:new') ) {
                 var newDocumentPage = window.open(type == 'blank' ? this.mode.createUrl : type, "_blank");
                 if (newDocumentPage) newDocumentPage.focus();
+            }
 
             if (menu) {
                 menu.hide();
@@ -820,6 +880,8 @@ define([
         leavePageText: 'All unsaved changes in this document will be lost.<br> Click \'Cancel\' then \'Save\' to save them. Click \'OK\' to discard all the unsaved changes.',
         warnDownloadAs          : 'If you continue saving in this format all features except the text will be lost.<br>Are you sure you want to continue?',
         warnDownloadAsRTF       : 'If you continue saving in this format some of the formatting might be lost.<br>Are you sure you want to continue?',
-        txtUntitled: 'Untitled'
+        txtUntitled: 'Untitled',
+        txtCompatible: 'The document will be saved to the new format. It will allow to use all the editor features, but might affect the document layout.<br>Use the \'Compatibility\' option of the advanced settings if you want to make the files compatible with older MS Word versions.'
+
     }, DE.Controllers.LeftMenu || {}));
 });

apps/documenteditor/main/app/controller/Links.js

@@ -78,6 +78,9 @@ define([
             this._state = {
                 prcontrolsdisable:undefined
             };
+            Common.Gateway.on('setactionlink', function (url) {
+                console.log('url with actions: ' + url);
+            }.bind(this));
         },
 
         setApi: function (api) {
@@ -146,22 +149,14 @@ define([
                 control_plain = (control_props) ? (control_props.get_ContentControlType()==Asc.c_oAscSdtLevelType.Inline) : false;
 
             var need_disable = paragraph_locked || in_equation || in_image || in_header || control_plain;
-            _.each (this.view.btnsNotes, function(item){
+            this.view.btnsNotes.setDisabled(need_disable);
-                item.setDisabled(need_disable);
-            }, this);
 
             need_disable = paragraph_locked || header_locked || in_header || control_plain;
             this.view.btnBookmarks.setDisabled(need_disable);
         },
 
         onApiCanAddHyperlink: function(value) {
-            var need_disable = !value || this._state.prcontrolsdisable;
+            this.toolbar.editMode && this.view.btnsHyperlink.setDisabled(!value || this._state.prcontrolsdisable);
-
-            if ( this.toolbar.editMode ) {
-                _.each (this.view.btnsHyperlink, function(item){
-                    item.setDisabled(need_disable);
-                }, this);
-            }
         },
 
         onHyperlinkClick: function(btn) {
@@ -299,7 +294,9 @@ define([
                             if (settings) {
                                 me.api.asc_SetFootnoteProps(settings.props, settings.applyToAll);
                                 if (result == 'insert')
+                                    setTimeout(function() {
                                         me.api.asc_AddFootnote(settings.custom);
+                                    }, 1);
                             }
                             Common.NotificationCenter.trigger('edit:complete', me.toolbar);
                         },

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

@@ -195,14 +195,13 @@ define([
 
                     Common.NotificationCenter.on('api:disconnect',                  _.bind(this.onCoAuthoringDisconnect, this));
                     Common.NotificationCenter.on('goback',                          _.bind(this.goBack, this));
+                    Common.NotificationCenter.on('download:advanced',               _.bind(this.onAdvancedOptions, this));
 
                     this.isShowOpenDialog = false;
                     
                     // Initialize api gateway
                     this.editorConfig = {};
                     this.appOptions = {};
-                    this.plugins = undefined;
-                    this.UICustomizePlugins = [];
                     Common.Gateway.on('init',           _.bind(this.loadConfig, this));
                     Common.Gateway.on('showmessage',    _.bind(this.onExternalMessage, this));
                     Common.Gateway.on('opendocument',   _.bind(this.loadDocument, this));
@@ -230,11 +229,13 @@ define([
                     });
 
                     $(document.body).on('blur', 'input, textarea', function(e) {
-                        if (!me.isModalShowed) {
+                        if (!me.isModalShowed && !me.getApplication().getController('LeftMenu').getView('LeftMenu').getMenu('file').isVisible()) {
                             if (/form-control/.test(e.target.className))
                                 me.inFormControl = false;
                             if (!e.relatedTarget ||
-                                !/area_id/.test(e.target.id) && ($(e.target).parent().find(e.relatedTarget).length<1 || e.target.localName == 'textarea') /* Check if focus in combobox goes from input to it's menu button or menu items, or from comment editing area to Ok/Cancel button */
+                                !/area_id/.test(e.target.id)
+                                && !(e.target.localName == 'input' && $(e.target).parent().find(e.relatedTarget).length>0) /* Check if focus in combobox goes from input to it's menu button or menu items, or from comment editing area to Ok/Cancel button */
+                                && !(e.target.localName == 'textarea' && $(e.target).closest('.asc-window').find(e.relatedTarget).length>0) /* Check if focus in comment goes from textarea to it's email menu */
                                 && (e.relatedTarget.localName != 'input' || !/form-control/.test(e.relatedTarget.className)) /* Check if focus goes to text input with class "form-control" */
                                 && (e.relatedTarget.localName != 'textarea' || /area_id/.test(e.relatedTarget.id))) /* Check if focus goes to textarea, but not to "area_id" */ {
                                 if (Common.Utils.isIE && e.originalEvent && e.originalEvent.target && /area_id/.test(e.originalEvent.target.id) && (e.originalEvent.target === e.originalEvent.srcElement))
@@ -316,7 +317,7 @@ define([
                     });
                 }
 
-                me.defaultTitleText = me.defaultTitleText || '{{APP_TITLE_TEXT}}';
+                me.defaultTitleText = '{{APP_TITLE_TEXT}}';
                 me.warnNoLicense  = me.warnNoLicense.replace('%1', '{{COMPANY_NAME}}');
                 me.warnNoLicenseUsers = me.warnNoLicenseUsers.replace('%1', '{{COMPANY_NAME}}');
                 me.textNoLicenseTitle = me.textNoLicenseTitle.replace('%1', '{{COMPANY_NAME}}');
@@ -328,7 +329,7 @@ define([
                 this.editorConfig.user          =
                 this.appOptions.user            = Common.Utils.fillUserInfo(this.editorConfig.user, this.editorConfig.lang, this.textAnonymous);
                 this.appOptions.isDesktopApp    = this.editorConfig.targetApp == 'desktop';
-                this.appOptions.canCreateNew    = !_.isEmpty(this.editorConfig.createUrl) && !this.appOptions.isDesktopApp;
+                this.appOptions.canCreateNew    = !_.isEmpty(this.editorConfig.createUrl);
                 this.appOptions.canOpenRecent   = this.editorConfig.recent !== undefined && !this.appOptions.isDesktopApp;
                 this.appOptions.templates       = this.editorConfig.templates;
                 this.appOptions.recent          = this.editorConfig.recent;
@@ -345,8 +346,12 @@ define([
                                                   && (typeof (this.editorConfig.customization.goback) == 'object') && !_.isEmpty(this.editorConfig.customization.goback.url);
                 this.appOptions.canBack         = this.appOptions.canBackToFolder === true;
                 this.appOptions.canPlugins      = false;
-                this.plugins                    = this.editorConfig.plugins;
                 this.appOptions.canMakeActionLink = this.editorConfig.canMakeActionLink;
+                this.appOptions.canRequestUsers = this.editorConfig.canRequestUsers;
+                this.appOptions.canRequestSendNotify = this.editorConfig.canRequestSendNotify;
+                this.appOptions.canRequestSaveAs = this.editorConfig.canRequestSaveAs;
+                this.appOptions.canRequestInsertImage = this.editorConfig.canRequestInsertImage;
+                this.appOptions.canRequestMailMergeRecipients = this.editorConfig.canRequestMailMergeRecipients;
 
                 appHeader = this.getApplication().getController('Viewport').getView('Common.Views.Header');
                 appHeader.setCanBack(this.appOptions.canBackToFolder === true, (this.appOptions.canBackToFolder) ? this.editorConfig.customization.goback.text : '')
@@ -389,7 +394,6 @@ define([
                     docInfo.put_Token(data.doc.token);
                     docInfo.put_Permissions(_permissions);
 //                    docInfo.put_Review(this.permissions.review);
-//                    docInfo.put_OfflineApp(this.editorConfig.nativeApp === true); // used in sdk for testing
 
                     var type = /^(?:(pdf|djvu|xps))$/.exec(data.doc.fileType);
                     if (type && typeof type[1] === 'string') {
@@ -463,7 +467,7 @@ define([
 
                     if ( !_format || _supported.indexOf(_format) < 0 )
                         _format = Asc.c_oAscFileType.DOCX;
-                    this.api.asc_DownloadAs(_format, true);
+                    this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(_format, true));
                 }
             },
 
@@ -890,6 +894,9 @@ define([
                 Common.Utils.InternalSettings.set("de-settings-spellcheck", value);
                 me.api.asc_setSpellCheck(value);
 
+                value = Common.localStorage.getBool("de-settings-compatible", false);
+                Common.Utils.InternalSettings.set("de-settings-compatible", value);
+
                 Common.Utils.InternalSettings.set("de-settings-showsnaplines", me.api.get_ShowSnapLines());
 
                 function checkWarns() {
@@ -969,9 +976,6 @@ define([
                 application.getController('Common.Controllers.ExternalMergeEditor').setApi(this.api).loadConfig({config:this.editorConfig, customization: this.editorConfig.customization});
 
                 pluginsController.setApi(me.api);
-                me.requestPlugins('../../../../plugins.json');
-                me.api.asc_registerCallback('asc_onPluginsInit', _.bind(me.updatePluginsList, me));
-                me.api.asc_registerCallback('asc_onPluginsReset', _.bind(me.resetPluginsList, me));
 
                 documentHolderController.setApi(me.api);
                 documentHolderController.createDelayedElements();
@@ -1197,10 +1201,8 @@ define([
                     appHeader.setBranding(this.editorConfig.customization);
 
                 this.appOptions.canRename && appHeader.setCanRename(true);
-
                 this.appOptions.canBrandingExt = params.asc_getCanBranding() && (typeof this.editorConfig.customization == 'object' || this.editorConfig.plugins);
-                if (this.appOptions.canBrandingExt)
+                this.getApplication().getController('Common.Controllers.Plugins').setMode(this.appOptions);
-                    this.updatePlugins(this.plugins, true);
 
                 if (this.appOptions.canComments)
                     Common.NotificationCenter.on('comments:cleardummy', _.bind(this.onClearDummyComment, this));
@@ -1682,6 +1684,7 @@ define([
             },
 
             hidePreloader: function() {
+                var promise;
                 if (!this._state.customizationDone) {
                     this._state.customizationDone = true;
                     if (this.appOptions.customization) {
@@ -1693,14 +1696,17 @@ define([
                     Common.Utils.applyCustomization(this.appOptions.customization, mapCustomizationElements);
                     if (this.appOptions.canBrandingExt) {
                         Common.Utils.applyCustomization(this.appOptions.customization, mapCustomizationExtElements);
-                        Common.Utils.applyCustomizationPlugins(this.UICustomizePlugins);
+                        promise = this.getApplication().getController('Common.Controllers.Plugins').applyUICustomization();
                     }
                 }
-
                 Common.NotificationCenter.trigger('layout:changed', 'main');
-                $('#loading-mask').hide().remove();
 
+                (promise || (new Promise(function(resolve, reject) {
+                    resolve();
+                }))).then(function() {
+                    $('#loading-mask').hide().remove();
                     Common.Controllers.Desktop.process('preloader:hide');
+                });
             },
 
             onDownloadUrl: function(url) {
@@ -1809,7 +1815,6 @@ define([
 
                     _.each(shapes[index], function(shape, idx){
                         store.add({
-                            imageUrl : shape.Image,
                             data     : {shapeType: shape.Type},
                             tip      : me['txtShape_' + shape.Type] || (me.textShape + ' ' + (idx+1)),
                             allowSelected : true,
@@ -1877,7 +1882,10 @@ define([
                 Common.Utils.ThemeColor.setColors(colors, standart_colors);
                 if (window.styles_loaded) {
                     this.updateThemeColors();
-                    this.fillTextArt(this.api.asc_getTextArtPreviews());
+                    var me = this;
+                    setTimeout(function(){
+                        me.fillTextArt(me.api.asc_getTextArtPreviews());
+                    }, 1);
                 }
             },
 
@@ -1947,25 +1955,28 @@ define([
                 this.getApplication().getController('Toolbar').getView().updateMetricUnit();
             },
 
-            onAdvancedOptions: function(advOptions, mode) {
+            onAdvancedOptions: function(type, advOptions, mode, formatOptions) {
                 if (this._state.openDlg) return;
 
-                var type = advOptions.asc_getOptionId(),
+                var me = this;
-                    me = this;
                 if (type == Asc.c_oAscAdvancedOptionsID.TXT) {
                     me._state.openDlg = new Common.Views.OpenDialog({
                         title: Common.Views.OpenDialog.prototype.txtTitle.replace('%1', 'TXT'),
                         closable: (mode==2), // if save settings
                         type: Common.Utils.importTextType.TXT,
-                        preview: advOptions.asc_getOptions().asc_getData(),
+                        preview: advOptions.asc_getData(),
-                        codepages: advOptions.asc_getOptions().asc_getCodePages(),
+                        codepages: advOptions.asc_getCodePages(),
-                        settings: advOptions.asc_getOptions().asc_getRecommendedSettings(),
+                        settings: advOptions.asc_getRecommendedSettings(),
                         api: me.api,
                         handler: function (result, encoding) {
                             me.isShowOpenDialog = false;
                             if (result == 'ok') {
                                 if (me && me.api) {
-                                    me.api.asc_setAdvancedOptions(type, new Asc.asc_CTXTAdvancedOptions(encoding));
+                                    if (mode==2) {
+                                        formatOptions && formatOptions.asc_setAdvancedOptions(new Asc.asc_CTextOptions(encoding));
+                                        me.api.asc_DownloadAs(formatOptions);
+                                    } else
+                                        me.api.asc_setAdvancedOptions(type, new Asc.asc_CTextOptions(encoding));
                                     me.loadMask && me.loadMask.show();
                                 }
                             }
@@ -2004,7 +2015,7 @@ define([
             },
 
             onTryUndoInFastCollaborative: function() {
-                if (!window.localStorage.getBool("de-hide-try-undoredo"))
+                if (!Common.localStorage.getBool("de-hide-try-undoredo"))
                     Common.UI.info({
                         width: 500,
                         msg: this.textTryUndoRedo,
@@ -2014,7 +2025,7 @@ define([
                         customButtonText: this.textStrict,
                         dontshow: true,
                         callback: _.bind(function(btn, dontshow){
-                            if (dontshow) window.localStorage.setItem("de-hide-try-undoredo", 1);
+                            if (dontshow) Common.localStorage.setItem("de-hide-try-undoredo", 1);
                             if (btn == 'custom') {
                                 Common.localStorage.setItem("de-settings-coauthmode", 0);
                                 Common.Utils.InternalSettings.set("de-settings-coauthmode", false);
@@ -2072,7 +2083,7 @@ define([
                 if (!this.appOptions.canPrint || this.isModalShowed) return;
                 
                 if (this.api)
-                    this.api.asc_Print(Common.Utils.isChrome || Common.Utils.isSafari || Common.Utils.isOpera); // if isChrome or isSafari or isOpera == true use asc_onPrintUrl event
+                    this.api.asc_Print(new Asc.asc_CDownloadOptions(null, Common.Utils.isChrome || Common.Utils.isSafari || Common.Utils.isOpera)); // if isChrome or isSafari or isOpera == true use asc_onPrintUrl event
                 Common.component.Analytics.trackEvent('Print');
             },
 
@@ -2092,153 +2103,19 @@ define([
                     this.iframePrint.style.bottom = "0";
                     document.body.appendChild(this.iframePrint);
                     this.iframePrint.onload = function() {
+                        try {
                         me.iframePrint.contentWindow.focus();
                         me.iframePrint.contentWindow.print();
                         me.iframePrint.contentWindow.blur();
                         window.focus();
+                        } catch (e) {
+                            me.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(Asc.c_oAscFileType.PDF));
+                        }
                     };
                 }
                 if (url) this.iframePrint.src = url;
             },
 
-            requestPlugins: function(pluginsPath) { // request plugins
-                if (!pluginsPath) return;
-
-                var config_plugins = (this.plugins && this.plugins.pluginsData && this.plugins.pluginsData.length>0) ? this.updatePlugins(this.plugins, false) : null, // return plugins object
-                    request_plugins = this.updatePlugins( Common.Utils.getConfigJson(pluginsPath), false );
-
-                this.updatePluginsList({
-                    autostart: (config_plugins&&config_plugins.autostart ? config_plugins.autostart : []).concat(request_plugins&&request_plugins.autostart ? request_plugins.autostart : []),
-                    pluginsData: (config_plugins ? config_plugins.pluginsData : []).concat(request_plugins ? request_plugins.pluginsData : [])
-                }, false);
-            },
-
-            updatePlugins: function(plugins, uiCustomize) { // plugins from config
-                if (!plugins) return;
-                
-                var pluginsData = (uiCustomize) ? plugins.UIpluginsData : plugins.pluginsData;
-                if (!pluginsData || pluginsData.length<1) return;
-
-                var arr = [];
-                pluginsData.forEach(function(item){
-                    var value = Common.Utils.getConfigJson(item);
-                    if (value) {
-                        value.baseUrl = item.substring(0, item.lastIndexOf("config.json"));
-                        arr.push(value);
-                    }
-                });
-
-                if (arr.length>0) {
-                    var autostart = plugins.autostart || plugins.autoStartGuid;
-                    if (typeof (autostart) == 'string')
-                        autostart = [autostart];
-                    plugins.autoStartGuid && console.warn("Obsolete: The autoStartGuid parameter is deprecated. Please check the documentation for new plugin connection configuration.");
-
-                    if (uiCustomize)
-                        this.updatePluginsList({
-                            autostart: autostart,
-                            pluginsData: arr
-                        }, !!uiCustomize);
-                    else return {
-                        autostart: autostart,
-                        pluginsData: arr
-                    };
-                }
-            },
-
-            updatePluginsList: function(plugins, uiCustomize) {
-                var pluginStore = this.getApplication().getCollection('Common.Collections.Plugins'),
-                    isEdit = this.appOptions.isEdit;
-                if (plugins) {
-                    var arr = [], arrUI = [],
-                        lang = this.appOptions.lang.split(/[\-\_]/)[0];
-                    plugins.pluginsData.forEach(function(item){
-                        if (_.find(arr, function(arritem) {
-                                return (arritem.get('baseUrl') == item.baseUrl || arritem.get('guid') == item.guid);
-                            }) || pluginStore.findWhere({baseUrl: item.baseUrl}) || pluginStore.findWhere({guid: item.guid}))
-                            return;
-
-                        var variationsArr = [],
-                            pluginVisible = false;
-                        item.variations.forEach(function(itemVar){
-                            var visible = (isEdit || itemVar.isViewer && (itemVar.isDisplayedInViewer!==false)) && _.contains(itemVar.EditorsSupport, 'word') && !itemVar.isSystem;
-                            if ( visible ) pluginVisible = true;
-
-                            if (item.isUICustomizer ) {
-                                visible && arrUI.push(item.baseUrl + itemVar.url);
-                            } else {
-                                var model = new Common.Models.PluginVariation(itemVar);
-                                var description = itemVar.description;
-                                if (typeof itemVar.descriptionLocale == 'object')
-                                    description = itemVar.descriptionLocale[lang] || itemVar.descriptionLocale['en'] || description || '';
-
-                                _.each(itemVar.buttons, function(b, index){
-                                    if (typeof b.textLocale == 'object')
-                                        b.text = b.textLocale[lang] || b.textLocale['en'] || b.text || '';
-                                    b.visible = (isEdit || b.isViewer !== false);
-                                });
-
-                                model.set({
-                                    description: description,
-                                    index: variationsArr.length,
-                                    url: itemVar.url,
-                                    icons: itemVar.icons,
-                                    buttons: itemVar.buttons,
-                                    visible: visible
-                                });
-
-                                variationsArr.push(model);
-                            }
-                        });
-
-                        if (variationsArr.length>0 && !item.isUICustomizer) {
-                            var name = item.name;
-                            if (typeof item.nameLocale == 'object')
-                                name = item.nameLocale[lang] || item.nameLocale['en'] || name || '';
-
-                            arr.push(new Common.Models.Plugin({
-                                name : name,
-                                guid: item.guid,
-                                baseUrl : item.baseUrl,
-                                variations: variationsArr,
-                                currentVariation: 0,
-                                visible: pluginVisible,
-                                groupName: (item.group) ? item.group.name : '',
-                                groupRank: (item.group) ? item.group.rank : 0
-                            }));
-                        }
-                    });
-
-                    if ( uiCustomize!==false )  // from ui customizer in editor config or desktop event
-                        this.UICustomizePlugins = arrUI;
-
-                    if ( !uiCustomize && pluginStore) {
-                        arr = pluginStore.models.concat(arr);
-                        arr.sort(function(a, b){
-                            var rank_a = a.get('groupRank'),
-                                rank_b = b.get('groupRank');
-                            if (rank_a < rank_b)
-                                return (rank_a==0) ? 1 : -1;
-                            if (rank_a > rank_b)
-                                return (rank_b==0) ? -1 : 1;
-                            return 0;
-                        });
-                        pluginStore.reset(arr);
-                        this.appOptions.canPlugins = !pluginStore.isEmpty();
-                    }
-                } else if (!uiCustomize){
-                    this.appOptions.canPlugins = false;
-                }
-                if (!uiCustomize) this.getApplication().getController('LeftMenu').enablePlugins();
-                if (this.appOptions.canPlugins) {
-                    this.getApplication().getController('Common.Controllers.Plugins').setMode(this.appOptions).runAutoStartPlugins(plugins.autostart);
-                }
-            },
-
-            resetPluginsList: function() {
-                this.getApplication().getCollection('Common.Collections.Plugins').reset();
-            },
-
             onClearDummyComment: function() {
                 this.dontCloseDummyComment = false;
             },
@@ -2247,6 +2124,17 @@ define([
                 this.beforeShowDummyComment = true;
             },
 
+            DisableMailMerge: function() {
+                this.appOptions.mergeFolderUrl = "";
+                var toolbarController   = this.getApplication().getController('Toolbar');
+                toolbarController && toolbarController.DisableMailMerge();
+            },
+
+            DisableVersionHistory: function() {
+                this.editorConfig.canUseHistory = false;
+                this.appOptions.canUseHistory = false;
+            },
+
             leavePageText: 'You have unsaved changes in this document. Click \'Stay on this Page\' then \'Save\' to save them. Click \'Leave this Page\' to discard all the unsaved changes.',
             criticalErrorTitle: 'Error',
             notcriticalErrorTitle: 'Warning',

apps/documenteditor/main/app/controller/Statusbar.js

@@ -99,7 +99,7 @@ define([
                 $('.statusbar #label-zoom').css('min-width', 80);
 
                 if ( cfg.isEdit ) {
-                    var review = DE.getController('Common.Controllers.ReviewChanges').getView();
+                    var review = me.getApplication().getController('Common.Controllers.ReviewChanges').getView();
                     if (cfg.canReview) {
                         me.btnTurnReview = review.getButton('turn', 'statusbar');
                         me.btnTurnReview.render(me.statusbar.$layout.find('#btn-doc-review'));

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

@@ -55,7 +55,8 @@ define([
     'documenteditor/main/app/view/PageSizeDialog',
     'documenteditor/main/app/controller/PageLayout',
     'documenteditor/main/app/view/CustomColumnsDialog',
-    'documenteditor/main/app/view/ControlSettingsDialog'
+    'documenteditor/main/app/view/ControlSettingsDialog',
+    'documenteditor/main/app/view/WatermarkSettingsDialog'
 ], function () {
     'use strict';
 
@@ -151,7 +152,7 @@ define([
                         if ( !_format || _supported.indexOf(_format) < 0 )
                             _format = Asc.c_oAscFileType.PDF;
 
-                        _main.api.asc_DownloadAs(_format);
+                        _main.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(_format));
                     },
                     'go:editor': function() {
                         Common.Gateway.requestEditRights();
@@ -304,10 +305,12 @@ define([
             toolbar.btnColumns.menu.on('item:click',                    _.bind(this.onColumnsSelect, this));
             toolbar.btnPageOrient.menu.on('item:click',                 _.bind(this.onPageOrientSelect, this));
             toolbar.btnPageMargins.menu.on('item:click',                _.bind(this.onPageMarginsSelect, this));
+            toolbar.btnWatermark.menu.on('item:click',                  _.bind(this.onWatermarkSelect, this));
             toolbar.btnClearStyle.on('click',                           _.bind(this.onClearStyleClick, this));
             toolbar.btnCopyStyle.on('toggle',                           _.bind(this.onCopyStyleToggle, this));
             toolbar.mnuPageSize.on('item:click',                        _.bind(this.onPageSizeClick, this));
             toolbar.mnuColorSchema.on('item:click',                     _.bind(this.onColorSchemaClick, this));
+            toolbar.mnuColorSchema.on('show:after',                     _.bind(this.onColorSchemaShow, this));
             toolbar.btnMailRecepients.on('click',                       _.bind(this.onSelectRecepientsClick, this));
             toolbar.mnuInsertChartPicker.on('item:click',               _.bind(this.onSelectChart, this));
             toolbar.mnuPageNumberPosPicker.on('item:click',             _.bind(this.onInsertPageNumberClick, this));
@@ -321,6 +324,8 @@ define([
             toolbar.btnInsertEquation.on('click',                       _.bind(this.onInsertEquationClick, this));
             toolbar.mnuNoControlsColor.on('click',                      _.bind(this.onNoControlsColor, this));
             toolbar.mnuControlsColorPicker.on('select',                 _.bind(this.onSelectControlsColor, this));
+            Common.Gateway.on('insertimage',                            _.bind(this.insertImage, this));
+            Common.Gateway.on('setmailmergerecipients',                 _.bind(this.setMailMergeRecipients, this));
             $('#id-toolbar-menu-new-control-color').on('click',         _.bind(this.onNewControlsColor, this));
 
             $('#id-save-style-plus, #id-save-style-link', toolbar.$el).on('click', this.onMenuSaveStyle.bind(this));
@@ -371,6 +376,7 @@ define([
                 this.api.asc_registerCallback('asc_onContextMenu', _.bind(this.onContextMenu, this));
                 this.api.asc_registerCallback('asc_onShowParaMarks', _.bind(this.onShowParaMarks, this));
                 this.api.asc_registerCallback('asc_onChangeSdtGlobalSettings', _.bind(this.onChangeSdtGlobalSettings, this));
+                Common.NotificationCenter.on('fonts:change',                _.bind(this.onApiChangeFont, this));
             } else if (this.mode.isRestrictedEdit) {
                 this.api.asc_registerCallback('asc_onFocusObject', _.bind(this.onApiFocusObjectRestrictedEdit, this));
                 this.api.asc_registerCallback('asc_onCoAuthoringDisconnect', _.bind(this.onApiCoAuthoringDisconnect, this));
@@ -400,6 +406,10 @@ define([
             this.toolbar.collapse();
         },
 
+        onApiChangeFont: function(font) {
+            !this.getApplication().getController('Main').isModalShowed && this.toolbar.cmbFontName.onApiChangeFont(font);
+        },
+
         onApiFontSize: function(size) {
             if (this._state.fontsize !== size) {
                 this.toolbar.cmbFontSize.setValue(size);
@@ -818,6 +828,8 @@ define([
             if ( this.btnsComment && this.btnsComment.length > 0 )
                 this.btnsComment.setDisabled(need_disable);
 
+            toolbar.btnWatermark.setDisabled(header_locked);
+
             this._state.in_equation = in_equation;
         },
 
@@ -957,7 +969,7 @@ define([
 
         onPrint: function(e) {
             if (this.api)
-                this.api.asc_Print(Common.Utils.isChrome || Common.Utils.isSafari || Common.Utils.isOpera); // if isChrome or isSafari or isOpera == true use asc_onPrintUrl event
+                this.api.asc_Print(new Asc.asc_CDownloadOptions(null, Common.Utils.isChrome || Common.Utils.isSafari || Common.Utils.isOpera)); // if isChrome or isSafari or isOpera == true use asc_onPrintUrl event
 
             Common.NotificationCenter.trigger('edit:complete', this.toolbar);
 
@@ -1418,14 +1430,24 @@ define([
                     }
                 })).show();
             } else if (item.value === 'storage') {
+                if (this.toolbar.mode.canRequestInsertImage) {
+                    Common.Gateway.requestInsertImage();
+                } else {
                     (new Common.Views.SelectFileDlg({
                         fileChoiceUrl: this.toolbar.mode.fileChoiceUrl.replace("{fileExt}", "").replace("{documentType}", "ImagesOnly")
                     })).on('selectfile', function(obj, file){
-                    me.toolbar.fireEvent('insertimage', me.toolbar);
+                        me.insertImage(file);
-                    me.api.AddImageUrl(file.url, undefined, true);// for loading from storage
-                    Common.component.Analytics.trackEvent('ToolBar', 'Image');
                     }).show();
                 }
+            }
+        },
+
+        insertImage: function(data) {
+            if (data && data.url) {
+                this.toolbar.fireEvent('insertimage', this.toolbar);
+                this.api.AddImageUrl(data.url, undefined, data.token);// for loading from storage
+                Common.component.Analytics.trackEvent('ToolBar', 'Image');
+            }
         },
 
         onBtnInsertTextClick: function(btn, e) {
@@ -1570,6 +1592,14 @@ define([
             Common.NotificationCenter.trigger('edit:complete', this.toolbar);
         },
 
+        onColorSchemaShow: function(menu) {
+            if (this.api) {
+                var value = this.api.asc_GetCurrentColorSchemeName();
+                var item = _.find(menu.items, function(item) { return item.value == value; });
+                (item) ? item.setChecked(true) : menu.clearAll();
+            }
+        },
+
         onDropCapSelect: function(menu, item) {
             if (_.isUndefined(item.value))
                 return;
@@ -1900,6 +1930,41 @@ define([
             Common.component.Analytics.trackEvent('ToolBar', 'Blank Page');
         },
 
+        onWatermarkSelect: function(menu, item) {
+            if (this.api) {
+                if (item.value == 'remove')
+                    this.api.asc_WatermarkRemove();
+                else {
+                    var me = this;
+                    if (_.isUndefined(me.fontstore)) {
+                        me.fontstore = new Common.Collections.Fonts();
+                        var fonts = me.toolbar.cmbFontName.store.toJSON();
+                        var arr = [];
+                        _.each(fonts, function(font, index){
+                            if (!font.cloneid) {
+                                arr.push(_.clone(font));
+                            }
+                        });
+                        me.fontstore.add(arr);
+                    }
+
+                    (new DE.Views.WatermarkSettingsDialog({
+                        props: me.api.asc_GetWatermarkProps(),
+                        api: me.api,
+                        fontStore: me.fontstore,
+                        handler: function(result, value) {
+                            if (result == 'ok') {
+                                me.api.asc_SetWatermarkProps(value);
+                            }
+                            Common.NotificationCenter.trigger('edit:complete', me.toolbar);
+                        }
+                    })).show();
+                }
+                Common.NotificationCenter.trigger('edit:complete', this.toolbar);
+                Common.component.Analytics.trackEvent('ToolBar', 'Edit ' + item.value);
+            }
+        },
+
         onListStyleSelect: function(combo, record) {
             this._state.prstyle = undefined;
             if (this.api)
@@ -2281,7 +2346,7 @@ define([
                     store: shapeGroup.get('groupStore'),
                     parentMenu: menuItem.menu,
                     showLast: false,
-                    itemTemplate: _.template('<div class="item-shape"><img src="<%= imageUrl %>" id="<%= id %>"></div>')
+                    itemTemplate: _.template('<div class="item-shape" id="<%= id %>"><svg width="20" height="20" class=\"icon\"><use xlink:href=\"#svg-icon-<%= data.shapeType %>\"></use></svg></div>')
                 });
 
                 shapePicker.on('item:click', function(picker, item, record, e) {
@@ -2550,7 +2615,7 @@ define([
             this.toolbar.btnRedo.setDisabled(this._state.can_redo!==true);
             this.toolbar.btnCopy.setDisabled(this._state.can_copycut!==true);
             this.toolbar.btnPrint.setDisabled(!this.toolbar.mode.canPrint);
-            if (this.toolbar.mode.fileChoiceUrl)
+            if (!this._state.mmdisable && (this.toolbar.mode.fileChoiceUrl || this.toolbar.mode.canRequestMailMergeRecipients))
                 this.toolbar.btnMailRecepients.setDisabled(false);
             this._state.activated = true;
 
@@ -2558,6 +2623,11 @@ define([
             this.onApiPageSize(props.get_W(), props.get_H());
         },
 
+        DisableMailMerge: function() {
+            this._state.mmdisable = true;
+            this.toolbar && this.toolbar.btnMailRecepients && this.toolbar.btnMailRecepients.setDisabled(true);
+        },
+
         updateThemeColors: function() {
             var updateColors = function(picker, defaultColorIndex) {
                 if (picker) {
@@ -2616,17 +2686,17 @@ define([
                 return;
             }
 
-            listStyles.menuPicker.store.reset([]); // remove all
+            var arr = [];
-
             var mainController = this.getApplication().getController('Main');
             _.each(styles.get_MergedStyles(), function(style){
-                listStyles.menuPicker.store.add({
+                arr.push({
                     imageUrl: style.asc_getImage(),
                     title   : style.get_Name(),
                     tip     : mainController.translationTable[style.get_Name()] || style.get_Name(),
                     id      : Common.UI.getId()
                 });
             });
+            listStyles.menuPicker.store.reset(arr); // remove all
 
             if (listStyles.menuPicker.store.length > 0 && listStyles.rendered){
                 var styleRec;
@@ -2748,22 +2818,28 @@ define([
         onSelectRecepientsClick: function() {
             if (this._mailMergeDlg) return;
 
+            if (this.toolbar.mode.canRequestMailMergeRecipients) {
+                Common.Gateway.requestMailMergeRecipients();
+            } else {
                 var me = this;
                 me._mailMergeDlg = new Common.Views.SelectFileDlg({
                     fileChoiceUrl: this.toolbar.mode.fileChoiceUrl.replace("{fileExt}", "xlsx").replace("{documentType}", "")
                 });
                 me._mailMergeDlg.on('selectfile', function(obj, recepients){
-                me.api.asc_StartMailMerge(recepients);
+                    me.setMailMergeRecipients(recepients);
-                if (!me.mergeEditor)
-                    me.mergeEditor = me.getApplication().getController('Common.Controllers.ExternalMergeEditor').getView('Common.Views.ExternalMergeEditor');
-                if (me.mergeEditor)
-                    me.mergeEditor.setEditMode(false);
-
                 }).on('close', function(obj){
                     me._mailMergeDlg = undefined;
                 });
-
                 me._mailMergeDlg.show();
+            }
+        },
+
+        setMailMergeRecipients: function(recepients) {
+            this.api.asc_StartMailMerge(recepients);
+            if (!this.mergeEditor)
+                this.mergeEditor = this.getApplication().getController('Common.Controllers.ExternalMergeEditor').getView('Common.Views.ExternalMergeEditor');
+            if (this.mergeEditor)
+                this.mergeEditor.setEditMode(false);
         },
 
         createDelayedElements: function() {
@@ -2827,22 +2903,7 @@ define([
             me.appOptions = config;
 
             if ( config.canCoAuthoring && config.canComments ) {
-                this.btnsComment = createButtonSet();
+                this.btnsComment = Common.Utils.injectButtons(this.toolbar.$el.find('.slot-comment'), 'tlbtn-addcomment-', 'btn-menu-comments', this.toolbar.capBtnComment);
-                var slots = me.toolbar.$el.find('.slot-comment');
-                slots.each(function(index, el) {
-                    var _cls = 'btn-toolbar';
-                    /x-huge/.test(el.className) && (_cls += ' x-huge icon-top');
-
-                    var button = new Common.UI.Button({
-                        id: 'tlbtn-addcomment-' + index,
-                        cls: _cls,
-                        iconCls: 'btn-menu-comments',
-                        caption: me.toolbar.capBtnComment
-                    }).render( slots.eq(index) );
-
-                    me.btnsComment.add(button);
-                });
-
                 if ( this.btnsComment.length ) {
                     var _comments = DE.getController('Common.Controllers.Comments').getView();
                     this.btnsComment.forEach(function (btn) {

apps/documenteditor/main/app/controller/Viewport.js

@@ -154,6 +154,8 @@ define([
             var $filemenu = $('.toolbar-fullview-panel');
             $filemenu.css('top', _intvars.get('toolbar-height-tabs'));
 
+            me.viewport.$el.attr('applang', me.appConfig.lang.split(/[\-_]/)[0]);
+
             if ( !config.isEdit ||
                 ( !Common.localStorage.itemExists("de-compact-toolbar") &&
                 config.customization && config.customization.compactToolbar )) {

apps/documenteditor/main/app/template/ParagraphSettingsAdvanced.template

@@ -1,23 +1,66 @@
 <div id="id-adv-paragraph-indents" class="settings-panel active">
     <div class="inner-content">
-        <table cols="3" style="width: 100%;">
+            <div>
-            <tr>
+                <div class="padding-large" style="display: inline-block;">
-                <td class="padding-large">
+                    <label class="input-label"><%= scope.textAlign %></label>
-                    <label class="input-label"><%= scope.strIndentsFirstLine %></label>
+                    <div id="paragraphadv-spin-text-alignment"></div>
-                    <div id="paragraphadv-spin-first-line" style="width: 85px;"></div>
+                </div>
-                </td>
+                <div class="padding-large text-only" style="float: right;">
-                <td class="padding-large">
+                    <label class="input-label"><%= scope.strIndentsOutlinelevel %></label>
+                    <div id="paragraphadv-spin-outline-level"></div>
+                </div>
+            </div>
+            <div><label class="header" style="padding-bottom: 4px;"><%= scope.strIndent %></label></div>
+            <div>
+                <div class="padding-large" style="display: inline-block;">
                     <label class="input-label"><%= scope.strIndentsLeftText %></label>
                     <div id="paragraphadv-spin-indent-left"></div>
-                </td>
+                </div>
-                <td class="padding-large">
+                <div class="padding-large" style="display: inline-block;">
                     <label class="input-label"><%= scope.strIndentsRightText %></label>
                     <div id="paragraphadv-spin-indent-right"></div>
-                </td>
-            </tr>
-        </table>
                 </div>
-    <div class="separator horizontal padding-large text-only"></div>
+                <div class="padding-large" style="display: inline-block;">
+                    <div>
+                        <label class="input-label"><%= scope.strIndentsSpecial %></label>
+                    </div>
+                    <div>
+                        <div id="paragraphadv-spin-special" style="display: inline-block;"></div>
+                        <div id="paragraphadv-spin-special-by" style="display: inline-block;"></div>
+                    </div>
+                </div>
+            </div>
+            <div><label class="header" style="padding-bottom: 4px;"><%= scope.strSpacing %></label></div>
+            <div>
+                <div style="display: inline-block;">
+                    <label class="input-label"><%= scope.strIndentsSpacingBefore %></label>
+                    <div id="paragraphadv-spin-spacing-before"></div>
+                </div>
+                <div style="display: inline-block;">
+                    <label class="input-label"><%= scope.strIndentsSpacingAfter %></label>
+                    <div id="paragraphadv-spin-spacing-after"></div>
+                </div>
+                <div style="display: inline-block;">
+                    <div>
+                        <label class="input-label"><%= scope.strIndentsLineSpacing %></label>
+                    </div>
+                    <div>
+                        <div id="paragraphadv-spin-line-rule" style="display: inline-block;"></div>
+                        <div id="paragraphadv-spin-line-height" style="display: inline-block;"></div>
+                    </div>
+                </div>
+            </div>
+            <div class="text-only" style="padding-top: 8px;">
+                <div id="paragraphadv-checkbox-add-interval"></div>
+            </div>
+            <div class="padding-large" style="padding-top: 16px; display: none;">
+                <div style="border: 1px solid #cbcbcb; width: 350px;">
+                    <div id="paragraphadv-indent-preview" style="height: 58px; position: relative;"></div>
+                </div>
+            </div>
+    </div>
+</div>
+<div id="id-adv-paragraph-line" class="settings-panel">
     <div class="inner-content text-only" style="padding-right: 0px;" >
         <table cols="2" style="width: 100%;">
             <tr>
@@ -44,15 +87,15 @@
         <div style="width: 100%;" class="padding-small">
             <label class="input-label"><%= scope.textBorderWidth %></label>
             <div id="paragraphadv-combo-border-size" style="display: inline-block; vertical-align: middle; width: 93px;"></div>
-            <div style="display: inline-block; float:right;vertical-align: middle;">
+            <div style="display: inline-block; vertical-align: middle; padding-left: 20px;">
                 <label class="input-label" ><%= scope.textBorderColor %></label>
                 <div id="paragraphadv-border-color-btn" style="display: inline-block;"></div>
             </div>
         </div>
         <label class="input-label padding-small" style="width: 100%;"><%= scope.textBorderDesc %></label>
         <div style="width: 100%;" class="padding-large">
-            <div id="id-deparagraphstyler" style="display: inline-block; vertical-align: middle; width: 200px; height: 170px;outline: 1px solid #ccc;"></div>
+            <div id="id-deparagraphstyler" style="display: inline-block; vertical-align: middle; width: 200px; height: 170px;outline: 1px solid #ccc; margin-top: 2px;"></div>
-            <div style="display: inline-block; float:right;vertical-align: middle; width: 76px; text-align: right; height: 170px; padding-top: 10px;">
+            <div style="display: inline-block; vertical-align: top; width: 76px; text-align: right; height: 170px; padding-top: 0px; margin-left: 9px;">
                 <div id="paragraphadv-button-border-top" style="display: inline-block;"></div>
                 <div id="paragraphadv-button-border-inner-hor" style="display: inline-block;"></div>
                 <div id="paragraphadv-button-border-bottom" style="display: inline-block;"></div>
@@ -70,76 +113,53 @@
     </div>
 </div>
 <div id="id-adv-paragraph-font" class="settings-panel">
-    <div class="inner-content">
+    <div class="inner-content" style="width: 100%;">
-        <table cols="2" style="width: 100%;">
+        <div class="padding-small">
-            <tr>
-                <td colspan=2 class="padding-small">
             <label class="header"><%= scope.textEffects %></label>
-                </td>
+        </div>
-            </tr>
+        <div>
-            <tr>
+            <div class="padding-large" style="display: inline-block;">
-                <td class="padding-small">
+                <div class="padding-small" id="paragraphadv-checkbox-strike"></div>
-                    <div id="paragraphadv-checkbox-strike"></div>
+                <div class="padding-small" id="paragraphadv-checkbox-double-strike"></div>
-                </td>
-                <td class="padding-small">
-                    <div id="paragraphadv-checkbox-subscript"></div>
-                </td>
-            </tr>
-            <tr>
-                <td class="padding-small">
-                    <div id="paragraphadv-checkbox-double-strike"></div>
-                </td>
-                <td class="padding-small">
-                    <div id="paragraphadv-checkbox-small-caps"></div>
-                </td>
-            </tr>
-            <tr>
-                <td class="padding-large">
                 <div id="paragraphadv-checkbox-superscript"></div>
-                </td>
+            </div>
-                <td class="padding-large">
+            <div class="padding-large" style="display: inline-block; padding-left: 40px;">
+                <div class="padding-small" id="paragraphadv-checkbox-subscript"></div>
+                <div class="padding-small" id="paragraphadv-checkbox-small-caps"></div>
                 <div id="paragraphadv-checkbox-all-caps"></div>
-                </td>
+            </div>
-            </tr>
+        </div>
-            <tr>
+            <div class="padding-small">
-                <td colspan=2 class="padding-small">
                 <label class="header"><%= scope.textCharacterSpacing %></label>
-                </td>
+            </div>
-            </tr>
+            <div class="padding-large">
-            <tr>
+                <div style="display: inline-block;">
-                <td class="padding-large" width="50%">
                     <label class="input-label"><%= scope.textSpacing %></label>
                     <div id="paragraphadv-spin-spacing"></div>
-                </td>
+                </div>
-                <td class="padding-large text-only" width="50%">
+                <div class="text-only" style="display: inline-block; margin-left: 15px;">
                     <label class="input-label"><%= scope.textPosition %></label>
                     <div id="paragraphadv-spin-position"></div>
-                </td>
-            </tr>
-            <tr>
-                <td colspan=2>
-                    <div style="border: 1px solid #cbcbcb;">
-                        <div id="paragraphadv-font-img" style="width: 300px; height: 80px; position: relative;"></div>
                 </div>
-                </td>
+            </div>
-            </tr>
+            <div style="border: 1px solid #cbcbcb;">
-        </table>
+                <div id="paragraphadv-font-img" style="width: 300px; height: 80px; position: relative; margin: 0 auto;"></div>
+            </div>
     </div>
 </div>
 <div id="id-adv-paragraph-tabs" class="settings-panel">
     <div class="inner-content">
-        <div class="padding-small" style="display: inline-block;">
+            <div class="padding-large">
+                <label class="input-label"><%= scope.textDefault %></label>
+                <div id="paraadv-spin-default-tab"></div>
+
+            </div>
+            <div>
+                <div class="padding-large" style="display: inline-block; margin-right: 9px;">
                     <label class="input-label"><%= scope.textTabPosition %></label>
                     <div id="paraadv-spin-tab"></div>
                 </div>
-        <div class="padding-small" style="display: inline-block; float: right;">
+                <div class="padding-large" style=" display: inline-block; margin-right: 9px;">
-            <label class="input-label"><%= scope.textDefault %></label>
-            <div id="paraadv-spin-default-tab"></div>
-        </div>
-        <div class="padding-large">
-            <div id="paraadv-list-tabs" style="width:180px; height: 94px;"></div>
-        </div>
-        <div class="padding-large" style="display: inline-block;margin-right: 7px;">
                     <label class="input-label"><%= scope.textAlign %></label>
                     <div id="paraadv-cmb-align"></div>
                 </div>
@@ -147,37 +167,40 @@
                     <label class="input-label"><%= scope.textLeader %></label>
                     <div id="paraadv-cmb-leader"></div>
                 </div>
-        <div style="margin-bottom: 45px;"></div>
+            </div>
             <div>
-            <button type="button" class="btn btn-text-default" id="paraadv-button-add-tab" style="width:90px;margin-right: 4px;"><%= scope.textSet %></button>
+                <div colspan=3 class="padding-large">
-            <button type="button" class="btn btn-text-default" id="paraadv-button-remove-tab" style="width:90px;margin-right: 4px;"><%= scope.textRemove %></button>
+                     <div id="paraadv-list-tabs" style="width:348px; height: 110px;"></div>
-            <button type="button" class="btn btn-text-default" id="paraadv-button-remove-all" style="width:90px;margin-right: 4px;"><%= scope.textRemoveAll %></button>
+                </div>
+            </div>
+            <div>
+                <button type="button" class="btn btn-text-default" id="paraadv-button-add-tab" style="width:108px;margin-right: 9px; display: inline-block;"><%= scope.textSet %></button>
+                <button type="button" class="btn btn-text-default" id="paraadv-button-remove-tab" style="width:108px;margin-right: 9px; display: inline-block;"><%= scope.textRemove %></button>
+                <button type="button" class="btn btn-text-default" id="paraadv-button-remove-all" style="width:108px;display: inline-block;"><%= scope.textRemoveAll %></button>
             </div>
     </div>
 </div>
 <div id="id-adv-paragraph-margins" class="settings-panel">
     <div class="inner-content">
-        <table cols="2" style="width: 100%;">
+            <div>
-            <tr>
+                <div class="padding-small" style="display: inline-block;">
-                <td class="padding-small" width="50%">
                     <label class="input-label"><%= scope.textTop %></label>
                     <div id="paraadv-number-margin-top"></div>
-                </td>
+                </div>
-                <td class="padding-small" width="50%">
+                <div class="padding-small" style="display: inline-block; padding-left: 15px;">
                     <label class="input-label"><%= scope.textLeft %></label>
                     <div id="paraadv-number-margin-left"></div>
-                </td>
+                </div>
-            </tr>
+            </div>
-            <tr>
+            <div>
-                <td class="padding-small" width="50%">
+                <div class="padding-small" style="display: inline-block;">
                     <label class="input-label"><%= scope.textBottom %></label>
                     <div id="paraadv-number-margin-bottom"></div>
-                </td>
+                </div>
-                <td class="padding-small" width="50%">
+                <div class="padding-small" style="display: inline-block; padding-left: 15px;">
                     <label class="input-label"><%= scope.textRight %></label>
                     <div id="paraadv-number-margin-right"></div>
-                </td>
+                </div>
-            </tr>
+            </div>
-        </table>
     </div>
 </div>

apps/documenteditor/main/app/template/ShapeSettings.template

@@ -177,6 +177,16 @@
             <div id="shape-btn-change" style="display: inline-block; float:right;"></div>
         </td>
     </tr>
+    <tr>
+        <td class="padding-small" colspan=2>
+            <div class="separator horizontal"></div>
+        </td>
+    </tr>
+    <tr>
+        <td class="padding-small" colspan=2>
+            <div id="shape-checkbox-shadow"></div>
+        </td>
+    </tr>
     <tr class="shape-only">
         <td class="padding-small">
             <div class="separator horizontal"></div>

apps/documenteditor/main/app/template/Toolbar.template

@@ -134,6 +134,10 @@
                     <span class="btn-slot text x-huge" id="slot-img-movebkwd"></span>
                     <span class="btn-slot text x-huge" id="slot-img-wrapping"></span>
                 </div>
+                <div class="separator long"></div>
+                <div class="group">
+                    <span class="btn-slot text x-huge" id="slot-btn-watermark"></span>
+                </div>
             </section>
             <section class="panel" data-tab="links">
                 <div class="group">

apps/documenteditor/main/app/template/WatermarkSettings.template

@@ -0,0 +1,71 @@
+<table cols="1">
+    <tr><td class="padding-small">
+        <div id="watermark-radio-none"></div>
+    </td></tr>
+    <tr><td class="padding-small">
+        <div id="watermark-radio-text"></div>
+    </td></tr>
+    <tr><td class="padding-large">
+        <table id="watermark-tbl-text" cols="2" style="margin-left: 22px;">
+            <tr>
+                <td class="padding-small" style="width: 142px;">
+                    <label  style="display:block;" class="input-label"><%= scope.textLanguage %></label>
+                    <div id="watermark-combo-lang" style="width: 100%;"></div>
+                </td>
+                <td class="padding-small" style="width: 215px; padding-left: 5px;">
+                    <label  style="display:block;" class="input-label"><%= scope.textText %></label>
+                    <div id="watermark-combo-text" style="width: 100%;"></div>
+                </td>
+            </tr>
+            <tr>
+                <td class="padding-large" colspan="2">
+                    <label  style="display:block;" class="input-label"><%= scope.textFont %></label>
+                    <div id="watermark-fonts" class="input-row" style="display: inline-block; vertical-align: middle;"></div>
+                    <div id="watermark-font-size" class="input-row" style="display: inline-block; vertical-align: middle; margin-left: 2px;"></div>
+                    <div id="watermark-textcolor" style="display: inline-block;margin-left: 6px;"></div>
+                    <div id="watermark-bold" style="display: inline-block;margin-left: 2px;"></div><div id="watermark-italic" style="display: inline-block;margin-left: 6px;"></div>
+                    <div id="watermark-underline" style="display: inline-block;margin-left: 6px;"></div><div id="watermark-strikeout" style="display: inline-block;margin-left: 6px;"></div>
+                </td>
+            </tr>
+            <tr>
+                <td class="padding-small" colspan="2">
+                    <div id="watermark-chb-transparency"></div>
+                </td>
+            </tr>
+            <tr>
+                <td colspan="2">
+                    <label style="display:block;margin-bottom: 3px;"><%= scope.textLayout %></label>
+                    <div id="watermark-radio-diag" style="display: inline-block;"></div>
+                    <div id="watermark-radio-hor" style="display: inline-block;margin-left: 15px;"></div>
+                </td>
+            </tr>
+        </table>
+    </td></tr>
+    <tr><td class="padding-small">
+        <div id="watermark-radio-image"></div>
+    </td></tr>
+    <tr><td class="padding-small">
+        <table id="watermark-tbl-image" cols="3" style="margin-left: 22px;">
+            <tr>
+                <td style="vertical-align: top;">
+                    <button type="button" class="btn btn-text-default" id="watermark-from-file" style="width:90px;"><%= scope.textFromFile %></button>
+                </td>
+                <td style="vertical-align: top;">
+                    <button type="button" class="btn btn-text-default" id="watermark-from-url" style="width:90px;margin-left: 15px;"><%= scope.textFromUrl %></button>
+                </td>
+                <td rowspan="2">
+                    <div style="width: 80px; height: 70px; padding: 9px 14px; border: 1px solid #AFAFAF; border-radius: 2px; background: #ffffff;margin-left: 15px;">
+                        <div id="watermark-texture-img" style="width: 50px;height: 50px;"></div>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td style="vertical-align: bottom;">
+                    <label class="input-label" style=""><%= scope.textScale %></label>
+                    <div id="watermark-combo-scale" style="width: 90px;"></div>
+                </td>
+                <td></td>
+            </tr>
+            </table>
+    </td></tr>
+</table>

apps/documenteditor/main/app/view/BookmarksDialog.js

@@ -314,9 +314,7 @@ define([
 
         gotoBookmark: function(btn, eOpts){
             var rec = this.bookmarksList.getSelectedRec();
-            if (rec.length>0) {
+            rec && this.props.asc_SelectBookmark(rec.get('value'));
-                this.props.asc_SelectBookmark(rec[0].get('value'));
-            }
         },
 
         addBookmark: function(btn, eOpts){
@@ -333,11 +331,11 @@ define([
 
         deleteBookmark: function(btn, eOpts){
             var rec = this.bookmarksList.getSelectedRec();
-            if (rec.length>0) {
+            if (rec) {
-                this.props.asc_RemoveBookmark(rec[0].get('value'));
+                this.props.asc_RemoveBookmark(rec.get('value'));
                 var store = this.bookmarksList.store;
-                var idx = _.indexOf(store.models, rec[0]);
+                var idx = _.indexOf(store.models, rec);
-                store.remove(rec[0]);
+                store.remove(rec);
                 this.txtName.setValue('');
                 this.btnAdd.setDisabled(true);
                 this.btnGoto.setDisabled(true);
@@ -350,13 +348,11 @@ define([
             if (btn.cmpEl && btn.cmpEl.parent().hasClass('open')) return;
 
             var rec = this.bookmarksList.getSelectedRec();
-            if (rec.length>0) {
+            rec && Common.Gateway.requestMakeActionLink({
-                Common.Gateway.requestMakeActionLink({
                                                             action: {
-                                                            type: "bookmark", data: rec[0].get('value')
+                                                                type: "bookmark", data: rec.get('value')
                                                             }
                                                         });
-            }
         },
 
         onRadioSort: function(field, newValue, eOpts) {

apps/documenteditor/main/app/view/ChartSettings.js

@@ -167,7 +167,7 @@ define([
 
                         if (this._isChartStylesChanged) {
                             if (rec)
-                                this.cmbChartStyle.fillComboView(this.cmbChartStyle.menuPicker.getSelectedRec()[0],true);
+                                this.cmbChartStyle.fillComboView(this.cmbChartStyle.menuPicker.getSelectedRec(),true);
                             else
                                 this.cmbChartStyle.fillComboView(this.cmbChartStyle.menuPicker.store.at(0), true);
                         }
@@ -486,16 +486,16 @@ define([
                     if (count>0 && count==styles.length) {
                         var data = stylesStore.models;
                         _.each(styles, function(style, index){
-                            data[index].set('imageUrl', style.asc_getImageUrl());
+                            data[index].set('imageUrl', style.asc_getImage());
                         });
                     } else {
                         var stylearray = [],
                             selectedIdx = -1;
                         _.each(styles, function(item, index){
                             stylearray.push({
-                                imageUrl: item.asc_getImageUrl(),
+                                imageUrl: item.asc_getImage(),
-                                data    : item.asc_getStyle(),
+                                data    : item.asc_getName(),
-                                tip     : me.textStyle + ' ' + item.asc_getStyle()
+                                tip     : me.textStyle + ' ' + item.asc_getName()
                             });
                         });
                         stylesStore.reset(stylearray, {silent: false});