From 86f7b7adf5d835be0cbe8d6aee831a02fc1776a2 Mon Sep 17 00:00:00 2001 From: adambar Date: Thu, 2 Jul 2015 23:00:50 +0200 Subject: [PATCH] Allow line breaks in messages. Closes issue #291 Line breaks can now be insterted into message box using Shift+Enter or Alt+Enter. Messages with new lines are properly displayed in the conversation view (but only there, to keep inbox clean). The template was modified to allow HTML, but the message itself is sanitized before new line handling is run. --- background.html | 2 +- js/views/conversation_view.js | 2 +- js/views/message_view.js | 7 ++++++- 3 files changed, 8 insertions(+), 3 deletions(-) diff --git a/background.html b/background.html index 2147cad7e8..c1fa8855e3 100644 --- a/background.html +++ b/background.html @@ -65,7 +65,7 @@ {{> avatar }}
-

{{ message }}

+

{{& message }}

{{ timestamp }} diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js index 7dcd71c066..fa0934d234 100644 --- a/js/views/conversation_view.js +++ b/js/views/conversation_view.js @@ -210,7 +210,7 @@ updateMessageFieldSize: function (event) { var keyCode = event.which || event.keyCode; - if (keyCode === 13) { + if (keyCode === 13 && !event.altKey && !event.shiftKey) { // enter pressed - submit the form now event.preventDefault(); return this.$('.bottom-bar form').submit(); diff --git a/js/views/message_view.js b/js/views/message_view.js index 5c26878b37..25f6356748 100644 --- a/js/views/message_view.js +++ b/js/views/message_view.js @@ -55,11 +55,16 @@ autoLink: function(text) { return text.replace(/(^|[\s\n]|)((?:https?|ftp):\/\/[\-A-Z0-9+\u0026\u2019@#\/%?=()~_|!:,.;]*[\-A-Z0-9+\u0026@#\/%=~()_|])/gi, "$1$2"); }, + sanitizeMessage: function (message) { + var element = document.createElement('span'); + element.innerText = message; + return element.innerHTML.trim().replace(/\n/g, '
'); + }, render: function() { var contact = this.model.getContact(); this.$el.html( Mustache.render(this.template, { - message: this.model.get('body'), + message: this.sanitizeMessage(this.model.get('body')), timestamp: moment(this.model.get('sent_at')).fromNow(), sender: (contact && contact.getTitle()) || '', avatar: (contact && contact.getAvatar())