Allow limited Markdown in Broadcast Messages

Closes #11853

3 files changed, 32 insertions, 13 deletions

diff --git a/app/assets/javascripts/admin.js.coffee b/app/assets/javascripts/admin.js.coffee
index eb951f71711..b2b8e1b7ffb 100644
--- a/app/assets/javascripts/admin.js.coffee
+++ b/app/assets/javascripts/admin.js.coffee
@@ -12,19 +12,6 @@ class @Admin
       e.preventDefault()
       $('.js-toggle-colors-container').toggle()
 
-    $('input#broadcast_message_color').on 'input', ->
-      previewColor = $(@).val()
-      $('div.broadcast-message-preview').css('background-color', previewColor)
-
-    $('input#broadcast_message_font').on 'input', ->
-      previewColor = $(@).val()
-      $('div.broadcast-message-preview').css('color', previewColor)
-
-    $('textarea#broadcast_message_message').on 'input', ->
-      previewMessage = $(@).val()
-      previewMessage = "Your message here" if previewMessage.trim() == ''
-      $('div.broadcast-message-preview span').text(previewMessage)
-
     $('.log-tabs a').click (e) ->
       e.preventDefault()
       $(this).tab('show')
diff --git a/app/assets/javascripts/broadcast_message.js.coffee b/app/assets/javascripts/broadcast_message.js.coffee
new file mode 100644
index 00000000000..a38a329c4c2
--- /dev/null
+++ b/app/assets/javascripts/broadcast_message.js.coffee
@@ -0,0 +1,22 @@
+$ ->
+  $('input#broadcast_message_color').on 'input', ->
+    previewColor = $(@).val()
+    $('div.broadcast-message-preview').css('background-color', previewColor)
+
+  $('input#broadcast_message_font').on 'input', ->
+    previewColor = $(@).val()
+    $('div.broadcast-message-preview').css('color', previewColor)
+
+  previewPath = $('textarea#broadcast_message_message').data('preview-path')
+
+  $('textarea#broadcast_message_message').on 'input', ->
+    message = $(@).val()
+
+    if message == ''
+      $('.js-broadcast-message-preview').text("Your message here")
+    else
+      $.ajax(
+        url: previewPath
+        type: "POST"
+        data: { broadcast_message: { message: message } }
+      )
diff --git a/app/assets/stylesheets/pages/admin.scss b/app/assets/stylesheets/pages/admin.scss
index 144852e7874..a61161810a3 100644
--- a/app/assets/stylesheets/pages/admin.scss
+++ b/app/assets/stylesheets/pages/admin.scss
@@ -55,6 +55,16 @@
   @extend .alert-warning;
   padding: 10px;
   text-align: center;
+
+  > div, p {
+    display: inline;
+    margin: 0;
+
+    a {
+      color: inherit;
+      text-decoration: underline;
+    }
+  }
 }
 
 .broadcast-message-preview {