compose: Use file_input class for file input element.

In both compose and `message_edit_form` we use `file_input`
class to identify the file `input` element. This will help
to more easily share common elements between compose and message_edit.
This commit is contained in:
Aman Agrawal
2021-04-20 14:14:55 +00:00
committed by Tim Abbott
parent eae1829ead
commit 7ae04a6ba8
7 changed files with 14 additions and 11 deletions

View File

@@ -1510,11 +1510,11 @@ test_ui("on_events", (override) => {
(function test_attach_files_compose_clicked() {
const handler = $("#compose").get_on_handler("click", "#attach_files");
$("#file_input").clone = (param) => {
$("#compose .file_input").clone = (param) => {
assert(param);
};
let compose_file_input_clicked = false;
$("#compose #file_input").on("click", () => {
$("#compose .file_input").on("click", () => {
compose_file_input_clicked = true;
});

View File

@@ -71,7 +71,10 @@ test("get_item", () => {
upload.get_item("send_status_message", {mode: "compose"}),
$("#compose-error-msg"),
);
assert.equal(upload.get_item("file_input_identifier", {mode: "compose"}), "#file_input");
assert.equal(
upload.get_item("file_input_identifier", {mode: "compose"}),
"#compose .file_input",
);
assert.equal(upload.get_item("source", {mode: "compose"}), "compose-file-input");
assert.equal(upload.get_item("drag_drop_container", {mode: "compose"}), $("#compose"));
assert.equal(
@@ -116,7 +119,7 @@ test("get_item", () => {
assert.equal(
upload.get_item("file_input_identifier", {mode: "edit", row: 123}),
`#message_edit_file_input_${CSS.escape(123)}`,
`#edit_form_${CSS.escape(123)} .file_input`,
);
assert.equal(upload.get_item("source", {mode: "edit", row: 123}), "message-edit-file-input");
assert.equal(
@@ -385,7 +388,7 @@ test("uppy_config", () => {
test("file_input", (override) => {
upload.setup_upload({mode: "compose"});
const change_handler = $("body").get_on_handler("change", "#file_input");
const change_handler = $("body").get_on_handler("change", "#compose .file_input");
const files = ["file1", "file2"];
const event = {
target: {

View File

@@ -336,7 +336,7 @@ export function initialize() {
e.preventDefault();
const row_id = rows.id($(this).closest(".message_row"));
$(`#message_edit_file_input_${CSS.escape(row_id)}`).trigger("click");
$(`#edit_form_${CSS.escape(row_id)} .file_input`).trigger("click");
});
$("body").on("click", ".message_edit_form [id^='markdown_preview_']", function (e) {

View File

@@ -1231,7 +1231,7 @@ export function initialize() {
$("#compose").on("click", "#attach_files", (e) => {
e.preventDefault();
$("#compose #file_input").trigger("click");
$("#compose .file_input").trigger("click");
});
$("body").on("click", ".video_link", (e) => {

View File

@@ -50,7 +50,7 @@ export function get_item(key, config) {
case "send_status_message":
return $("#compose-error-msg");
case "file_input_identifier":
return "#file_input";
return "#compose .file_input";
case "source":
return "compose-file-input";
case "drag_drop_container":
@@ -82,7 +82,7 @@ export function get_item(key, config) {
case "send_status_message":
return $(`#message-edit-send-status-${CSS.escape(config.row)}`).find(".error-msg");
case "file_input_identifier":
return `#message_edit_file_input_${CSS.escape(config.row)}`;
return `#edit_form_${CSS.escape(config.row)} .file_input`;
case "source":
return "message-edit-file-input";
case "drag_drop_container":

View File

@@ -1,4 +1,4 @@
<input type="file" id="file_input" class="notvisible pull-left" multiple />
<input type="file" class="file_input notvisible pull-left" multiple />
{{#if file_upload_enabled }}
<a role="button" class="compose_control_button fa fa-paperclip notdisplayed" aria-label="{{t 'Attach files' }}" id="attach_files" tabindex=0 title="{{t 'Attach files' }}"></a>
{{/if}}

View File

@@ -58,7 +58,7 @@
<button type="button" class="button small rounded message_edit_cancel">{{t "Cancel" }}</button>
{{#if is_content_editable}}
<div class="message-edit-feature-group">
<input type="file" id="message_edit_file_input_{{message_id}}" class="notvisible pull-left" multiple />
<input type="file" class="file_input notvisible pull-left" multiple />
{{#if file_upload_enabled}}
<a role="button" tabindex=0 class="compose_control_button fa fa-paperclip notdisplayed" aria-label="{{t "Attach files" }}" id="attach_files_{{message_id}}" title="{{t "Attach files" }}"></a>
{{/if}}