compose: Add support for full size compose box.

This commit makes a working toggler in compose_actions that adds the
compose-fullscreen class to the compose that removes the max-height
from the compose textarea and adds flex elements above so that the
height automatically adjust with the device height. This results in
making the compose box full screen sized.

The compose_height.js maintains the state of the height of the compose
box. Also, when the compose box is closed, the compose box is reset to
it's default behaviour and original height. So, everytime user need
not toggle off the compose full size and only for specific message
it is used.

It also adds destroy autosize on compose_height state change.
It destroys the autosize of textarea when the full
screen sized compose box is toggled on. And everytime when it is
turned off, it reinitialises the autosize. This also adds a
condition in autosize_textarea to only autosize when composebox
is not in full height state.

Fixes #17660
This commit is contained in:
Signior-X
2021-05-17 16:45:11 +05:30
committed by Tim Abbott
parent 739ee1d15f
commit 6cf33c4275
6 changed files with 143 additions and 11 deletions

View File

@@ -120,11 +120,13 @@ function clear_box() {
}
export function autosize_message_content() {
autosize($("#compose-textarea"), {
callback() {
maybe_scroll_up_selected_message();
},
});
if (!compose_ui.is_full_size()) {
autosize($("#compose-textarea"), {
callback() {
maybe_scroll_up_selected_message();
},
});
}
}
export function expand_compose_box() {
@@ -281,6 +283,9 @@ export function start(msg_type, opts) {
}
export function cancel() {
// As user closes the compose box, restore the compose box max height
compose_ui.make_compose_box_original_size();
$("#compose-textarea").height(40 + "px");
if (page_params.narrow !== undefined) {