From cdb2b8a8a8302b32a0890bd74ced78913c222cc8 Mon Sep 17 00:00:00 2001 From: Yuri Kuznetsov Date: Mon, 3 Jan 2022 16:20:58 +0200 Subject: [PATCH] cs fix and text resize fix --- client/res/templates/fields/text/edit.tpl | 2 +- client/src/views/fields/text.js | 103 ++++++++++++++++------ client/src/views/stream.js | 54 ++++++++---- client/src/views/stream/fields/post.js | 12 +-- client/src/views/stream/panel.js | 3 +- client/src/views/stream/record/edit.js | 1 + 6 files changed, 119 insertions(+), 56 deletions(-) diff --git a/client/res/templates/fields/text/edit.tpl b/client/res/templates/fields/text/edit.tpl index 64f74228e3..ad38b08c96 100644 --- a/client/res/templates/fields/text/edit.tpl +++ b/client/res/templates/fields/text/edit.tpl @@ -4,5 +4,5 @@ {{#if params.maxLength}}maxlength="{{params.maxLength}}"{{/if}} rows="{{rows}}" autocomplete="espo-{{name}}" - style="resize: vertical;" + style="resize: {{#unless noResize}} vertical{{else}}none{{/unless}};" >{{value}} diff --git a/client/src/views/fields/text.js b/client/src/views/fields/text.js index 5c1cd61870..f8ffd9f73b 100644 --- a/client/src/views/fields/text.js +++ b/client/src/views/fields/text.js @@ -50,7 +50,19 @@ define('views/fields/text', 'views/fields/base', function (Dep) { cutHeight: 200, - searchTypeList: ['contains', 'startsWith', 'equals', 'endsWith', 'like', 'notContains', 'notLike', 'isEmpty', 'isNotEmpty'], + searchTypeList: [ + 'contains', + 'startsWith', + 'equals', + 'endsWith', + 'like', + 'notContains', + 'notLike', + 'isEmpty', + 'isNotEmpty', + ], + + noResize: false, events: { 'click a[data-action="seeMoreText"]': function (e) { @@ -64,11 +76,15 @@ define('views/fields/text', 'views/fields/base', function (Dep) { setup: function () { Dep.prototype.setup.call(this); + this.params.rows = this.params.rows || this.rowsDefault; + this.noResize = this.options.noResize || this.params.noResize || this.noResize; + this.seeMoreDisabled = this.seeMoreDisabled || this.params.seeMoreDisabled; - this.autoHeightDisabled = this.options.autoHeightDisabled || this.params.autoHeightDisabled || this.autoHeightDisabled; + this.autoHeightDisabled = this.options.autoHeightDisabled || this.params.autoHeightDisabled || + this.autoHeightDisabled; if (this.params.cutHeight) { this.cutHeight = this.params.cutHeight; @@ -80,9 +96,9 @@ define('views/fields/text', 'views/fields/base', function (Dep) { this.rowsMin = this.params.rows; } - this.on('remove', function () { + this.on('remove', () => { $(window).off('resize.see-more-' + this.cid); - }, this); + }); }, setupSearch: function () { @@ -96,20 +112,21 @@ define('views/fields/text', 'views/fields/base', function (Dep) { data: function () { var data = Dep.prototype.data.call(this); + if ( - this.model.get(this.name) !== null - && - this.model.get(this.name) !== '' - && + this.model.get(this.name) !== null && + this.model.get(this.name) !== '' && this.model.has(this.name) ) { data.isNotEmpty = true; } + if (this.mode === 'search') { if (typeof this.searchParams.value === 'string') { this.searchData.value = this.searchParams.value; } } + if (this.mode === 'edit') { if (this.autoHeightDisabled) { data.rows = this.params.rows; @@ -117,6 +134,7 @@ define('views/fields/text', 'views/fields/base', function (Dep) { data.rows = this.rowsMin; } } + data.valueIsSet = this.model.has(this.name); if (this.isReadMode()) { @@ -129,6 +147,8 @@ define('views/fields/text', 'views/fields/base', function (Dep) { data.displayRawText = this.params.displayRawText; } + data.noResize = this.noResize; + return data; }, @@ -142,6 +162,7 @@ define('views/fields/text', 'views/fields/base', function (Dep) { getValueForDisplay: function () { var text = this.model.get(this.name); + return text || ''; }, @@ -151,19 +172,25 @@ define('views/fields/text', 'views/fields/base', function (Dep) { if (typeof lastHeight === 'undefined' && clientHeight === 0) { setTimeout(this.controlTextareaHeight.bind(this), 10); + return; } - if (clientHeight === lastHeight) return; + if (clientHeight === lastHeight) { + return; + } if (scrollHeight > clientHeight + 1) { var rows = this.$element.prop('rows'); - if (this.params.rows && rows >= this.params.rows) return; + if (this.params.rows && rows >= this.params.rows) { + return; + } this.$element.attr('rows', rows + 1); this.controlTextareaHeight(clientHeight); } + if (this.$element.val().length === 0) { this.$element.attr('rows', this.rowsMin); } @@ -174,7 +201,9 @@ define('views/fields/text', 'views/fields/base', function (Dep) { }, controlSeeMore: function () { - if (!this.isCut()) return; + if (!this.isCut()) { + return; + } if (this.$text.height() > this.cutHeight) { this.$seeMoreContainer.removeClass('hidden'); @@ -197,47 +226,53 @@ define('views/fields/text', 'views/fields/base', function (Dep) { if (this.isCut()) { this.controlSeeMore(); + if (this.model.get(this.name) && this.$text.height() === 0) { this.$textContainer.addClass('cut'); + setTimeout(this.controlSeeMore.bind(this), 50); } - $(window).on('resize.see-more-' + this.cid, function () { + $(window).on('resize.see-more-' + this.cid, () => { this.controlSeeMore(); - }.bind(this)); + }); } } - if (this.mode == 'edit') { + if (this.mode === 'edit') { var text = this.getValueForDisplay(); if (text) { this.$element.val(text); } } - if (this.mode == 'search') { + if (this.mode === 'search') { var type = this.$el.find('select.search-type').val(); + this.handleSearchType(type); - this.$el.find('select.search-type').on('change', function () { + this.$el.find('select.search-type').on('change', () => { this.trigger('change'); - }.bind(this)); + }); - this.$element.on('input', function () { + this.$element.on('input', () => { this.trigger('change'); - }.bind(this)); + }); } if (this.mode === 'edit' && !this.autoHeightDisabled) { this.controlTextareaHeight(); - this.$element.on('input', function () { + + this.$element.on('input', () => { this.controlTextareaHeight(); - }.bind(this)); + }); } }, fetch: function () { var data = {}; + data[this.name] = this.$element.val() || null; + return data; }, @@ -247,7 +282,7 @@ define('views/fields/text', 'views/fields/base', function (Dep) { var data; if (~['isEmpty', 'isNotEmpty'].indexOf(type)) { - if (type == 'isEmpty') { + if (type === 'isEmpty') { data = { type: 'or', value: [ @@ -264,7 +299,7 @@ define('views/fields/text', 'views/fields/base', function (Dep) { data: { type: type } - } + }; } else { data = { type: 'and', @@ -283,20 +318,26 @@ define('views/fields/text', 'views/fields/base', function (Dep) { data: { type: type } - } + }; } + return data; - } else { + } + else { var value = this.$element.val().toString().trim(); + value = value.trim(); + if (value) { data = { value: value, type: type - } + }; + return data; } } + return false; }, @@ -315,18 +356,22 @@ define('views/fields/text', 'views/fields/base', function (Dep) { this.getPreferences().get('emailUseExternalClient') || !this.getAcl().checkScope('Email', 'create') ) { - require('email-helper', function (EmailHelper) { + require('email-helper', (EmailHelper) => { var emailHelper = new EmailHelper(); + var link = emailHelper.composeMailToLink(attributes, this.getConfig().get('outboundEmailBccAddress')); + document.location.href = link; - }.bind(this)); + }); return; } - var viewName = this.getMetadata().get('clientDefs.' + this.scope + '.modalViews.compose') || 'views/modals/compose-email'; + var viewName = this.getMetadata().get('clientDefs.' + this.scope + '.modalViews.compose') || + 'views/modals/compose-email'; this.notify('Loading...'); + this.createView('quickCreate', viewName, { attributes: attributes, }, function (view) { diff --git a/client/src/views/stream.js b/client/src/views/stream.js index e0da2b0105..92915ed43b 100644 --- a/client/src/views/stream.js +++ b/client/src/views/stream.js @@ -38,24 +38,30 @@ define('views/stream', 'view', function (Dep) { events: { 'click button[data-action="refresh"]': function () { - if (!this.hasView('list')) return; + if (!this.hasView('list')) { + return; + } + this.getView('list').showNewRecords(); }, 'click button[data-action="selectFilter"]': function (e) { var data = $(e.currentTarget).data(); + this.actionSelectFilter(data); }, }, data: function () { var filter = this.filter; + if (filter === false) { filter = 'all'; } + return { displayTitle: this.options.displayTitle, filterList: this.filterList, - filter: filter + filter: filter, }; }, @@ -63,40 +69,45 @@ define('views/stream', 'view', function (Dep) { this.filter = this.options.filter || this.filter; this.wait(true); - this.getModelFactory().create('Note', function (model) { + + this.getModelFactory().create('Note', (model) => { this.createView('createPost', 'views/stream/record/edit', { el: this.options.el + ' .create-post-container', model: model, - interactiveMode: true - }, function (view) { - this.listenTo(view, 'after:save', function () { + interactiveMode: true, + }, (view) => { + this.listenTo(view, 'after:save', () => { this.getView('list').showNewRecords(); - }, this); - }, this); + }); + }); + this.wait(false); - }, this); + }); }, afterRender: function () { this.notify('Loading...'); - this.getCollectionFactory().create('Note', function (collection) { + + this.getCollectionFactory().create('Note', (collection) => { this.collection = collection; collection.url = 'Stream'; this.setFilter(this.filter); - this.listenToOnce(collection, 'sync', function () { + this.listenToOnce(collection, 'sync', () => { this.createView('list', 'views/stream/record/list', { el: this.options.el + ' .list-container', collection: collection, isUserStream: true, - }, function (view) { + }, (view) => { view.notify(false); + view.render(); }); - }, this); + }); + collection.fetch(); - }, this); + }); }, actionSelectFilter: function (data) { @@ -105,33 +116,36 @@ define('views/stream', 'view', function (Dep) { var internalFilter = name; - if (filter == 'all') { + if (filter === 'all') { internalFilter = false; } this.filter = internalFilter; this.setFilter(this.filter); - this.filterList.forEach(function (item) { + this.filterList.forEach((item) => { var $el = this.$el.find('.page-header button[data-action="selectFilter"][data-name="'+item+'"]'); + if (item === filter) { $el.addClass('active'); } else { $el.removeClass('active'); } - }, this); + }); var url = '#Stream'; + if (this.filter) { url += '/' + filter; } + this.getRouter().navigate(url); Espo.Ui.notify(this.translate('pleaseWait', 'messages')); - this.listenToOnce(this.collection, 'sync', function () { + this.listenToOnce(this.collection, 'sync', () => { Espo.Ui.notify(false); - }, this); + }); this.collection.reset(); this.collection.fetch(); @@ -139,9 +153,11 @@ define('views/stream', 'view', function (Dep) { setFilter: function (filter) { this.collection.data.filter = null; + if (filter) { this.collection.data.filter = filter; } + this.collection.offset = 0; this.collection.maxSize = this.getConfig().get('recordsPerPage') || this.collection.maxSize; }, diff --git a/client/src/views/stream/fields/post.js b/client/src/views/stream/fields/post.js index 7706b41aba..750b3bf390 100644 --- a/client/src/views/stream/fields/post.js +++ b/client/src/views/stream/fields/post.js @@ -33,20 +33,20 @@ define('views/stream/fields/post', 'views/fields/text', function (Dep) { getValueForDisplay: function () { var text = Dep.prototype.getValueForDisplay.call(this); - if (this.mode == 'detail' || this.mode == 'list') { + if (this.mode === 'detail' || this.mode === 'list') { var mentionData = (this.model.get('data') || {}).mentions || {}; - Object.keys(mentionData).sort(function (a, b) { - return a.length < b.length - }).forEach(function (item) { + Object.keys(mentionData).sort((a, b) => { + return a.length < b.length; + }).forEach((item) => { var part = '[' + mentionData[item].name + '](#User/view/'+mentionData[item].id + ')'; + text = text.replace(new RegExp(item, 'g'), part); - }.bind(this)); + }); } return text; }, }); - }); diff --git a/client/src/views/stream/panel.js b/client/src/views/stream/panel.js index f2a0642604..db86bb99df 100644 --- a/client/src/views/stream/panel.js +++ b/client/src/views/stream/panel.js @@ -242,7 +242,8 @@ define('views/stream/panel', ['views/record/panels/relationship', 'lib!Textcompl rows: 25, }, model: this.seed, - placeholderText: this.placeholderText + placeholderText: this.placeholderText, + noResize: true, }, (view) => { this.initPostEvents(view); }); diff --git a/client/src/views/stream/record/edit.js b/client/src/views/stream/record/edit.js index 8797336a0d..cca2bb084c 100644 --- a/client/src/views/stream/record/edit.js +++ b/client/src/views/stream/record/edit.js @@ -176,6 +176,7 @@ define('views/stream/record/edit', 'views/record/base', function (Dep) { required: true, rowsMin: 1, rows: 25, + noResize: true, }); this.createField('attachments', 'views/stream/fields/attachment-multiple', {});