display correct template when attachment or image

app/assets/javascripts/discourse/components/utilities.js

@@ -212,6 +212,30 @@ Discourse.Utilities = {
     if (!extensions) return false;
     var regexp = new RegExp("\\.(" + extensions.replace(/\./g, "") + ")$", "i");
     return file && file.name ? file.name.match(regexp) : false;
+  },
+
+  /**
+    Get the markdown template for an upload (either an image or an attachment)
+
+    @method getUploadMarkdown
+    @param {Upload} upload The upload we want the markdown from
+  **/
+  getUploadMarkdown: function(upload) {
+    if (this.isAnImage(upload.original_filename)) {
+      return '<img src="' + upload.url + '" width="' + upload.width + '" height="' + upload.height + '">';
+    } else {
+      return '<a class="attachment" href="' + upload.url + '">' + upload.original_filename + '</a>';
+    }
+  },
+
+  /**
+    Check whether the path is refering to an image
+
+    @method isAnImage
+    @param {String} path The path
+  **/
+  isAnImage: function(path) {
+    return path && path.match(/\.(png|jpg|jpeg|gif|bmp|tif)$/i);
   }
 
 };

app/assets/javascripts/discourse/views/composer_view.js

@@ -285,9 +285,9 @@ Discourse.ComposerView = Discourse.View.extend({
 
     // done
     $uploadTarget.on('fileuploaddone', function (e, data) {
-      var upload = data.result;
-      var html = "<img src=\"" + upload.url + "\" width=\"" + upload.width + "\" height=\"" + upload.height + "\">";
-      composerView.addMarkdown(html);
+      var markdown = Discourse.Utilities.getUploadMarkdown(data.result);
+      // appends a space at the end of the inserted markdown
+      composerView.addMarkdown(markdown + " ");
       composerView.set('isUploading', false);
     });
 

app/assets/stylesheets/application/topic.css.scss

@@ -175,6 +175,16 @@
     }
   }
 
+  a.attachment:before {
+    display: inline-block;
+    margin-right: 4px;
+    font-family: "FontAwesome";
+    content: "\f019";
+  }
+  .attachment + .size {
+    margin: 0 5px;
+  }
+
   // When we are quoting something
   aside.quote {
     border-left: 5px solid #d7d7d7;

app/serializers/upload_serializer.rb

@@ -1,5 +1,5 @@
 class UploadSerializer < ApplicationSerializer
 
-  attributes :url, :filesize, :original_filename, :width, :height
+  attributes :url, :original_filename, :width, :height
 
 end