add message-forwarding functionality

Adds a new action button to messages in the chat-history for message- forwarding. The Button opens a modal dialog where the user can enter a destination for the message. The destination can be a user in the roster or a MUC that is currently opened.
conversejs · Nov 13, 2019 · a693fcb · a693fcb
1 parent 1f673b7
commit a693fcb
Show file tree

Hide file tree

Showing 15 changed files with 661 additions and 21 deletions.
diff --git a/CHANGES.md b/CHANGES.md
@@ -2,6 +2,7 @@
 
 ## 6.0.0 (Unreleased)
 
+- add message-forward (XEP-0297) capabilities
 - #129: Add support for XEP-0156: Disovering Alternative XMPP Connection Methods. Only XML is supported for now.
 - #1105: Preliminary support for storing persistent data in IndexedDB instead of localStorage
 - #1089: When filtering the roster for `online` users, show all non-offline users.

diff --git a/locale/converse.pot b/locale/converse.pot
@@ -1919,3 +1919,33 @@ msgstr ""
 #: dist/converse-no-dependencies.js:55061
 msgid "Re-sync your contacts"
 msgstr ""
+
+msgid "You can only send a message to an existing contact or an opened room."
+msgstr ""
+
+msgid "forward this message"
+msgstr ""
+
+msgid "Destination:"
+msgstr ""
+
+msgid "Additional Message:"
+msgstr ""
+
+msgid "Original-Text"
+msgstr ""
+
+msgid "Optional: Add additional message here..."
+msgstr ""
+
+msgid "forward"
+msgstr ""
+
+msgid "Forwarded Message:"
+msgstr ""
+
+msgid "original author:"
+msgstr ""
+
+msgid "time:"
+msgstr ""
diff --git a/locale/de/LC_MESSAGES/converse.po b/locale/de/LC_MESSAGES/converse.po
@@ -2493,3 +2493,33 @@ msgstr "Resynchronisieren Sie Ihre Kontakte"
 
 #~ msgid "Contact username"
 #~ msgstr "Benutzername"
+
+msgid "You can only send a message to an existing contact or an opened room."
+msgstr "Sie können eine Nachricht nur an einen existieren Kontakt oder offenen Chatraum senden."
+
+msgid "forward this message"
+msgstr "Nachricht weiterleiten"
+
+msgid "Destination:"
+msgstr "Empfänger:"
+
+msgid "Additional Message:"
+msgstr "Zusätzliche Nachricht"
+
+msgid "Original-Text"
+msgstr "Ursprüngliche Nachricht"
+
+msgid "Optional: Add additional message here..."
+msgstr "Optional: Geben Sie hier eine zusätzliche Nachricht ein..."
+
+msgid "forward"
+msgstr "weiterleiten"
+
+msgid "Forwarded Message:"
+msgstr "Weitergeleitete Nachricht:"
+
+msgid "original author:"
+msgstr "Ursprünglicher Autor:"
+
+msgid "time:"
+msgstr "Zeit:"
diff --git a/sass/_autocomplete.scss b/sass/_autocomplete.scss
@@ -10,6 +10,14 @@
         .suggestion-box {
             width: 100%;
         }
+        .forward-message {
+            overflow: visible;
+            border: black;
+            height: 100px;
+            border-radius: 5px;
+            background-color: lightgrey;
+            padding: 5px;
+        }
     }
 
     .suggestion-box {

diff --git a/sass/_messages.scss b/sass/_messages.scss
@@ -217,8 +217,9 @@
                     width: 100%;
                 }
             }
-
+            
             .chat-msg__actions {
+                width: 50px;
                 .chat-msg__action {
                     height: var(--message-font-size);
                     font-size: var(--message-font-size);
@@ -227,10 +228,11 @@
                     border: none;
                     opacity: 0;
                     background: transparent;
+                    width: 10px;
                     cursor: pointer;
-                    &:focus {
-                        display: block;
-                    }
+                    display: block;
+                    margin: 0px 0px 0px 10px;
+                    float: right;
                 }
             }
 
@@ -310,6 +312,24 @@
                 margin-right: 0.5em;
                 color: var(--message-receipt-color);
             }
+
+            .forwarded-message {
+                white-space: normal;
+                background-color: lightblue;
+                border-radius: 5px;
+                padding: 5px;               
+                margin-left: 5px;
+            }
+
+            .forwarded-message__content {
+                background-color: white;
+                border-radius: 5px;
+                padding-left: 5px;
+            }
+
+            .forwarded-message__header {
+                font-size: 11px;
+            }
         }
     }
 

diff --git a/spec/controlbox.js b/spec/controlbox.js
@@ -145,7 +145,7 @@
                     `<presence xmlns="jabber:client">`+
                         `<show>dnd</show>`+
                         `<priority>0</priority>`+
-                        `<c hash="sha-1" node="https://conversejs.org" ver="Hxbsr5fazs62i+O0GxIXf2OEDNs=" xmlns="http://jabber.org/protocol/caps"/>`+
+                        `<c hash="sha-1" node="https://conversejs.org" ver="Js7MzULrV40dmSBGeP+rd0MNV9c=" xmlns="http://jabber.org/protocol/caps"/>`+
                     `</presence>`);
                 const first_child = view.el.querySelector('.xmpp-status span:first-child');
                 expect(u.hasClass('online', first_child)).toBe(false);
@@ -174,7 +174,7 @@
                     `<presence xmlns="jabber:client">`+
                         `<status>I am happy</status>`+
                         `<priority>0</priority>`+
