pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] mail: composer: use textarea in client action

Browse Source 
... allowing multi-line edition, like in the chatter.

Shortcuts:
	- in the client action: ENTER sends, SHIFT+ENTER goes to newline
	- in the chatter: SHIFT+ENTER sends, ENTER goes to newline

Don't use autosize anymore to resize the textarea according to its content as
it didn't fit well within the flex layout of the client action ('height: auto'
didn't increase the height of the flex-item with 'flex-grow: 0'). We perform
the resizing ourselves instead.
This commit is contained in:
Aaron Bohy
2015-10-22 14:43:13 +02:00
committed by Géry Debongnie
parent 4d54a8c0ff
commit cfc18172a5
6 changed files with 51 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/mail/static/src/js/chatter.js
+12 -15
View File
@@ -6,6 +6,7 @@ var ChatComposer = require('mail.ChatComposer');
var ChatThread = require('mail.ChatThread');
var ajax = require('web.ajax');
var config = require('web.config');
var core = require('web.core');
var data = require('web.data');
var Dialog = require('web.Dialog');
@@ -469,13 +470,6 @@ var ChatterComposer = ChatComposer.extend({
return $.when(this._super.apply(this, arguments), this.message_get_suggested_recipients());
},
start: function () {
var self = this;
return this._super.apply(this, arguments).then(function () {
autosize(self.$input);
});
},
preprocess_message: function () {
var self = this;
var def = $.Deferred();
@@ -519,13 +513,10 @@ var ChatterComposer = ChatComposer.extend({
},
/**
* Override keydown event handler to go to next line on ENTER and send message on CTRL+ENTER
*/
on_keydown: function (event) {
if (!event.ctrlKey && (event.keyCode === $.ui.keyCode.ENTER) && !this.get('mention_partners').length) {
return;
}
this._super(event);
* Send the message on SHIFT+ENTER, but go to new line on ENTER
*/
prevent_send: function (event) {
return !event.shiftKey;
},
message_get_suggested_recipients: function () {
@@ -844,9 +835,12 @@ var Chatter = form_common.AbstractField.extend({
var old_composer = this.composer;
// create the new composer
this.composer = new ChatterComposer(this, this.thread_dataset, {
context: this.context,
input_min_height: 50,
input_max_height: Number.MAX_VALUE, // no max_height limit for the chatter
input_baseline: 14,
internal_subtypes: this.options.internal_subtypes,
is_log: options && options.is_log,
context: this.context,
record_name: this.record_name,
});
this.composer.insertBefore(this.$('.o_mail_thread')).then(function () {
@@ -854,6 +848,9 @@ var Chatter = form_common.AbstractField.extend({
if (old_composer) {
old_composer.destroy();
}
if (!config.device.touch) {
self.composer.focus();
}
self.composer.on('post_message', self, self.on_post_message);
self.composer.on('need_refresh', self, self.refresh_followers);
});
addons/mail/static/src/js/composer.js
+32 -3
View File
@@ -30,6 +30,9 @@ var Composer = Widget.extend({
this._super.apply(this, arguments);
this.options = _.defaults(options || {}, {
context: {},
input_baseline: 18,
input_max_height: 150,
input_min_height: 28,
mention_delimiter: '@',
mention_min_length: 2,
mention_typing_speed: 400,
@@ -56,7 +59,7 @@ var Composer = Widget.extend({
this.$mention_partner_tags = this.$('.o_composer_mentioned_partners');
this.$mention_dropdown = this.$('.o_composer_mention_dropdown');
this.$input = this.$('.o_composer_input');
this.$input.focus();
this.resize_input();
// Attachments
$(window).on(this.fileupload_id, this.on_attachment_loaded);
@@ -107,6 +110,7 @@ var Composer = Widget.extend({
// Empty input, selected partners and attachments
self.$input.val('');
self.resize_input();
self.set('mention_selected_partners', []);
self.set('attachment_ids', []);
@@ -114,6 +118,19 @@ var Composer = Widget.extend({
});
},
/**
* Resizes the textarea according to its scrollHeight
* @param {Boolean} [force_resize] if not true, only reset the size if empty
*/
resize_input: function (force_resize) {
if (this.$input.val() === '') {
this.$input.css('height', this.options.input_min_height);
} else if (force_resize) {
var height = this.$input.prop('scrollHeight') + this.options.input_baseline;
this.$input.css('height', Math.min(this.options.input_max_height, height));
}
},
// Events
on_click_add_attachment: function () {
this.$('input.o_form_input_file').click();
@@ -125,6 +142,13 @@ var Composer = Widget.extend({
this.$input.focus();
},
/**
* Send the message on ENTER, but go to new line on SHIFT+ENTER
*/
prevent_send: function (event) {
return event.shiftKey;
},
on_keydown: function (event) {
switch(event.which) {
// UP, DOWN: prevent moving cursor if navigation in mention propositions
@@ -141,9 +165,13 @@ var Composer = Widget.extend({
break;
// ENTER: submit the message only if the dropdown mention proposition is not displayed
case $.ui.keyCode.ENTER:
event.preventDefault();
if (!this.get('mention_partners').length) {
if (this.get('mention_partners').length) {
event.preventDefault();
} else if (!this.prevent_send(event)) {
event.preventDefault();
this.send_message();
} else {
this.resize_input(true);
}
break;
}
@@ -174,6 +202,7 @@ var Composer = Widget.extend({
} else {
this.set('mention_partners', []); // close the dropdown
}
this.resize_input();
}
},
addons/mail/static/src/less/chatter.less
+2
View File
@@ -29,6 +29,8 @@
.o_composer_input {
width: 100%;
.box-sizing(content-box);
resize: vertical;
margin-bottom: 5px;
}
}
addons/mail/static/src/less/composer.less
+4
View File
@@ -1,3 +1,7 @@
.o_composer .o_composer_input {
resize: none;
}
.o_composer_mentioned_partners, .o_composer_attachments_list {
margin-top: 5px;
text-align: justify;
addons/mail/static/src/xml/chatter.xml
-5
View File
@@ -52,11 +52,6 @@
</t>
</t>
<!-- Replace the input by a textarea -->
<t t-jquery=".o_composer_input" t-operation="replace">
<textarea class="o_composer_input" placeholder="Write something"/>
</t>
<!-- Add a button to open the full composer dialog -->
<t t-jquery=".o_composer_buttons" t-operation="append">
<button class="btn btn-sm btn-icon fa fa-pencil-square-o o_composer_button_full_composer" type="button"/>
addons/mail/static/src/xml/composer.xml
+1 -1
View File
@@ -4,7 +4,7 @@
<div t-name="mail.ChatComposer" class="o_chat_composer">
<div class="o_composer">
<div class="dropup o_composer_mention_dropdown"/>
<input type="text" class="o_composer_input" placeholder="Write something"/>
<textarea class="o_composer_input" placeholder="Write something"/>
<div class="btn-group o_composer_buttons">
<button class="btn btn-sm btn-primary o_composer_button_send" type="button">Send</button>
<button class="btn btn-sm btn-icon fa fa-smile-o o_composer_button_emoji" type="button" data-toggle="popover"/>