diff --git a/apps/common/main/resources/less/advanced-settings-window.less b/apps/common/main/resources/less/advanced-settings-window.less index bd448746e..49085e69c 100644 --- a/apps/common/main/resources/less/advanced-settings-window.less +++ b/apps/common/main/resources/less/advanced-settings-window.less @@ -52,41 +52,4 @@ padding-right: 30px; } } - - .range-tableview { - .list-item > div{ - vertical-align: middle; - display: inline-block; - text-overflow: ellipsis; - overflow: hidden; - white-space: pre; - } - - .listitem-icon { - width: 20px; - height: 20px; - vertical-align: middle; - margin-right: 5px; - } - - .selected { - .listitem-icon { - background-position-x: -20px; - background-position-x: @button-small-active-icon-offset-x; - } - } - - .lock-user { - position: absolute; - right: 2px; - min-width: 100px; - max-width: 150px; - height: 20px; - padding: 2px 10px; - background-color: #EE3525; - color: #fff; - text-align: center; - } - } - } \ No newline at end of file diff --git a/apps/documenteditor/main/app/controller/FormsTab.js b/apps/documenteditor/main/app/controller/FormsTab.js index adfed2b58..8dfacfe1a 100644 --- a/apps/documenteditor/main/app/controller/FormsTab.js +++ b/apps/documenteditor/main/app/controller/FormsTab.js @@ -423,7 +423,11 @@ define([ Common.component.Analytics.trackEvent('ToolBar', 'Roles Manager'); Common.NotificationCenter.trigger('edit:complete', me.toolbar); }, - roles: [], + roles: [ + {name: 'employee 1', color: Common.Utils.ThemeColor.getRgbColor('ff0000'), fields: 5}, + {name: 'employee 2', color: Common.Utils.ThemeColor.getRgbColor('00ff00'), fields: 1}, + {name: 'manager', color: null, fields: 10} + ], props : undefined })).on('close', function(win){ }).show(); diff --git a/apps/documenteditor/main/app/template/RolesManagerDlg.template b/apps/documenteditor/main/app/template/RolesManagerDlg.template index 345fc1bb1..3a618452f 100644 --- a/apps/documenteditor/main/app/template/RolesManagerDlg.template +++ b/apps/documenteditor/main/app/template/RolesManagerDlg.template @@ -12,7 +12,7 @@ -
+
diff --git a/apps/documenteditor/main/app/view/FormsTab.js b/apps/documenteditor/main/app/view/FormsTab.js index c611cd109..37d2d7355 100644 --- a/apps/documenteditor/main/app/view/FormsTab.js +++ b/apps/documenteditor/main/app/view/FormsTab.js @@ -211,7 +211,6 @@ define([ iconCls: 'toolbar__icon btn-ic-sharing', lock: [ _set.previewReviewMode, _set.viewFormMode, _set.lostConnect, _set.disableOnStart], caption: this.capBtnManager, - enableToggle: true, dataHint: '1', dataHintDirection: 'bottom', dataHintOffset: 'small' diff --git a/apps/documenteditor/main/app/view/RoleEditDlg.js b/apps/documenteditor/main/app/view/RoleEditDlg.js new file mode 100644 index 000000000..eac2afc6a --- /dev/null +++ b/apps/documenteditor/main/app/view/RoleEditDlg.js @@ -0,0 +1,206 @@ +/* + * + * (c) Copyright Ascensio System SIA 2010-2022 + * + * 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 + * +*/ +/** + * RoleEditDlg.js + * + * Created by Julia Radzhabova on 13/04/22 + * Copyright (c) 2022 Ascensio System SIA. All rights reserved. + * + */ + +define([ + 'common/main/lib/component/Window', + 'common/main/lib/component/InputField' +], function () { 'use strict'; + + DE.Views.RoleEditDlg = Common.UI.Window.extend(_.extend({ + options: { + width: 330, + cls: 'modal-dlg', + buttons: ['ok', 'cancel'] + }, + + initialize : function(options) { + _.extend(this.options, options || {}); + + this.template = [ + '
', + '', + '', + '', + '', + '', + '
', + '', + '
', + '
', + '', + '
', + '
', + '
' + ].join(''); + + this.options.tpl = _.template(this.template)(this.options); + this.props = this.options.props; + this.lastColor = 'C9C8FF'; + + Common.UI.Window.prototype.initialize.call(this, this.options); + }, + + render: function() { + Common.UI.Window.prototype.render.call(this); + + var me = this; + var $window = this.getChild(); + $window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this)); + + me.inputName = new Common.UI.InputField({ + el : $window.find('#id-dlg-role-name'), + allowBlank : false, + blankError : me.textEmptyError, + style : 'width: 100%;', + validateOnBlur: false, + validation : function(value) { + return value ? true : ''; + } + }); + + this.btnColor = new Common.UI.ColorButton({ + parentEl: $window.find('#id-dlg-role-color'), + additionalItems: [ this.mnuNoFormsColor = new Common.UI.MenuItem({ + id: 'id-dlg-role-menu-no-highlight', + caption: this.textNoHighlight, + checkable: true, + style: 'padding-left: 20px;' + }), + {caption: '--'}], + additionalAlign: this.menuAddAlign, + colors: ['000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333', '800000', 'FF6600', + '808000', '00FF00', '008080', '0000FF', '666699', '808080', 'FF0000', 'FF9900', '99CC00', '339966', + '33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', + '993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', 'C9C8FF', 'CC99FF', 'FFFFFF' + ], + color: this.lastColor, + paletteHeight: 94, + cls: 'move-focus', + takeFocusOnClose: true + }); + this.btnColor.on('color:select', _.bind(this.onColorsSelect, this)); + this.mnuNoFormsColor.on('click', _.bind(this.onNoColorClick, this)); + this.mnuColorPicker = this.btnColor.getPicker(); + + this.afterRender(); + }, + + afterRender: function() { + this.setSettings(this.props); + this.setTitle((this.isEdit) ? this.txtTitleEdit : this.txtTitleNew); + }, + + show: function() { + Common.UI.Window.prototype.show.apply(this, arguments); + }, + + setSettings: function (props) { + if (props) { + var clr = props.color, + show = !!clr; + this.mnuNoFormsColor.setChecked(!show, true); + this.mnuColorPicker.clearSelection(); + if (clr) { + clr = Common.Utils.ThemeColor.getHexColor(clr.get_r(), clr.get_g(), clr.get_b()); + this.mnuColorPicker.selectByRGB(clr, true); + this.lastColor = clr; + } + this.btnColor.setColor(clr || 'transparent'); + + this.inputName.setValue(props.name || ''); + } + }, + + getSettings: function() { + return {name: this.inputName.getValue(), color: this.mnuNoFormsColor.isChecked() ? null : Common.Utils.ThemeColor.getRgbColor(this.lastColor)}; + }, + + onColorsSelect: function(btn, color) { + this.lastColor = color; + this.mnuNoFormsColor.setChecked(false, true); + }, + + onNoColorClick: function(item) { + if (!item.isChecked()) { + this.btnColor.setColor(this.lastColor); + this.mnuColorPicker.selectByRGB(this.lastColor, true); + } else { + this.mnuColorPicker.clearSelection(); + } + }, + + onPrimary: function(event) { + this._handleInput('ok'); + return false; + }, + + onBtnClick: function(event) { + this._handleInput(event.currentTarget.attributes['result'].value); + }, + + getFocusedComponents: function() { + return [this.btnColor, this.inputName]; + }, + + getDefaultFocusableComponent: function () { + return this.inputName; + }, + + _handleInput: function(state) { + if (this.options.handler) { + if (state == 'ok') { + if (this.inputName.checkValidate() !== true) { + this.inputName.cmpEl.find('input').focus(); + return; + } + } + + this.options.handler.call(this, state, (state == 'ok') ? this.getSettings() : undefined); + } + + this.close(); + }, + txtTitleEdit: 'Edit Role', + txtTitleNew: 'Create New Role', + textName: 'Role name', + textEmptyError: 'Role name must not be empty.', + textNoHighlight: 'No highlighting' + }, DE.Views.RoleEditDlg || {})); +}); \ No newline at end of file diff --git a/apps/documenteditor/main/app/view/RolesManagerDlg.js b/apps/documenteditor/main/app/view/RolesManagerDlg.js index e8380d6a5..173377ece 100644 --- a/apps/documenteditor/main/app/view/RolesManagerDlg.js +++ b/apps/documenteditor/main/app/view/RolesManagerDlg.js @@ -42,7 +42,7 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template', 'common/main/lib/view/AdvancedSettingsWindow', 'common/main/lib/component/ListView', - // 'documenteditor/main/app/view/RoleEditDlg' + 'documenteditor/main/app/view/RoleEditDlg' ], function (contentTemplate) { 'use strict'; @@ -51,7 +51,7 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template', DE.Views.RolesManagerDlg = Common.Views.AdvancedSettingsWindow.extend(_.extend({ options: { alias: 'RolesManagerDlg', - contentWidth: 525, + contentWidth: 500, height: 353, buttons: null }, @@ -76,8 +76,6 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template', this.props = options.props; this.roles = options.roles; - this.rolesStore = new Common.UI.DataViewStore(); - this.wrapEvents = { onRefreshRolesList: _.bind(this.onRefreshRolesList, this) }; @@ -93,24 +91,18 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template', store: new Common.UI.DataViewStore(), emptyText: this.textEmpty, itemTemplate: _.template([ - '
', - '
">
', - '
<%= Common.Utils.String.htmlEncode(name) %>
', - '
<%= scopeName %>
', - '
<%= range %>
', - '<% if (lock) { %>', - '
<%=lockuser%>
', - '<% } %>', + '
', + '
', + '
<%= index+1 %>
', + '
', + '', + '
', + '
<%= Common.Utils.String.htmlEncode(name) %>
', + '
<%= fields %>
', '
' ].join('')), tabindex: 1 }); - this.rolesList.store.comparator = function(item1, item2) { - var n1 = item1.get(me.sort.type).toLowerCase(), - n2 = item2.get(me.sort.type).toLowerCase(); - if (n1==n2) return 0; - return (n10) { - if (selectedItem===undefined || selectedItem===null) selectedItem = 0; - if (_.isNumber(selectedItem)) { - if (selectedItem>val-1) selectedItem = val-1; - this.rolesList.selectByIndex(selectedItem); - setTimeout(function() { - me.rolesList.scrollToRecord(store.at(selectedItem)); - }, 50); - - } else if (selectedItem){ // object - var rec = store.findWhere({name: selectedItem.asc_getName(true), scope: selectedItem.asc_getScope()}); - if (rec) { - this.rolesList.selectRecord(rec); - setTimeout(function() { - me.rolesList.scrollToRecord(rec); - }, 50); - } - } + if (this.rolesList.store.length>0) { + var me = this; + this.rolesList.selectByIndex(0); + setTimeout(function() { + me.rolesList.scrollToRecord(me.rolesList.store.at(0)); + }, 50); } - _.delay(function () { - me.rolesList.scroller.update({alwaysVisibleY: true}); - }, 100, this); this.updateButtons(); }, + refreshRolesIndexes: function() { + this.rolesList.store.each(function(item, index) { + item.set('index', index); + }); + }, + + getIconCls: function(index) { + return (index===0) ? 'btn-arrow-up' : (index===this.rolesList.store.length-1 ? 'btn-arrow-down' : 'btn-border-insidevert'); + }, + onEditRole: function (isEdit) { if (this._isWarningVisible) return; - if (this.locked) { - Common.NotificationCenter.trigger('namedrange:locked'); - return; - } var me = this, xy = me.$window.offset(), rec = this.rolesList.getSelectedRec(), @@ -238,10 +213,26 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template', isEdit : isEdit, handler : function(result, settings) { if (result == 'ok' && settings) { + var color = settings.color, + name = settings.name, + store = me.rolesList.store; if (isEdit) { - me.api.asc_editRole(settings); + // me.api.asc_editRole(settings); + rec.set('name', name); + rec.set('color', color); } else { - me.api.asc_addRole(settings); + // me.api.asc_addRole(settings); + rec = store.push({ + name: name, + color: color, + fields: 0, + index: store.length, + scope: me + }); + if (rec) { + me.rolesList.selectRecord(rec); + me.rolesList.scrollToRecord(rec); + } } } } @@ -258,21 +249,27 @@ define([ 'text!documenteditor/main/app/template/RolesManagerDlg.template', onDeleteRole: function () { var rec = this.rolesList.getSelectedRec(); if (rec) { - var me = this; + var me = this, + store = this.rolesList.store; me._isWarningVisible = true; Common.UI.warning({ msg: Common.Utils.String.format(me.warnDelete, rec.get('name')), buttons: ['ok', 'cancel'], callback: function(btn) { if (btn == 'ok') { - me.api.asc_delRole(rec.get('name')); + var index = store.indexOf(rec); + // me.api.asc_delRole(rec.get('name')); + store.remove(rec); + me.refreshRolesIndexes(); + (store.length>0) && me.rolesList.selectByIndex(index div{ + vertical-align: middle; + display: inline-block; + text-overflow: ellipsis; + overflow: hidden; + white-space: pre; + } + + .listitem-icon { + width: 20px; + height: 20px; + vertical-align: middle; + margin-right: 5px; + } + + .selected { + .listitem-icon { + background-position-x: -20px; + background-position-x: @button-small-active-icon-offset-x; + } + } + } } \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/resources/less/advanced-settings.less b/apps/spreadsheeteditor/main/resources/less/advanced-settings.less index 6447d327f..1f2fad620 100644 --- a/apps/spreadsheeteditor/main/resources/less/advanced-settings.less +++ b/apps/spreadsheeteditor/main/resources/less/advanced-settings.less @@ -59,6 +59,42 @@ } } } + + .range-tableview { + .list-item > div{ + vertical-align: middle; + display: inline-block; + text-overflow: ellipsis; + overflow: hidden; + white-space: pre; + } + + .listitem-icon { + width: 20px; + height: 20px; + vertical-align: middle; + margin-right: 5px; + } + + .selected { + .listitem-icon { + background-position-x: -20px; + background-position-x: @button-small-active-icon-offset-x; + } + } + + .lock-user { + position: absolute; + right: 2px; + min-width: 100px; + max-width: 150px; + height: 20px; + padding: 2px 10px; + background-color: #EE3525; + color: #fff; + text-align: center; + } + } } #sort-dialog-btn-down {