Completed JS requirements for new diff options dropdown.

app/assets/javascripts/merge_request_tabs.js.coffee

@@ -151,6 +151,26 @@ class @MergeRequestTabs
         @commitsLoaded = true
         @scrollToElement("#commits")
+
+  bindDiffOptionsEvents: ->
+
+    $('.diff-option-buttons .js-diff-comments-button').on 'click', (e) ->
+      e.preventDefault()
+
+      $this    = $ this
+      state    = $this.data 'state'
+      newState = 'hidden'
+      newLabel = 'Show all comments'
+
+      if state is 'hidden'
+        newLabel = 'Hide all comments'
+        newState = 'visible'
+
+      $("#diffs .notes_holder").toggle()
+      $this.text newLabel
+      $this.data 'state', newState
+
+
   loadDiff: (source) ->
     return if @diffsLoaded
@@ -164,6 +184,7 @@ class @MergeRequestTabs
         @diffsLoaded = true
         @scrollToElement("#diffs")
         @highlighSelectedLine()
+        @bindDiffOptionsEvents()
         $(document)
           .off 'click', '.diff-line-num a'
@@ -222,7 +243,7 @@ class @MergeRequestTabs
   # Returns diff view type
   diffViewType: ->
-    $('.inline-parallel-buttons a.active').data('view-type')
+    $('.js-diff-view-options.is-active').data('view-type')
   expandViewContainer: ->
     $('.container-fluid').removeClass('container-limited')

app/assets/stylesheets/pages/diff.scss

@@ -357,7 +357,7 @@
   white-space: pre-wrap;
 }
-.inline-parallel-buttons {
+.diff-option-buttons {
   float: right;
 }

app/helpers/diff_helper.rb

@@ -120,7 +120,7 @@ module DiffHelper
     # Always use HTML to handle case where JSON diff rendered this button
     params_copy.delete(:format)
-    link_to url_for(params_copy), id: "#{name}-diff-btn", class: (selected ? 'is-active' : ''), data: { view_type: name } do
+    link_to url_for(params_copy), id: "#{name}-diff-btn", class: (selected ? 'is-active js-diff-view-options' : 'js-diff-view-options'), data: { view_type: name } do
       title
     end
   end

app/views/projects/diffs/_diffs.html.haml

@@ -5,13 +5,13 @@
 - diff_files = safe_diff_files(diffs, diff_refs)
 .content-block.oneline-block.files-changed
-  .inline-parallel-buttons.dropdown
+  .diff-option-buttons.dropdown
     %button.btn.btn-default{ type: "button", data: { toggle: "dropdown" } }
       Options
       %span.caret
     %ul.dropdown-menu.dropdown-menu-align-right.dropdown-menu-selectable
       %li
-        %a.is-unselectable{ href: "#", data: { hide_text: "Hide all comments", show_text: "Show all comments" } }
+        %a.is-unselectable.js-diff-comments-button{ href: "#", data: { state: "visible" } }
           Hide all comments
       %li
         - if show_whitespace_toggle