diff --git a/app/coffeescripts/bundles/file_preview.coffee b/app/coffeescripts/bundles/file_preview.coffee
new file mode 100644
index 00000000000..7eb4e13b4de
--- /dev/null
+++ b/app/coffeescripts/bundles/file_preview.coffee
@@ -0,0 +1,8 @@
+require [
+  'jquery'
+  'media_comments'
+], ($) ->
+
+  $preview = $("#media_preview")
+  data = $preview.data()
+  $preview.mediaComment('show_inline', 'maybe', data.type, data.download_url)
diff --git a/app/helpers/attachment_helper.rb b/app/helpers/attachment_helper.rb
index 0d7bd52dfda..77644f3c4a9 100644
--- a/app/helpers/attachment_helper.rb
+++ b/app/helpers/attachment_helper.rb
@@ -45,4 +45,10 @@ module AttachmentHelper
     end
     attrs.inject("") { |s,(attr,val)| s << "data-#{attr}=#{val} " }
   end
+
+  def media_preview_attributes(attachment, attrs={})
+    attrs[:type] = attachment.content_type.match(/video/) ? 'video' : 'audio'
+    attrs[:download_url] = context_url(attachment.context, :context_file_download_url, attachment.id)
+    attrs.inject("") { |s,(attr,val)| s << "data-#{attr}=#{val} " }
+  end
 end
diff --git a/app/views/files/show.html.erb b/app/views/files/show.html.erb
index bd55cb498cd..368be7a3bca 100644
--- a/app/views/files/show.html.erb
+++ b/app/views/files/show.html.erb
@@ -35,6 +35,13 @@
   <% elsif @attachment.content_type && @attachment.content_type.match(/\Aimage\//) %>
     <h2><%= @attachment.display_name %></h2>
     <%= link_to(image_tag(download_url, :alt => @attachment.display_name), download_url) %>
+  <% elsif @attachment.content_type && @attachment.content_type.match(/\Avideo\/|audio\//) %>
+    <% js_bundle :file_preview %>
+    <h2><%= @attachment.display_name %></h2>
+    <div id="media_preview" <%= media_preview_attributes(@attachment) %>></div>
+    <span style="font-size: 1.2em;">
+        <%= link_to "Download #{@attachment.display_name}", download_url %>
+    </span> (<%= @attachment.readable_size %>)
   <% else %>
     <% js_bundle :file_show %>
     <h2><%= @attachment.display_name %></h2>