Merge branch '4142-show-inline-video' into 'master'

Add support for inline videos in issue, MR and notes (on issue, commit, MR, and MR diff)

## What does this MR do?

It adds support for inline videos in issue, MR and notes (on issue, commit, MR, and MR diff). Most of the work was done by @hayesr in !3508 but a few improvements were still missing.

## Why was this MR needed?

To be able to play uploaded videos in GitLab!

## What are the relevant issue numbers?

Closes #4142.

## Screenshots

### Video players

![Screen_Shot_2016-07-19_at_18.44.09](/uploads/e85e531b455a41c3e66b26b356abaafd/Screen_Shot_2016-07-19_at_18.44.09.png)

-----

![Screen_Shot_2016-07-19_at_18.44.29](/uploads/05f52a812760210d1eae86a7f8fc48bc/Screen_Shot_2016-07-19_at_18.44.29.png)

-----

## Does this MR meet the acceptance criteria?

- [x] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG) entry added
- [x] [Documentation created/updated](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/doc/development/doc_styleguide.md)
- Tests
  - [x] Test `VideoLinkFilter`
  - [x] Test in `spec/features/markdown_spec.rb`
  - [x] Improve `spec/uploaders/file_uploader_spec.rb`
  - [x] All builds are passing
- [x] Conform by the [style guides](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CONTRIBUTING.md#style-guides)
- [x] Branch has no merge conflicts with `master` (if you do - rebase it please)
- [x] [Squashed related commits together](https://git-scm.com/book/en/Git-Tools-Rewriting-History#Squashing-Commits)

See merge request !5215

2 files changed, 60 insertions, 0 deletions

diff --git a/lib/banzai/filter/video_link_filter.rb b/lib/banzai/filter/video_link_filter.rb
new file mode 100644
index 00000000000..fd8b9a6f0cc
--- /dev/null
+++ b/lib/banzai/filter/video_link_filter.rb
@@ -0,0 +1,59 @@
+module Banzai
+  module Filter
+
+    # Find every image that isn't already wrapped in an `a` tag, and that has
+    # a `src` attribute ending with a video extension, add a new video node and
+    # a "Download" link in the case the video cannot be played.
+    class VideoLinkFilter < HTML::Pipeline::Filter
+
+      def call
+        doc.xpath(query).each do |el|
+          el.replace(video_node(doc, el))
+        end
+
+        doc
+      end
+
+      private
+
+      def query
+        @query ||= begin
+          src_query = UploaderHelper::VIDEO_EXT.map do |ext|
+            "'.#{ext}' = substring(@src, string-length(@src) - #{ext.size})"
+          end
+
+          "descendant-or-self::img[not(ancestor::a) and (#{src_query.join(' or ')})]"
+        end
+      end
+
+      def video_node(doc, element)
+        container = doc.document.create_element(
+          'div',
+          class: 'video-container'
+        )
+
+        video = doc.document.create_element(
+          'video',
+          src: element['src'],
+          width: '400',
+          controls: true,
+          'data-setup' => '{}')
+
+        link = doc.document.create_element(
+          'a',
+          element['title'] || element['alt'],
+          href: element['src'],
+          target: '_blank',
+          title: "Download '#{element['title'] || element['alt']}'")
+        download_paragraph = doc.document.create_element('p')
+        download_paragraph.children = link
+
+        container.add_child(video)
+        container.add_child(download_paragraph)
+
+        container
+      end
+    end
+
+  end
+end
diff --git a/lib/banzai/pipeline/gfm_pipeline.rb b/lib/banzai/pipeline/gfm_pipeline.rb
index b27ecf3c923..8d94b199c66 100644
--- a/lib/banzai/pipeline/gfm_pipeline.rb
+++ b/lib/banzai/pipeline/gfm_pipeline.rb
@@ -7,6 +7,7 @@ module Banzai
           Filter::SanitizationFilter,
 
           Filter::UploadLinkFilter,
+          Filter::VideoLinkFilter,
           Filter::ImageLinkFilter,
           Filter::EmojiFilter,
           Filter::TableOfContentsFilter,