Arsharth/hydrogen-web
1
0
Fork 0
forked from mystiq/hydrogen-web
Code Issues Pull requests Packages Projects Releases Wiki Activity

Resize composer with text

Browse source 
Signed-off-by: RMidhunSuresh <hi@midhun.dev>
This commit is contained in:
RMidhunSuresh 2021-10-29 17:00:02 +05:30
parent 3a6e74ae1c
commit 6863fef7e5
2 changed files with 18 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/platform/web/ui/css/themes/element/theme.css
View file

@ -537,7 +537,6 @@ a {
}
.MessageComposer_input > textarea {
padding: 0 16px;
border: none;
border-radius: 24px;
background: #F6F6F6;
@ -548,6 +547,8 @@ a {
flex: 1;
padding: 14px;
box-sizing: border-box;
overflow: hidden;
max-height: 113px;
}
.MessageComposer_input > button.send {

18
src/platform/web/ui/session/room/MessageComposer.js
View file

@ -31,8 +31,12 @@ export class MessageComposer extends TemplateView {
this._input = t.textarea({
enterkeyhint: 'send',
onKeydown: e => this._onKeyDown(e),
onInput: () => vm.setInput(this._input.value),
placeholder: vm.isEncrypted ? "Send an encrypted message…" : "Send a message…"
onInput: () => {
vm.setInput(this._input.value);
this._adjustHeight();
},
placeholder: vm.isEncrypted ? "Send an encrypted message…" : "Send a message…",
rows: "1"
});
this._focusInput = () => this._input.focus();
this.value.on("focus", this._focusInput);
@ -82,6 +86,7 @@ export class MessageComposer extends TemplateView {
this._input.focus();
if (await this.value.sendMessage(this._input.value)) {
this._input.value = "";
this._adjustHeight();
}
}
@ -105,4 +110,13 @@ export class MessageComposer extends TemplateView {
this._attachmentPopup.showRelativeTo(evt.target, 12);
}
}
_adjustHeight() {
window.requestAnimationFrame(() => {
this._input.style.height = "auto";
const scrollHeight = this._input.scrollHeight;
this._input.style.height = `${scrollHeight}px`;
});
}
}