Display image messages from the stream

webclient/app.css

@@ -187,6 +187,14 @@ h1 {
     border: 0px ! important;
 }
 
+.image {
+    display: block;
+    max-width:320px;
+    max-height:320px;
+    width: auto;
+    height: auto;
+}
+
 .bubble {
     padding: 6px;
     padding-left: 1em;

webclient/room/room.html

@@ -32,7 +32,8 @@
                 <td ng-class="!msg.content.membership_target ? (msg.content.msgtype === 'm.emote' ? 'emote text' : 'text') : ''">
                     <div class="bubble">
                         {{ msg.content.msgtype === "m.emote" ? ("* " + (members[msg.user_id].displayname || msg.user_id) + " ") : "" }}
-                        {{ msg.content.body }}
+                        {{ msg.content.msgtype === "m.text" ? msg.content.body : "" }}
+                        <img class="image" ng-hide='msg.content.msgtype !== "m.image"' src="{{ msg.content.url }}" alt="{{ msg.content.body }}"/>
                     </div>
                 </td>
                 <td class="rightBlock">