diff sat_templates/templates/bulma/chat/message_input.html @ 411:f7a434581872 default tip

chat: Add forward, rich editing and extra recipients: - There is a new "forward" menu in message. For now, a simple prompt ask for recipient JID. - A new "extra" menu is available next to input field. Inside there are 2 items for now: add extra recipient, and toggle rich edit mode. - Extra recipient option add a field to add an email-like "to", "cc" or "bcc" recipients. - Rich edit let use rich styling such as bold, italic, underline, etc. rel 461
author Goffi <goffi@goffi.org>
date Fri, 04 Jul 2025 17:33:22 +0200
parents 049a0638f6fa
children
line wrap: on
line diff
--- a/sat_templates/templates/bulma/chat/message_input.html	Fri Jul 04 12:41:07 2025 +0200
+++ b/sat_templates/templates/bulma/chat/message_input.html	Fri Jul 04 17:33:22 2025 +0200
@@ -20,8 +20,42 @@
             </div>
         </div>
 
+        <!-- Rich Editor Toolbar -->
+        <div id="rich-edit-toolbar" class="field is-grouped is-grouped-multiline is-hidden">
+            <div class="control">
+                <button class="rich-editor-btn button" type="button" data-action="bold">
+                    <span class="icon"><i class="fas fa-bold fa-sm"></i></span>
+                </button>
+            </div>
+            <div class="control">
+                <button class="rich-editor-btn button" type="button" data-action="italic">
+                    <span class="icon"><i class="fas fa-italic fa-sm"></i></span>
+                </button>
+            </div>
+            <div class="control">
+                <button class="rich-editor-btn button" type="button" data-action="underline">
+                    <span class="icon"><i class="fas fa-underline fa-sm"></i></span>
+                </button>
+            </div>
+            <div class="control">
+                <button class="rich-editor-btn button" type="button" data-action="list-bullet">
+                    <span class="icon"><i class="fas fa-list-ul fa-sm"></i></span>
+                </button>
+            </div>
+            <div class="control">
+                <button class="rich-editor-btn button" type="button" data-action="list-ordered">
+                    <span class="icon"><i class="fas fa-list-ol fa-sm"></i></span>
+                </button>
+            </div>
+            <div class="control">
+                <button class="rich-editor-btn button" type="button" data-action="link">
+                    <span class="icon"><i class="fas fa-link fa-sm"></i></span>
+                </button>
+            </div>
+        </div>
 
-        <div class="field has-addons">
+        <!-- Main Input -->
+        <div class="field has-addons is-align-items-flex-end">
             <div class="control">
                 <button id="attach-button" class="button">
                     <span class="icon is-small">
@@ -30,8 +64,16 @@
                 </button>
                 <input id="file-input" type="file" multiple="true" style="display: none" />
             </div>
+            <div class="control">
+                <button id="input-extra-button" class="button">
+                    <span class="icon is-small">
+                    {{ icon('ellipsis-vertical') }}
+                    </span>
+                </button>
+            </div>
             <div class="control is-expanded">
              <textarea id="message_input_area" class="textarea" name="message_input_area" type="text" rows="1" placeholder="{{_("Type your message…")}}"></textarea>
+             <div id="message_input_area_rich" class="is-hidden"></div>
             </div>
             <div class="control">
                 <button class="button is-primary">