message box

pull/7748/head
Guilherme Gazzo 9 years ago
parent 09e7d09390
commit 39bfbbf1a2
No known key found for this signature in database
GPG Key ID: 1F85C9AD922D0829
  1. 12
      packages/rocketchat-lib/client/MessageAction.js
  2. 1
      packages/rocketchat-livechat/app/client/views/messages.js
  3. 18
      packages/rocketchat-theme/client/imports/general/base_old.css
  4. 3
      packages/rocketchat-ui-message/client/messageBox.html
  5. 2
      packages/rocketchat-ui-message/client/messageBox.js
  6. 6
      packages/rocketchat-ui/client/lib/chatMessages.js
  7. 1
      packages/rocketchat-ui/client/lib/textarea-autogrow.js
  8. 2
      packages/rocketchat-ui/client/views/app/room.html
  9. 11
      packages/rocketchat-ui/client/views/app/room.js

@ -133,15 +133,15 @@ Meteor.startup(function() {
icon: 'icon-pencil', icon: 'icon-pencil',
i18nLabel: 'Edit', i18nLabel: 'Edit',
context: ['message', 'message-mobile'], context: ['message', 'message-mobile'],
action(e, instance) { action(e) {
const message = $(e.currentTarget).closest('.message')[0]; const message = $(e.currentTarget).closest('.message')[0];
chatMessages[Session.get('openedRoom')].edit(message); chatMessages[Session.get('openedRoom')].edit(message);
RocketChat.MessageAction.hideDropDown(); RocketChat.MessageAction.hideDropDown();
const input = instance.find('.input-message'); // const input = instance.find('.input-message');
Meteor.setTimeout(() => { // Meteor.setTimeout(() => {
input.focus(); // input.focus();
input.updateAutogrow(); // input.change();
}, 200); // }, 200);
}, },
validation(message) { validation(message) {
if (RocketChat.models.Subscriptions.findOne({ if (RocketChat.models.Subscriptions.findOne({

@ -177,6 +177,7 @@ Template.messages.onRendered(function() {
template.atBottom = messages.scrollTop >= messages.scrollHeight - messages.clientHeight; template.atBottom = messages.scrollTop >= messages.scrollHeight - messages.clientHeight;
}, 200); }, 200);
Meteor.setInterval(function() { Meteor.setInterval(function() {
if (template.atBottom) { if (template.atBottom) {
messages.scrollTop = messages.scrollHeight - messages.clientHeight; messages.scrollTop = messages.scrollHeight - messages.clientHeight;
newMessage.className = 'new-message not'; newMessage.className = 'new-message not';

@ -396,7 +396,7 @@
box-shadow: 0 0 0; box-shadow: 0 0 0;
} }
.rc-old textarea, /*.rc-old textarea,*/
.rc-old select, .rc-old select,
.rc-old input[type='text'], .rc-old input[type='text'],
.rc-old input[type='number'], .rc-old input[type='number'],
@ -2022,7 +2022,7 @@
z-index: 1; z-index: 1;
&-wrapper { &-wrapper {
height: 100%; height: calc(100% - 61px);
display: flex; display: flex;
} }
@ -2030,6 +2030,8 @@
flex: 1 1 auto; flex: 1 1 auto;
width: 50%; width: 50%;
position: relative; position: relative;
display: flex;
flex-direction: column;
} }
& .room-topic { & .room-topic {
@ -2055,16 +2057,6 @@
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
} }
& .footer {
padding: 8px 20px 0;
border-width: 1px 0 0;
z-index: 100;
bottom: 0;
left: 0;
width: 100%;
min-height: var(--footer-min-height);
}
& .message-form { & .message-form {
margin-bottom: 18px; margin-bottom: 18px;
@ -2417,7 +2409,7 @@
position: relative; position: relative;
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
height: calc(100% - 130px); flex: 1 1 100%;
& .message-cog-container .message-action.jump-to-search-message { & .message-cog-container .message-action.jump-to-search-message {
display: none !important; display: none !important;

@ -21,8 +21,7 @@
</div> </div>
{{/with}} {{/with}}
<div class="rc-message-box__container"> <div class="rc-message-box__container">
<div class="rc-message-box__icon emoji-picker-icon">
<div class="rc-message-box__icon">
<svg class="rc-input__icon-svg rc-input__icon-svg--smile"> <svg class="rc-input__icon-svg rc-input__icon-svg--smile">
<use href="#icon-smile"></use> <use href="#icon-smile"></use>
</svg> </svg>

@ -411,6 +411,8 @@ Template.messageBox.onRendered(function() {
this.$('.js-input-message').autogrow({ this.$('.js-input-message').autogrow({
animate: true, animate: true,
onInitialize: true onInitialize: true
}).on('autogrow', () => {
this.data && this.data.onResize && this.data.onResize();
}); });
}); });

@ -136,15 +136,17 @@ this.ChatMessages = class ChatMessages {
this.input.classList.add('editing'); this.input.classList.add('editing');
this.$input.closest('.message-form').addClass('editing'); this.$input.closest('.message-form').addClass('editing');
this.input.focus();
if (message.attachments && message.attachments[0].description) { if (message.attachments && message.attachments[0].description) {
this.input.value = message.attachments[0].description; this.input.value = message.attachments[0].description;
} else { } else {
this.input.value = msg; this.input.value = msg;
} }
$(this.input).change();
const cursor_pos = editingNext ? 0 : -1; const cursor_pos = editingNext ? 0 : -1;
return this.$input.setCursorPosition(cursor_pos); this.$input.setCursorPosition(cursor_pos);
this.input.focus();
return this.input;
} }
clearEditing() { clearEditing() {

@ -60,6 +60,7 @@
} }
$self.height(newHeight); $self.height(newHeight);
$self.trigger('autogrow', []);
if (settings.postGrowCallback !== null) { if (settings.postGrowCallback !== null) {
settings.postGrowCallback($self); settings.postGrowCallback($self);

@ -127,7 +127,7 @@
</div> </div>
</div> </div>
<footer class="footer border-component-color"> <footer class="footer border-component-color">
{{> messageBox}} {{> messageBox messageboxData}}
</footer> </footer>
</div> </div>
{{#with flexData}} {{#with flexData}}

@ -127,7 +127,15 @@ Template.room.helpers({
}); });
return (roomData.announcement !== undefined) && (roomData.announcement !== ''); return (roomData.announcement !== undefined) && (roomData.announcement !== '');
}, },
messageboxData() {
const instance = Template.instance();
return {
_id: this._id,
onResize: () => {
instance.sendToBottomIfNecessary();
}
};
},
roomAnnouncement() { roomAnnouncement() {
const roomData = Session.get(`roomData${ this._id }`); const roomData = Session.get(`roomData${ this._id }`);
if (!roomData) { return ''; } if (!roomData) { return ''; }
@ -741,6 +749,7 @@ Template.room.onRendered(function() {
}; };
template.sendToBottomIfNecessary = function() { template.sendToBottomIfNecessary = function() {
if ((template.atBottom === true) && (template.isAtBottom() !== true)) { if ((template.atBottom === true) && (template.isAtBottom() !== true)) {
return template.sendToBottom(); return template.sendToBottom();
} }

Loading…
Cancel
Save