support image and links in the chats

brickgao · Sep 9, 2016 · 3a5c5cd · 3a5c5cd
1 parent 3fd02a9
commit 3a5c5cd
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 3 deletions.
diff --git a/app/assets/stylesheets/messages.scss b/app/assets/stylesheets/messages.scss
@@ -51,7 +51,6 @@
     }
     .message-body {
       max-width: 250px;
-      max-height: 50px;
       margin: 0 10px;
       padding: 10px;
       text-align: $textAlign;

diff --git a/app/views/layouts/_chat_content.html.erb b/app/views/layouts/_chat_content.html.erb
@@ -0,0 +1,10 @@
+<% for tag, b, e in parse_content(content) %>
+  <% if tag == :link %>
+    <a href="<%= content[b...e] %>"><%= content[b...e] %></a>
+  <% elsif tag == :image %>
+    <img src="<%= content[b...e] %>"/>
+  <% else %>
+    <%= content[b...e] %>
+  <% end %>
+<% end %>
+<br/>
diff --git a/app/views/messages/show_chat.html.erb b/app/views/messages/show_chat.html.erb
@@ -4,7 +4,9 @@
         <% if message.to.id != current_user.id %>
           <div>
             <div class="message-body">
-              <%= message.body %>
+              <% message.body.split(/\r?\n/).each do |paragraph| %>
+                <%= render 'layouts/chat_content', :content => paragraph %>
+              <% end %>
             </div>
           </div>
         <% end %>
@@ -19,7 +21,9 @@
         <% if message.to.id == current_user.id %>
           <div>
             <div class="message-body">
-              <%= message.body %>
+              <% message.body.split(/\r?\n/).each do |paragraph| %>
+                <%= render 'layouts/chat_content', :content => paragraph %>
+              <% end %>
             </div>
           </div>
         <% end %>