-                        `<c hash="sha-1" node="https://conversejs.org" ver="Hxbsr5fazs62i+O0GxIXf2OEDNs=" xmlns="http://jabber.org/protocol/caps"/>`+
+                        `<c hash="sha-1" node="https://conversejs.org" ver="Js7MzULrV40dmSBGeP+rd0MNV9c=" xmlns="http://jabber.org/protocol/caps"/>`+
                     `</presence>`);
 
                 const first_child = view.el.querySelector('.xmpp-status span:first-child');

diff --git a/spec/messages.js b/spec/messages.js
@@ -17,6 +17,7 @@
                 ['rosterGroupsFetched', 'chatBoxesFetched'], {},
                 async function (done, _converse) {
 
+            _converse.whitelisted_plugins = _converse.whitelisted_plugins.filter(e => e !== 'converse-forward-message');
             await test_utils.waitForRoster(_converse, 'current', 2);
             const contact_jid = mock.cur_names[0].replace(/ /g,'.').toLowerCase() + '@montague.lit';
             const forwarded_contact_jid = mock.cur_names[1].replace(/ /g,'.').toLowerCase() + '@montague.lit';
@@ -83,7 +84,7 @@
             expect(textarea.value).toBe('');
 
             const first_msg = view.model.messages.findWhere({'message': 'But soft, what light through yonder airlock breaks?'});
-            expect(view.el.querySelectorAll('.chat-msg .chat-msg__action').length).toBe(1);
+            expect(view.el.querySelectorAll('.chat-msg .chat-msg__action').length).toBe(2);
             let action = view.el.querySelector('.chat-msg .chat-msg__action');
             expect(action.getAttribute('title')).toBe('Edit this message');
 
@@ -160,7 +161,7 @@
                 .c('active', {'xmlns': 'http://jabber.org/protocol/chatstates'}).tree()
             );
             await new Promise(resolve => view.once('messageInserted', resolve));
-            expect(view.el.querySelectorAll('.chat-msg .chat-msg__action').length).toBe(1);
+            expect(view.el.querySelectorAll('.chat-msg .chat-msg__action').length).toBe(3);
 
             // Test confirmation dialog
             spyOn(window, 'confirm').and.returnValue(true);

diff --git a/spec/presence.js b/spec/presence.js
@@ -42,7 +42,7 @@
                 `<presence xmlns="jabber:client">`+
                     `<status>Hello world</status>`+
                     `<priority>0</priority>`+
-                    `<c hash="sha-1" node="https://conversejs.org" ver="Hxbsr5fazs62i+O0GxIXf2OEDNs=" xmlns="http://jabber.org/protocol/caps"/>`+
+                    `<c hash="sha-1" node="https://conversejs.org" ver="Js7MzULrV40dmSBGeP+rd0MNV9c=" xmlns="http://jabber.org/protocol/caps"/>`+
                 `</presence>`
             );
             _converse.priority = 2;
@@ -52,7 +52,7 @@
                     `<show>away</show>`+
                     `<status>Going jogging</status>`+
                     `<priority>2</priority>`+
-                    `<c hash="sha-1" node="https://conversejs.org" ver="Hxbsr5fazs62i+O0GxIXf2OEDNs=" xmlns="http://jabber.org/protocol/caps"/>`+
+                    `<c hash="sha-1" node="https://conversejs.org" ver="Js7MzULrV40dmSBGeP+rd0MNV9c=" xmlns="http://jabber.org/protocol/caps"/>`+
                 `</presence>`
             );
 
@@ -63,7 +63,7 @@
                     `<show>dnd</show>`+
                     `<status>Doing taxes</status>`+
                     `<priority>0</priority>`+
-                    `<c hash="sha-1" node="https://conversejs.org" ver="Hxbsr5fazs62i+O0GxIXf2OEDNs=" xmlns="http://jabber.org/protocol/caps"/>`+
+                    `<c hash="sha-1" node="https://conversejs.org" ver="Js7MzULrV40dmSBGeP+rd0MNV9c=" xmlns="http://jabber.org/protocol/caps"/>`+
                 `</presence>`
             );
             done();
@@ -91,7 +91,7 @@
                 .toBe(`<presence xmlns="jabber:client">`+
                         `<status>My custom status</status>`+
                         `<priority>0</priority>`+
-                        `<c hash="sha-1" node="https://conversejs.org" ver="Hxbsr5fazs62i+O0GxIXf2OEDNs=" xmlns="http://jabber.org/protocol/caps"/>`+
+                        `<c hash="sha-1" node="https://conversejs.org" ver="Js7MzULrV40dmSBGeP+rd0MNV9c=" xmlns="http://jabber.org/protocol/caps"/>`+
                         `</presence>`)
 
             await u.waitUntil(() => modal.el.getAttribute('aria-hidden') === "true");
@@ -101,7 +101,7 @@
             modal.el.querySelector('[type="submit"]').click();
             expect(_converse.connection.send.calls.mostRecent().args[0].toLocaleString())
                 .toBe(`<presence xmlns="jabber:client"><show>dnd</show><status>My custom status</status><priority>0</priority>`+
-                        `<c hash="sha-1" node="https://conversejs.org" ver="Hxbsr5fazs62i+O0GxIXf2OEDNs=" xmlns="http://jabber.org/protocol/caps"/>`+
+                        `<c hash="sha-1" node="https://conversejs.org" ver="Js7MzULrV40dmSBGeP+rd0MNV9c=" xmlns="http://jabber.org/protocol/caps"/>`+
                         `</presence>`)
             done();
         }));