From f0659de87e512c02f532525c81a950f9ef04a6f0 Mon Sep 17 00:00:00 2001 From: Konstantin Kireyev Date: Thu, 12 Sep 2024 22:45:05 +0500 Subject: [PATCH] feat/[pe, se]: rework document info --- .../main/lib/view/DocumentPropertyDialog.js | 2 +- .../main/app/view/FileMenuPanels.js | 75 +++--- .../main/resources/less/filemenu.less | 50 ++-- .../main/app/view/FileMenu.js | 3 +- .../main/app/view/FileMenuPanels.js | 234 +++++++++++++----- apps/presentationeditor/main/app_dev.js | 1 + apps/presentationeditor/main/app_pack.js | 1 + apps/presentationeditor/main/locale/en.json | 19 ++ .../main/resources/less/app.less | 1 + .../main/resources/less/leftmenu.less | 92 ++++++- .../main/app/view/FileMenuPanels.js | 173 ++++++++++--- apps/spreadsheeteditor/main/app_dev.js | 1 + apps/spreadsheeteditor/main/app_pack.js | 1 + apps/spreadsheeteditor/main/locale/en.json | 19 ++ .../main/resources/less/leftmenu.less | 90 ++++++- 15 files changed, 572 insertions(+), 190 deletions(-) diff --git a/apps/common/main/lib/view/DocumentPropertyDialog.js b/apps/common/main/lib/view/DocumentPropertyDialog.js index 1069c5b43b..8afccfa430 100644 --- a/apps/common/main/lib/view/DocumentPropertyDialog.js +++ b/apps/common/main/lib/view/DocumentPropertyDialog.js @@ -46,7 +46,7 @@ define([], function () { 'use strict'; }, options); this.template = [ - '
', + '
', '
', '', '
', diff --git a/apps/documenteditor/main/app/view/FileMenuPanels.js b/apps/documenteditor/main/app/view/FileMenuPanels.js index 4d68e8b893..2bb447d7b2 100644 --- a/apps/documenteditor/main/app/view/FileMenuPanels.js +++ b/apps/documenteditor/main/app/view/FileMenuPanels.js @@ -1356,6 +1356,42 @@ define([], function () { '', '', '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', '', '', @@ -1420,43 +1456,6 @@ define([], function () { '', '
', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', '', '', '
', @@ -1995,7 +1994,7 @@ define([], function () { tplCustomProperty: function(name, type, value) { if (type === AscCommon.c_oVariantTypes.vtBool) { - value = value ? 'Yes' : 'No'; + value = value ? this.txtYes : this.txtNo; } return '' + diff --git a/apps/documenteditor/main/resources/less/filemenu.less b/apps/documenteditor/main/resources/less/filemenu.less index d983086cc3..fc41a6afb9 100644 --- a/apps/documenteditor/main/resources/less/filemenu.less +++ b/apps/documenteditor/main/resources/less/filemenu.less @@ -274,8 +274,27 @@ } } - #fms-flex-add-property { + #fminfo-btn-add-property { margin: 10px 0; + background-color: transparent; + height: 24px; + + span { + text-decoration: underline dotted; + text-underline-offset: 4px; + } + } + + #fms-flex-add-property, #fms-flex-apply { + #panel-info table tr td { + height: 0; + } + } + + .custom-property-wrapper { + display: flex; + gap: 5px; + align-items: center; } } @@ -912,33 +931,4 @@ } } } -} - -.document-info-content { - display: flex; - flex-direction: column; - margin: 0 20px; - gap: 10px; -} - -#fminfo-btn-add-property > span { - text-decoration: underline dotted; - text-underline-offset: 4px; -} - -#fms-flex-add-property, #fms-flex-apply { - #panel-info table tr td { - height: 0; - } -} - -#fminfo-btn-add-property { - background-color: transparent; - height: 24px; -} - -.custom-property-wrapper { - display: flex; - gap: 5px; - align-items: center; } \ No newline at end of file diff --git a/apps/presentationeditor/main/app/view/FileMenu.js b/apps/presentationeditor/main/app/view/FileMenu.js index 3dcb5e3e2b..afaf5ec089 100644 --- a/apps/presentationeditor/main/app/view/FileMenu.js +++ b/apps/presentationeditor/main/app/view/FileMenu.js @@ -42,7 +42,8 @@ define([ 'text!presentationeditor/main/app/template/FileMenu.template', 'underscore', 'common/main/lib/component/BaseView', - 'common/main/lib/view/RecentFiles' + 'common/main/lib/view/RecentFiles', + 'common/main/lib/component/Calendar' ], function (tpl, _) { 'use strict'; diff --git a/apps/presentationeditor/main/app/view/FileMenuPanels.js b/apps/presentationeditor/main/app/view/FileMenuPanels.js index b8514d18af..020e8af52a 100644 --- a/apps/presentationeditor/main/app/view/FileMenuPanels.js +++ b/apps/presentationeditor/main/app/view/FileMenuPanels.js @@ -1090,78 +1090,86 @@ define([], function () { this.rendered = false; this.template = _.template([ - '
', - '
' + this.txtPresentationInfo + '
', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', // '', // '', // '', // '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '
' + this.txtPresentationInfo + '
', + '', + '', + '', + '', + '
', + '
', + '
', + '', '', - '', - '', + '', + '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', '
', + '', + '
', - '', - '', - '', - '', - '
', - '
', '
', '
', - '', + '
', '', '', '', @@ -1290,9 +1298,13 @@ define([], function () { }); this.btnApply.on('click', _.bind(this.applySettings, this)); - this.pnlInfo = $markup.find('.flex-settings').addBack().filter('.flex-settings'); this.pnlApply = $markup.findById('#fms-flex-apply'); + this.btnAddProperty = new Common.UI.Button({ + el: $markup.findById('#fminfo-btn-add-property') + }); + this.btnAddProperty.on('click', _.bind(this.onAddPropertyClick, this)); + this.rendered = true; this.updateInfo(this.doc); @@ -1300,8 +1312,7 @@ define([], function () { this.$el = $(node).html($markup); if (_.isUndefined(this.scroller)) { this.scroller = new Common.UI.Scroller({ - el: this.pnlInfo, - suppressScrollX: true, + el: this.$el, alwaysVisibleY: true }); } @@ -1330,7 +1341,6 @@ define([], function () { updateScroller: function(destroy) { if (this.scroller) { this.scroller.update(destroy ? {} : undefined); - this.pnlInfo.toggleClass('bordered', this.scroller.isVisible()); } }, @@ -1380,6 +1390,12 @@ define([], function () { } this._ShowHideInfoItem(this.lblDate, !!value); } + + if (this.api) { + _.each(this.api.asc_getAllCustomProperties(), _.bind(function(prop, idx) { + this.renderCustomProperty(prop.asc_getName(), prop.asc_getType(), prop.asc_getValue(), idx); + }, this)); + } }, updateFileInfo: function() { @@ -1443,6 +1459,82 @@ define([], function () { this.SetDisabled(); }, + tplCustomProperty: function(name, type, value) { + if (type === AscCommon.c_oVariantTypes.vtBool) { + value = value ? this.txtYes : this.txtNo; + } + + return '' + + '' + + ''; + }, + + renderCustomProperty: function(name, type, value, idx) { + var me = this; + + var currentCustomProperty = $('tr[data-name="' + name + '"]'); + if (currentCustomProperty.length) { + currentCustomProperty.off('click'); + currentCustomProperty.html($(this.tplCustomProperty(name, type, value))); + } else { + currentCustomProperty = $(this.tplCustomProperty(name, type, value)); + $('tbody.properties-tab').append(currentCustomProperty); + } + + currentCustomProperty.on('click', function (e) { + if (currentCustomProperty.find('div.disabled').length) { + return; + } + + var btn = currentCustomProperty.find(e.target); + if (btn.hasClass('close')) { + me.api.asc_removeCustomProperty(idx); + $('tr[data-name="' + name + '"]').remove(); + } else if (btn.hasClass('form-control')) { + (new Common.Views.DocumentPropertyDialog({ + title: me.txtDocumentPropertyUpdateTitle, + defaultValue: { + name: name, + type: type, + value: value + }, + handler: function(result, name, type, value) { + if (result === 'ok') { + me.api.asc_modifyCustomProperty(idx, name, type, value); + me.renderCustomProperty(name, type, value, idx); + } + } + })).show(); + } + }) + }, + + setDisabledCustomProperties: function(disable) { + _.each($('tr[data-name]'), function(prop) { + $(prop).find('div.custom-property-wrapper')[disable ? 'addClass' : 'removeClass']('disabled'); + $(prop).find('div.close')[disable ? 'hide' : 'show'](); + }) + }, + + onAddPropertyClick: function() { + var me = this; + (new Common.Views.DocumentPropertyDialog({ + handler: function(result, name, type, value) { + if (result === 'ok') { + me.api.asc_addCustomProperty(name, type, value); + var properties = me.api.asc_getAllCustomProperties(); + if (properties.length) { + var prop = properties[properties.length - 1]; + me.renderCustomProperty(prop.asc_getName(), prop.asc_getType(), prop.asc_getValue(), properties.length - 1); + } + } + } + })).show(); + }, + _ShowHideInfoItem: function(el, visible) { el.closest('tr')[visible?'show':'hide'](); return visible; @@ -1492,6 +1584,8 @@ define([], function () { this.tblAuthor.find('.close').toggleClass('disabled', this._locked); this.tblAuthor.toggleClass('disabled', disable); this.btnApply.setDisabled(this._locked); + this.btnAddProperty.setDisabled(disable); + this.setDisabledCustomProperties(disable); }, applySettings: function() { @@ -1523,7 +1617,13 @@ define([], function () { txtAddText: 'Add Text', txtMinutes: 'min', okButtonText: 'Apply', - txtPresentationInfo: 'Info' + txtPresentationInfo: 'Presentation Info', + txtCommon: 'Common', + txtProperties: 'Properties', + txtDocumentPropertyUpdateTitle: "Document Property", + txtAddProperty: 'Add property', + txtYes: 'Yes', + txtNo: 'No' }, PE.Views.FileMenuPanels.DocumentInfo || {})); PE.Views.FileMenuPanels.DocumentRights = Common.UI.BaseView.extend(_.extend({ diff --git a/apps/presentationeditor/main/app_dev.js b/apps/presentationeditor/main/app_dev.js index ff23c32eed..818135e29f 100644 --- a/apps/presentationeditor/main/app_dev.js +++ b/apps/presentationeditor/main/app_dev.js @@ -219,6 +219,7 @@ require([ 'common/main/lib/util/define', 'common/main/lib/view/SignDialog', 'common/main/lib/view/ListSettingsDialog', + 'common/main/lib/view/DocumentPropertyDialog', 'presentationeditor/main/app/view/FileMenuPanels', 'presentationeditor/main/app/view/DocumentHolderExt', diff --git a/apps/presentationeditor/main/app_pack.js b/apps/presentationeditor/main/app_pack.js index 1894aef73d..22fcbeece5 100644 --- a/apps/presentationeditor/main/app_pack.js +++ b/apps/presentationeditor/main/app_pack.js @@ -25,6 +25,7 @@ require([ 'common/main/lib/view/DocumentHolderExt', 'common/main/lib/view/SignDialog', 'common/main/lib/view/ListSettingsDialog', + 'common/main/lib/view/DocumentPropertyDialog', 'presentationeditor/main/app/view/FileMenuPanels', 'presentationeditor/main/app/view/DocumentHolderExt', diff --git a/apps/presentationeditor/main/locale/en.json b/apps/presentationeditor/main/locale/en.json index cb5c0316a8..115ab4cc77 100644 --- a/apps/presentationeditor/main/locale/en.json +++ b/apps/presentationeditor/main/locale/en.json @@ -890,6 +890,19 @@ "Common.Views.UserNameDialog.textDontShow": "Don't ask me again", "Common.Views.UserNameDialog.textLabel": "Label:", "Common.Views.UserNameDialog.textLabelError": "Label must not be empty.", + "Common.Views.DocumentPropertyDialog.txtTitle": "New Document Property", + "Common.Views.DocumentPropertyDialog.txtPropertyTitleLabel": "Title", + "Common.Views.DocumentPropertyDialog.txtPropertyTitleBlankError": "Property should have a title", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeLabel": "Type", + "Common.Views.DocumentPropertyDialog.txtPropertyValueLabel": "Value", + "Common.Views.DocumentPropertyDialog.txtPropertyValueBlankError": "Property should have a value", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeText": "Text", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeNumber": "Number", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeNumberInvalid": "Provide a valid number", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeDate": "Date", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeBoolean": "\"Yes\" or \"no\"", + "Common.Views.DocumentPropertyDialog.txtPropertyBooleanTrue": "Yes", + "Common.Views.DocumentPropertyDialog.txtPropertyBooleanFalse": "No", "PE.Controllers.LeftMenu.leavePageText": "All unsaved changes in this document will be lost.
Click \"Cancel\" then \"Save\" to save them. Click \"OK\" to discard all the unsaved changes.", "PE.Controllers.LeftMenu.newDocumentTitle": "Unnamed presentation", "PE.Controllers.LeftMenu.notcriticalErrorTitle": "Warning", @@ -2033,6 +2046,12 @@ "PE.Views.FileMenuPanels.DocumentInfo.txtTags": "Tags", "PE.Views.FileMenuPanels.DocumentInfo.txtTitle": "Title", "PE.Views.FileMenuPanels.DocumentInfo.txtUploaded": "Uploaded", + "PE.Views.FileMenuPanels.DocumentInfo.txtYes": "Yes", + "PE.Views.FileMenuPanels.DocumentInfo.txtNo": "Yes", + "PE.Views.FileMenuPanels.DocumentInfo.txtCommon": "Common", + "PE.Views.FileMenuPanels.DocumentInfo.txtProperties": "Properties", + "PE.Views.FileMenuPanels.DocumentInfo.txtDocumentPropertyUpdateTitle": "Document Property", + "PE.Views.FileMenuPanels.DocumentInfo.txtAddProperty": "Add property", "PE.Views.FileMenuPanels.DocumentRights.txtAccessRights": "Access rights", "PE.Views.FileMenuPanels.DocumentRights.txtBtnAccessRights": "Change access rights", "PE.Views.FileMenuPanels.DocumentRights.txtRights": "Persons who have rights", diff --git a/apps/presentationeditor/main/resources/less/app.less b/apps/presentationeditor/main/resources/less/app.less index 95b29c6312..88b31f122c 100644 --- a/apps/presentationeditor/main/resources/less/app.less +++ b/apps/presentationeditor/main/resources/less/app.less @@ -126,6 +126,7 @@ @import "../../../../common/main/resources/less/label.less"; @import "../../../../common/main/resources/less/bigscaling.less"; @import "../../../../common/main/resources/less/updown-picker.less"; +@import "../../../../common/main/resources/less/calendar.less"; // App // -------------------------------------------------- diff --git a/apps/presentationeditor/main/resources/less/leftmenu.less b/apps/presentationeditor/main/resources/less/leftmenu.less index dcdb8a37b5..3d9ad8b641 100644 --- a/apps/presentationeditor/main/resources/less/leftmenu.less +++ b/apps/presentationeditor/main/resources/less/leftmenu.less @@ -513,17 +513,97 @@ } #panel-info { - .header { - margin: 30px 0 20px 30px; - .font-size-very-huge(); + padding: 30px; - .rtl & { - margin: 30px 30px 20px 0; + .header { + .font-size-very-huge(); + line-height: 26px; + } + + table { + display: flex; + gap: 30px; + flex-direction: column; + + tbody { + display: flex; + gap: 12px; + flex-direction: column; + + &.properties-tab { + gap: 10px; + } } + + tr { + display: flex; + gap: 24px; + align-items: center; + td { + font-size: 11px; + line-height: 16px; + + &.title { + label { + font-size: 14px; + font-weight: 700; + line-height: 20px; + } + } + + &.left { + width: 120px; + height: 16px; + flex-shrink: 0; + } + + &.right { + flex-grow: 1; + } + } + + &.divider { + height: 10px; + } + } + + tr.author-info { + align-items: flex-start; + + td { + display: flex; + gap: 5px; + align-items: center; + } + } + + .author-info tbody tr:last-child { + margin-bottom: 20px; + } + + &.main { + width: 100%; + } + } + + #fminfo-btn-add-property { + margin: 10px 0; + background-color: transparent; + height: 24px; + + span { + text-decoration: underline dotted; + text-underline-offset: 4px; + } + } + + .custom-property-wrapper { + display: flex; + gap: 5px; + align-items: center; } } - #panel-info, #panel-rights { table { tr { diff --git a/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js b/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js index 8b4de836bd..253f2cfb23 100644 --- a/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js +++ b/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js @@ -1566,9 +1566,10 @@ define([], function () { this.rendered = false; this.template = _.template([ - '
', - '
' + this.txtSpreadsheetInfo + '
', - '
' + + '' + + '
' + + '
', + '
', + '', + '', + '', '', '', '', @@ -1581,8 +1582,35 @@ define([], function () { '', '', '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', '', '', @@ -1599,41 +1627,20 @@ define([], function () { '', '', '', - '', - '', + '', + '
' + this.txtSpreadsheetInfo + '
', + '', + '', + '', + '', + '
', + '
', + '
', + '', '', - '', - '', + '', + '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', '
', + '', + '
', - '', - '', - '', - '', - '
', - '
', '
', '
', - '', + '
', '', '', '', @@ -1762,9 +1769,13 @@ define([], function () { }); this.btnApply.on('click', _.bind(this.applySettings, this)); - this.pnlInfo = $markup.find('.flex-settings').addBack().filter('.flex-settings'); this.pnlApply = $markup.findById('#fms-flex-apply'); + this.btnAddProperty = new Common.UI.Button({ + el: $markup.findById('#fminfo-btn-add-property') + }); + this.btnAddProperty.on('click', _.bind(this.onAddPropertyClick, this)); + this.rendered = true; this.updateInfo(this.doc); @@ -1772,8 +1783,7 @@ define([], function () { this.$el = $(node).html($markup); if (_.isUndefined(this.scroller)) { this.scroller = new Common.UI.Scroller({ - el: this.pnlInfo, - suppressScrollX: true, + el: this.$el, alwaysVisibleY: true }); } @@ -1802,7 +1812,6 @@ define([], function () { updateScroller: function(destroy) { if (this.scroller) { this.scroller.update(destroy ? {} : undefined); - this.pnlInfo.toggleClass('bordered', this.scroller.isVisible()); } }, @@ -1954,6 +1963,82 @@ define([], function () { this.updateFileInfo(); }, + tplCustomProperty: function(name, type, value) { + if (type === AscCommon.c_oVariantTypes.vtBool) { + value = value ? this.txtYes : this.txtNo; + } + + return '' + + '' + + ''; + }, + + renderCustomProperty: function(name, type, value, idx) { + var me = this; + + var currentCustomProperty = $('tr[data-name="' + name + '"]'); + if (currentCustomProperty.length) { + currentCustomProperty.off('click'); + currentCustomProperty.html($(this.tplCustomProperty(name, type, value))); + } else { + currentCustomProperty = $(this.tplCustomProperty(name, type, value)); + $('tbody.properties-tab').append(currentCustomProperty); + } + + currentCustomProperty.on('click', function (e) { + if (currentCustomProperty.find('div.disabled').length) { + return; + } + + var btn = currentCustomProperty.find(e.target); + if (btn.hasClass('close')) { + me.api.asc_removeCustomProperty(idx); + $('tr[data-name="' + name + '"]').remove(); + } else if (btn.hasClass('form-control')) { + (new Common.Views.DocumentPropertyDialog({ + title: me.txtDocumentPropertyUpdateTitle, + defaultValue: { + name: name, + type: type, + value: value + }, + handler: function(result, name, type, value) { + if (result === 'ok') { + me.api.asc_modifyCustomProperty(idx, name, type, value); + me.renderCustomProperty(name, type, value, idx); + } + } + })).show(); + } + }) + }, + + setDisabledCustomProperties: function(disable) { + _.each($('tr[data-name]'), function(prop) { + $(prop).find('div.custom-property-wrapper')[disable ? 'addClass' : 'removeClass']('disabled'); + $(prop).find('div.close')[disable ? 'hide' : 'show'](); + }) + }, + + onAddPropertyClick: function() { + var me = this; + (new Common.Views.DocumentPropertyDialog({ + handler: function(result, name, type, value) { + if (result === 'ok') { + me.api.asc_addCustomProperty(name, type, value); + var properties = me.api.asc_getAllCustomProperties(); + if (properties.length) { + var prop = properties[properties.length - 1]; + me.renderCustomProperty(prop.asc_getName(), prop.asc_getType(), prop.asc_getValue(), properties.length - 1); + } + } + } + })).show(); + }, + SetDisabled: function() { var disable = !this.mode.isEdit || this._locked; this.inputTitle.setDisabled(disable); @@ -1964,6 +2049,8 @@ define([], function () { this.tblAuthor.find('.close').toggleClass('disabled', this._locked); this.tblAuthor.toggleClass('disabled', disable); this.btnApply.setDisabled(this._locked); + this.btnAddProperty.setDisabled(disable); + this.setDisabledCustomProperties(disable); }, applySettings: function() { @@ -1994,7 +2081,13 @@ define([], function () { txtAddText: 'Add Text', txtMinutes: 'min', okButtonText: 'Apply', - txtSpreadsheetInfo: 'Spreadsheet Info' + txtSpreadsheetInfo: 'Spreadsheet Info', + txtCommon: 'Common', + txtProperties: 'Properties', + txtDocumentPropertyUpdateTitle: "Document Property", + txtAddProperty: 'Add property', + txtYes: 'Yes', + txtNo: 'No' }, SSE.Views.FileMenuPanels.DocumentInfo || {})); SSE.Views.FileMenuPanels.DocumentRights = Common.UI.BaseView.extend(_.extend({ diff --git a/apps/spreadsheeteditor/main/app_dev.js b/apps/spreadsheeteditor/main/app_dev.js index d2e8c6f946..083f59cacc 100644 --- a/apps/spreadsheeteditor/main/app_dev.js +++ b/apps/spreadsheeteditor/main/app_dev.js @@ -218,6 +218,7 @@ require([ 'common/main/lib/util/define', 'common/main/lib/view/SignDialog', 'common/main/lib/view/SignSettingsDialog', + 'common/main/lib/view/DocumentPropertyDialog', 'spreadsheeteditor/main/app/view/FileMenuPanels', 'spreadsheeteditor/main/app/view/DocumentHolderExt', diff --git a/apps/spreadsheeteditor/main/app_pack.js b/apps/spreadsheeteditor/main/app_pack.js index 7a4013bc3e..fab57163a2 100644 --- a/apps/spreadsheeteditor/main/app_pack.js +++ b/apps/spreadsheeteditor/main/app_pack.js @@ -24,6 +24,7 @@ require([ 'common/main/lib/view/DocumentHolderExt', 'common/main/lib/view/SignDialog', 'common/main/lib/view/SignSettingsDialog', + 'common/main/lib/view/DocumentPropertyDialog', 'spreadsheeteditor/main/app/view/FileMenuPanels', 'spreadsheeteditor/main/app/view/DocumentHolderExt', diff --git a/apps/spreadsheeteditor/main/locale/en.json b/apps/spreadsheeteditor/main/locale/en.json index 81445574d9..77710982a2 100644 --- a/apps/spreadsheeteditor/main/locale/en.json +++ b/apps/spreadsheeteditor/main/locale/en.json @@ -749,6 +749,19 @@ "Common.Views.UserNameDialog.textDontShow": "Don't ask me again", "Common.Views.UserNameDialog.textLabel": "Label:", "Common.Views.UserNameDialog.textLabelError": "Label must not be empty.", + "Common.Views.DocumentPropertyDialog.txtTitle": "New Document Property", + "Common.Views.DocumentPropertyDialog.txtPropertyTitleLabel": "Title", + "Common.Views.DocumentPropertyDialog.txtPropertyTitleBlankError": "Property should have a title", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeLabel": "Type", + "Common.Views.DocumentPropertyDialog.txtPropertyValueLabel": "Value", + "Common.Views.DocumentPropertyDialog.txtPropertyValueBlankError": "Property should have a value", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeText": "Text", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeNumber": "Number", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeNumberInvalid": "Provide a valid number", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeDate": "Date", + "Common.Views.DocumentPropertyDialog.txtPropertyTypeBoolean": "\"Yes\" or \"no\"", + "Common.Views.DocumentPropertyDialog.txtPropertyBooleanTrue": "Yes", + "Common.Views.DocumentPropertyDialog.txtPropertyBooleanFalse": "No", "SSE.Controllers.DataTab.strSheet": "Sheet", "SSE.Controllers.DataTab.textAddExternalData": "The link to an external source has been added. You can update such links in the Data tab.", "SSE.Controllers.DataTab.textColumns": "Columns", @@ -2640,6 +2653,12 @@ "SSE.Views.FileMenuPanels.DocumentInfo.txtTags": "Tags", "SSE.Views.FileMenuPanels.DocumentInfo.txtTitle": "Title", "SSE.Views.FileMenuPanels.DocumentInfo.txtUploaded": "Uploaded", + "SSE.Views.FileMenuPanels.DocumentInfo.txtYes": "Yes", + "SSE.Views.FileMenuPanels.DocumentInfo.txtNo": "Yes", + "SSE.Views.FileMenuPanels.DocumentInfo.txtCommon": "Common", + "SSE.Views.FileMenuPanels.DocumentInfo.txtProperties": "Properties", + "SSE.Views.FileMenuPanels.DocumentInfo.txtDocumentPropertyUpdateTitle": "Document Property", + "SSE.Views.FileMenuPanels.DocumentInfo.txtAddProperty": "Add property", "SSE.Views.FileMenuPanels.DocumentRights.txtAccessRights": "Access Rights", "SSE.Views.FileMenuPanels.DocumentRights.txtBtnAccessRights": "Change access rights", "SSE.Views.FileMenuPanels.DocumentRights.txtRights": "Persons who have rights", diff --git a/apps/spreadsheeteditor/main/resources/less/leftmenu.less b/apps/spreadsheeteditor/main/resources/less/leftmenu.less index 6f60c576e6..1fb9795339 100644 --- a/apps/spreadsheeteditor/main/resources/less/leftmenu.less +++ b/apps/spreadsheeteditor/main/resources/less/leftmenu.less @@ -181,17 +181,94 @@ } #panel-info { - padding: 0; - display: flex; - flex-direction: column; + padding: 30px; .header { - margin: 30px 0 20px 30px; .font-size-very-huge(); + line-height: 26px; + } - .rtl & { - margin: 30px 30px 20px 0; + table { + display: flex; + gap: 30px; + flex-direction: column; + + tbody { + display: flex; + gap: 12px; + flex-direction: column; + + &.properties-tab { + gap: 10px; + } } + + tr { + display: flex; + gap: 24px; + align-items: center; + td { + font-size: 11px; + line-height: 16px; + + &.title { + label { + font-size: 14px; + font-weight: 700; + line-height: 20px; + } + } + + &.left { + width: 120px; + height: 16px; + flex-shrink: 0; + } + + &.right { + flex-grow: 1; + } + } + + &.divider { + height: 10px; + } + } + + tr.author-info { + align-items: flex-start; + + td { + display: flex; + gap: 5px; + align-items: center; + } + } + + .author-info tbody tr:last-child { + margin-bottom: 20px; + } + + &.main { + width: 100%; + } + } + + #fminfo-btn-add-property { + margin: 10px 0; + background-color: transparent; + height: 24px; + + span { + text-decoration: underline dotted; + text-underline-offset: 4px; + } + } + + .custom-property-wrapper { + display: flex; + gap: 5px; + align-items: center; } } @@ -613,7 +690,6 @@ } } - #panel-info, #panel-rights { table { tr {
' + + '' + + '
' + + '