Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
zulip/static/templates/compose.hbs

116 lines
6.9 KiB
Handlebars
Raw Normal View History

compose: Move to `hbs` file and append it to DOM on init. We move compose.html to compose.hbs file while keeping `#compose` still in `home.html` as a hanger where append rest of the elements. This will provide us with two benefits: * We could share common elements between message_edit_form and compose. * We can insert compose directly in any element. We may decide to do it for recent topics.
2021-04-14 13:10:34 +02:00
<div id="compose-container">
<div id="compose_controls" class="compose-content new-style">
<div id="nonexistent_stream_reply_error" class="alert-error">
<span class="compose-send-status-close">&times;</span>
<span id="compose-reply-error-msg"></span>
</div>
<div id="compose_buttons">
frontend: Change 'reply' button label to reflect selected message. The 'reply' button shows the stream>topic or recipient(s) of the selected message, for better UX. It also expands to fill the remaining horizontal space in the button bar -- this should help make it easier for new users to figure out how to reply. Finally, it uses "Message" instead of "Reply", to better match the compose box. Fixes #17940.
2021-04-15 02:59:34 +02:00
<span class="new_message_button reply_button_container">
compose: Revert placeholder styling for bottom reply button. * Revert "frontend: Remove hover effect from small messagebox." This reverts commit 27d964327496f4f6236db2f21fb580e4136e0a83. * Revert "frontend: Use placeholder style for small messagebox text." This reverts commit 8453aac26053cdc0d639095548855de013a6b682. * Revert "frontend: Make "Reply" button look more like a textbox." This reverts commit 9fdd7184c61fbe28d47b8df3585a098b6a1895ea.
2021-05-10 21:52:57 +02:00
<button type="button" class="button small rounded compose_reply_button"
frontend: Change 'reply' button label to reflect selected message. The 'reply' button shows the stream>topic or recipient(s) of the selected message, for better UX. It also expands to fill the remaining horizontal space in the button bar -- this should help make it easier for new users to figure out how to reply. Finally, it uses "Message" instead of "Reply", to better match the compose box. Fixes #17940.
2021-04-15 02:59:34 +02:00
id="left_bar_compose_reply_button_big"
title="{{t 'Reply' }} (r)">
compose: Revert placeholder styling for bottom reply button. * Revert "frontend: Remove hover effect from small messagebox." This reverts commit 27d964327496f4f6236db2f21fb580e4136e0a83. * Revert "frontend: Use placeholder style for small messagebox text." This reverts commit 8453aac26053cdc0d639095548855de013a6b682. * Revert "frontend: Make "Reply" button look more like a textbox." This reverts commit 9fdd7184c61fbe28d47b8df3585a098b6a1895ea.
2021-05-10 21:52:57 +02:00
<span class="compose_reply_button_label">
frontend: Change 'reply' button label to reflect selected message. The 'reply' button shows the stream>topic or recipient(s) of the selected message, for better UX. It also expands to fill the remaining horizontal space in the button bar -- this should help make it easier for new users to figure out how to reply. Finally, it uses "Message" instead of "Reply", to better match the compose box. Fixes #17940.
2021-04-15 02:59:34 +02:00
{{#tr}}
Message <z-recipient></z-recipient>
{{#*inline "z-recipient"}}<span class="compose_reply_button_recipient_label"></span>{{/inline}}
{{/tr}}
</span>
</button>
</span>
compose: Move to `hbs` file and append it to DOM on init. We move compose.html to compose.hbs file while keeping `#compose` still in `home.html` as a hanger where append rest of the elements. This will provide us with two benefits: * We could share common elements between message_edit_form and compose. * We can insert compose directly in any element. We may decide to do it for recent topics.
2021-04-14 13:10:34 +02:00
<span class="new_message_button">
<a class="drafts-link no-underline button small rounded compose_drafts_button" href="#drafts" title="{{t 'Drafts' }} (d)">
{{t 'Drafts' }}
</a>
<span class="alert-draft pull-left">{{t 'Saved as draft' }}</span>
</span>
frontend: Change 'reply' button label to reflect selected message. The 'reply' button shows the stream>topic or recipient(s) of the selected message, for better UX. It also expands to fill the remaining horizontal space in the button bar -- this should help make it easier for new users to figure out how to reply. Finally, it uses "Message" instead of "Reply", to better match the compose box. Fixes #17940.
2021-04-15 02:59:34 +02:00
<span class="new_message_button mobile_button_container">
compose: Move to `hbs` file and append it to DOM on init. We move compose.html to compose.hbs file while keeping `#compose` still in `home.html` as a hanger where append rest of the elements. This will provide us with two benefits: * We could share common elements between message_edit_form and compose. * We can insert compose directly in any element. We may decide to do it for recent topics.
2021-04-14 13:10:34 +02:00
<button type="button" class="button small rounded compose_mobile_button"
id="left_bar_compose_mobile_button_big"
title="{{t 'New message' }} (c)">
<span>+</span>
</button>
</span>
frontend: Change 'reply' button label to reflect selected message. The 'reply' button shows the stream>topic or recipient(s) of the selected message, for better UX. It also expands to fill the remaining horizontal space in the button bar -- this should help make it easier for new users to figure out how to reply. Finally, it uses "Message" instead of "Reply", to better match the compose box. Fixes #17940.
2021-04-15 02:59:34 +02:00
<span class="new_message_button stream_button_container">
compose: Move to `hbs` file and append it to DOM on init. We move compose.html to compose.hbs file while keeping `#compose` still in `home.html` as a hanger where append rest of the elements. This will provide us with two benefits: * We could share common elements between message_edit_form and compose. * We can insert compose directly in any element. We may decide to do it for recent topics.
2021-04-14 13:10:34 +02:00
<button type="button" class="button small rounded compose_stream_button"
id="left_bar_compose_stream_button_big"
title="{{t 'New topic' }} (c)">
<span class="compose_stream_button_label">{{t 'New topic' }}</span>
</button>
</span>
{{#unless embedded }}
frontend: Change 'reply' button label to reflect selected message. The 'reply' button shows the stream>topic or recipient(s) of the selected message, for better UX. It also expands to fill the remaining horizontal space in the button bar -- this should help make it easier for new users to figure out how to reply. Finally, it uses "Message" instead of "Reply", to better match the compose box. Fixes #17940.
2021-04-15 02:59:34 +02:00
<span class="new_message_button private_button_container">
compose: Move to `hbs` file and append it to DOM on init. We move compose.html to compose.hbs file while keeping `#compose` still in `home.html` as a hanger where append rest of the elements. This will provide us with two benefits: * We could share common elements between message_edit_form and compose. * We can insert compose directly in any element. We may decide to do it for recent topics.
2021-04-14 13:10:34 +02:00
<button type="button" class="button small rounded compose_private_button"
id="left_bar_compose_private_button_big"
title="{{t 'New private message' }} (x)">
<span class="compose_private_button_label">{{t 'New private message' }}</span>
</button>
</span>
{{/unless}}
</div>
</div>
<div class="message_comp compose-content">
<div class="alert" id="compose-send-status">
<span class="compose-send-status-close">&times;</span>
<span id="compose-error-msg"></span>
</div>
<div id="compose_invite_users" class="alert home-error-bar"></div>
<div id="compose-all-everyone" class="alert home-error-bar"></div>
<div id="compose-announce" class="alert home-error-bar"></div>
<div id="compose_not_subscribed" class="alert home-error-bar"></div>
<div id="compose_private_stream_alert" class="alert home-error-bar"></div>
<div id="out-of-view-notification" class="notification-alert"></div>
<div class="composition-area">
<button type="button" class="close" id='compose_close' title="{{t 'Cancel compose' }} (Esc)">&times;</button>
<form id="send_message_form" action="/json/messages" method="post">
{{ csrf_input }}
<div class="compose_table">
<div id="stream-message">
<div class="stream-selection-header-colorblock message_header_stream left_part"></div>
<div class="right_part">
<span id="compose-lock-icon">
<i class="fa fa-lock" title="{{t 'This is a private stream' }}" aria-hidden="true"></i>
</span>
<input type="text" class="recipient_box" name="stream_message_recipient_stream" id="stream_message_recipient_stream" maxlength="30" value="" placeholder="{{t 'Stream' }}" autocomplete="off" tabindex="0" aria-label="{{t 'Stream' }}" />
<i class="fa fa-angle-right" aria-hidden="true"></i>
<input type="text" class="recipient_box" name="stream_message_recipient_topic" id="stream_message_recipient_topic" maxlength="60" value="" placeholder="{{t 'Topic' }}" autocomplete="off" tabindex="0" aria-label="{{t 'Topic' }}" />
</div>
</div>
<div id="private-message">
<div class="to_text">
<span>{{t 'To' }}:</span>
</div>
<div class="right_part">
<div class="pm_recipient">
<div class="pill-container" data-before="{{t 'You and' }}">
<div class="input" contenteditable="true" id="private_message_recipient" data-no-recipients-text="{{t 'Add one or more users' }}" data-some-recipients-text="{{t 'Add another user...' }}"></div>
</div>
</div>
</div>
</div>
<div>
<div class="messagebox">
<textarea class="new_message_textarea" name="content" id='compose-textarea' placeholder="{{t 'Compose your message here' }}" tabindex="0" maxlength="10000" aria-label="{{t 'Compose your message here...' }}"></textarea>
<div class="scrolling_list preview_message_area" data-simplebar id="preview_message_area" style="display:none;">
compose: Use `class` to find `markdown_preview` related elements. We convert the following elements to use a class instead of id for accessing them across the codebase: * markdown_preview * undo_markdown_preview * markdown_preview_spinner * message_edit_content * preview_content Converted them together since changes to one impacted the other in some modules like click_handlers. Also, added a function in rows to get `message_row`.
2021-04-20 19:50:01 +02:00
<div class="markdown_preview_spinner"></div>
<div class="preview_content rendered_markdown"></div>
compose: Move to `hbs` file and append it to DOM on init. We move compose.html to compose.hbs file while keeping `#compose` still in `home.html` as a hanger where append rest of the elements. This will provide us with two benefits: * We could share common elements between message_edit_form and compose. * We can insert compose directly in any element. We may decide to do it for recent topics.
2021-04-14 13:10:34 +02:00
</div>
<div class="drag"></div>
<div id="below-compose-content">
<button type="submit" id="compose-send-button" class="button small send_message" title="{{t 'Send' }} (Ctrl + Enter)">{{t 'Send' }}</button>
compose: Move control buttons into a file of their own. These buttons are common with message_edit_form.hbs, we will be sharing this file among compose and message_edit_form.
2021-04-14 21:31:56 +02:00
{{> compose_control_buttons }}
compose: Move to `hbs` file and append it to DOM on init. We move compose.html to compose.hbs file while keeping `#compose` still in `home.html` as a hanger where append rest of the elements. This will provide us with two benefits: * We could share common elements between message_edit_form and compose. * We can insert compose directly in any element. We may decide to do it for recent topics.
2021-04-14 13:10:34 +02:00
<span id="sending-indicator"></span>
<div id="send_controls" class="new-style">
<label id="enter-sends-label" class="compose_checkbox_label checkbox">
<input type="checkbox" id="enter_sends" />
<span></span>{{t 'Press Enter to send' }}
</label>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>