Converted merge_requests.js to coffeescript and updated code

app/assets/javascripts/merge_requests.js

-var MergeRequest = { 
-  diffs_loaded: false,
-  commits_loaded: false,
-  opts: false,
-
-  init:
-    function(opts) {
-      var self = this;
-      self.opts = opts;
-
-      self.initTabs();
-      self.initMergeWidget();
-
-      $(".mr_show_all_commits").bind("click", function() { 
-        self.showAllCommits();
-      });
-    },
-
-  initMergeWidget: 
-    function() { 
-      var self = this;
-      self.showState(self.opts.current_state);
-
-      if($(".automerge_widget").length && self.opts.check_enable){
-        $.get(self.opts.url_to_automerge_check, function(data){
-          self.showState(data.state);
-        }, "json");
-      }
-
-      if(self.opts.ci_enable){
-        $.get(self.opts.url_to_ci_check, function(data){
-          self.showCiState(data.status);
-        }, "json");
-      }
-    },
-
-  initTabs:
-    function() { 
-      $(".mr_nav_tabs a").live("click", function() { 
-        $(".mr_nav_tabs a").parent().removeClass("active");
-        $(this).parent().addClass("active");
-      });
-
-      var current_tab;
-      if(this.opts.action == "diffs") { 
-        current_tab = $(".mr_nav_tabs .merge-diffs-tab");
-      } else {
-        current_tab = $(".mr_nav_tabs .merge-notes-tab");
-      }
-      current_tab.parent().addClass("active");
-
-      this.initNotesTab();
-      this.initDiffTab();
-    },
-
-  initNotesTab: 
-    function() { 
-      $(".mr_nav_tabs a.merge-notes-tab").live("click", function(e) { 
-        $(".merge-request-diffs").hide();
-        $(".merge_request_notes").show();
-        var mr_path = $(".merge-notes-tab").attr("data-url");
-        history.pushState({ path: mr_path }, '', mr_path);
-        e.preventDefault();
-      });
-    },
-
-  initDiffTab: 
-    function() { 
-      $(".mr_nav_tabs a.merge-diffs-tab").live("click", function(e) { 
-        if(!MergeRequest.diffs_loaded) { 
-          MergeRequest.loadDiff(); 
-        }
-        $(".merge_request_notes").hide();
-        $(".merge-request-diffs").show();
-        var mr_diff_path = $(".merge-diffs-tab").attr("data-url");
-        history.pushState({ path: mr_diff_path }, '', mr_diff_path);
-        e.preventDefault();
-      });
-
-    },
-
-  showState:
-    function(state){
-      $(".automerge_widget").hide();
-      $(".automerge_widget." + state).show();
-    },
-
-  showCiState:
-    function(state){
-      $(".ci_widget").hide();
-      $(".ci_widget.ci-" + state).show();
-    },
-
-  loadDiff:
-    function() { 
-      $(".dashboard-loader").show();
-      $.ajax({
-        type: "GET",
-        url: $(".merge-diffs-tab").attr("data-url"),
-        beforeSend: function(){ $('.status').addClass("loading")},
-        complete: function(){ 
-          MergeRequest.diffs_loaded = true;
-          $(".merge_request_notes").hide();
-          $('.status').removeClass("loading");
-        },
-        dataType: "script"});
-    }, 
-
-  showAllCommits: 
-    function() { 
-      $(".first_mr_commits").remove();
-      $(".all_mr_commits").removeClass("hide");
-    },
-
-  already_cannot_be_merged:
-    function(){
-        $(".automerge_widget").hide();
-        $(".merge_in_progress").hide();
-        $(".automerge_widget.already_cannot_be_merged").show();
-    }
-};
-
-/*
- * Filter merge requests
- */
-function merge_requestsPage() {
-  $("#assignee_id").chosen();
-  $("#milestone_id").chosen();
-  $("#milestone_id, #assignee_id").on("change", function(){
-    $(this).closest("form").submit();
-  });
-}

app/assets/javascripts/merge_requests.js.coffee

+#
+# * Filter merge requests
+# 
+@merge_requestsPage = ->
+  $('#assignee_id').chosen()
+  $('#milestone_id').chosen()
+  $('#milestone_id, #assignee_id').on 'change', ->
+    $(this).closest('form').submit()
+
+class MergeRequest
+  
+  constructor: (@opts) ->
+    this.$el = $('.merge-request')
+    @diffs_loaded = false
+    @commits_loaded = false
+    
+    this.activateTab(@opts.action)
+    
+    this.bindEvents()
+    
+    this.initMergeWidget()
+    this.$('.show-all-commits').on 'click', =>
+      this.showAllCommits()
+
+  # Local jQuery finder
+  $: (selector) ->
+    this.$el.find(selector)
+
+  initMergeWidget: ->
+    this.showState( @opts.current_state )
+    
+    if this.$('.automerge_widget').length and @opts.check_enable
+      $.get @opts.url_to_automerge_check, (data) =>
+        this.showState( data.state )
+      , 'json'
+
+    if @opts.ci_enable
+      $.get self.opts.url_to_ci_check, (data) =>
+        this.showCiState data.status
+      , 'json'
+
+  bindEvents: ->
+    this.$('.nav-tabs').on 'click', 'a', (event) =>
+      a = $(event.currentTarget)
+      
+      href = a.attr('href')
+      History.replaceState {path: href}, document.title, href
+      
+      event.preventDefault()
+      
+    this.$('.nav-tabs').on 'click', 'li', (event) =>
+      this.activateTab($(event.currentTarget).data('action'))
+
+  activateTab: (action) ->
+    this.$('.nav-tabs li').removeClass 'active'
+    this.$('.tab-content').hide()
+    switch action
+      when 'diffs'
+        this.$('.nav-tabs .diffs-tab').addClass 'active'
+        this.loadDiff() unless @diffs_loaded
+        this.$('.diffs').show()
+      else
+        this.$('.nav-tabs .notes-tab').addClass 'active'
+        this.$('.notes').show()
+
+  showState: (state) ->
+    $('.automerge_widget').hide()
+    $('.automerge_widget.' + state).show()
+
+  showCiState: (state) ->
+    $('.ci_widget').hide()
+    $('.ci_widget.ci-' + state).show()
+
+  loadDiff: (event) ->
+    $('.dashboard-loader').show()
+    $.ajax
+      type: 'GET'
+      url: this.$('.nav-tabs .diffs-tab a').attr('href')
+      beforeSend: =>
+        this.$('.status').addClass 'loading'
+
+      complete: =>
+        @diffs_loaded = true
+        this.$('.status').removeClass 'loading'
+
+      dataType: 'script'
+
+  showAllCommits: ->
+    this.$('.first-commits').remove()
+    this.$('.all-commits').removeClass 'hide'
+
+  alreadyOrCannotBeMerged: ->
+    this.$('.automerge_widget').hide()
+    this.$('.merge-in-progress').hide()
+    this.$('.automerge_widget.already_cannot_be_merged').show()
+
+this.MergeRequest = MergeRequest
\ No newline at end of file

app/assets/stylesheets/common.scss

@@ -425,7 +425,7 @@ li.note {
 
 
 .supp_diff_link,
-.mr_show_all_commits {
+.show-all-commits {
   cursor: pointer;
 }
 

app/assets/stylesheets/sections/merge_requests.scss

@@ -43,7 +43,7 @@
   }
 }
 
-.mr_nav_tabs {
+.merge-request .nav-tabs{
   li {
     a {
       font-weight: bold;
@@ -65,7 +65,7 @@ li.merge_request {
   }
 }
 
-.merge_in_progress {
+.merge-in-progress {
   @extend .padded;
   @extend .append-bottom-10;
 }

app/views/merge_requests/_form.html.haml

-= form_for [@project, @merge_request], html: { class: "new_merge_request form-horizontal" } do |f|
+= form_for [@project, @merge_request], html: { class: "#{controller.action_name}-merge-request form-horizontal" } do |f|
   -if @merge_request.errors.any?
     .alert-message.block-message.error
       %ul
@@ -61,8 +61,9 @@
 :javascript
   $(function(){
     disableButtonIfEmptyField("#merge_request_title", ".save-btn");
-    var source_branch = $("#merge_request_source_branch");
-    var target_branch = $("#merge_request_target_branch");
+
+    var source_branch = $("#merge_request_source_branch")
+      , target_branch = $("#merge_request_target_branch");
 
     $.get("#{branch_from_project_merge_requests_path(@project)}", {ref: source_branch.val() });
     $.get("#{branch_to_project_merge_requests_path(@project)}", {ref: target_branch.val() });

app/views/merge_requests/_show.html.haml

-= render "merge_requests/show/mr_title"
-= render "merge_requests/show/how_to_merge"
-= render "merge_requests/show/mr_box"
-= render "merge_requests/show/mr_accept"
-- if @project.gitlab_ci?
+.merge-request
+  = render "merge_requests/show/mr_title"
+  = render "merge_requests/show/how_to_merge"
+  = render "merge_requests/show/mr_box"
+  = render "merge_requests/show/mr_accept"
+  - if @project.gitlab_ci?
     = render "merge_requests/show/mr_ci"
-= render "merge_requests/show/commits"
+  = render "merge_requests/show/commits"
 
-- if @commits.present?
-  %ul.nav.nav-tabs.mr_nav_tabs
-    %li
-      = link_to "#notes", "data-url" => project_merge_request_path(@project, @merge_request), class: "merge-notes-tab tab" do
+  - if @commits.present?
+    %ul.nav.nav-tabs
+      %li.notes-tab{data: {action: 'notes'}}
+        = link_to project_merge_request_path(@project, @merge_request) do
           %i.icon-comment
           Comments
-    %li
-      = link_to "#diffs", "data-url" => diffs_project_merge_request_path(@project, @merge_request), class: "merge-diffs-tab tab" do
+      %li.diffs-tab{data: {action: 'diffs'}}
+        = link_to diffs_project_merge_request_path(@project, @merge_request) do
           %i.icon-list-alt
           Diff
 
-.merge_request_notes.voting_notes#notes{ class: (controller.action_name == 'show') ? "" : "hide" }
+  .notes.tab-content.voting_notes#notes{ class: (controller.action_name == 'show') ? "" : "hide" }
     = render("notes/notes_with_form", tid: @merge_request.id, tt: "merge_request")
-.merge-request-diffs
+  .diffs.tab-content
     = render "merge_requests/show/diffs" if @diffs
-.status
+  .status
 
-= render "notes/per_line_form"
+  = render "notes/per_line_form"
 
 :javascript
+  var merge_request;
   $(function(){
-    MergeRequest.init({
+    merge_request = new MergeRequest({
       url_to_automerge_check: "#{automerge_check_project_merge_request_path(@project, @merge_request)}",
       check_enable: #{@merge_request.state == MergeRequest::UNCHECKED ? "true" : "false"},
       url_to_ci_check: "#{ci_status_project_merge_request_path(@project, @merge_request)}",
@@ -35,10 +37,5 @@
       current_state: "#{@merge_request.human_state}",
       action: "#{controller.action_name}"
     });
-
-    $(".edit_merge_request").live("ajax:beforeSend", function() {
-      $('.can_be_merged').hide();
-      $('.merge_in_progress').show();
-    })
-  })
+  });
 

app/views/merge_requests/automerge.js.haml

@@ -3,5 +3,5 @@
     location.reload();
 -else
   :plain
-    MergeRequest.already_cannot_be_merged()
+    merge_request.alreadyOrCannotBeMerged()
 

app/views/merge_requests/commits.js.haml

 :plain
-  $(".merge-request-commits").html("#{escape_javascript(render(partial: "commits"))}");
+  merge_request.$(".commits").html("#{escape_javascript(render(partial: "commits"))}");
 
 

app/views/merge_requests/diffs.js.haml

 :plain
-  $(".merge-request-diffs").html("#{escape_javascript(render(partial: "merge_requests/show/diffs"))}");
+  merge_request.$(".diffs").html("#{escape_javascript(render(partial: "merge_requests/show/diffs"))}");
 
-  $(function(){
   PerLineNotes.init();
-  });
 

app/views/merge_requests/index.html.haml

@@ -43,6 +43,4 @@
             %span.cgray.right #{@merge_requests.total_count} merge requests for this filter
 
 :javascript
-  $(function() {
-      merge_requestsPage();
-    })
+  $(merge_requestsPage);

app/views/merge_requests/show.js.haml

 :plain
-  $(".merge-request-notes").html("#{escape_javascript(render notes/notes_with_form", tid: @merge_request.id, tt: "merge_request")}");
+  merge_request.$(".notes").html("#{escape_javascript(render "notes/notes_with_form", tid: @merge_request.id, tt: "merge_request")}");

app/views/merge_requests/show/_commits.html.haml

@@ -3,16 +3,16 @@
     %h5.title
       %i.icon-list
       Commits (#{@commits.count})
-    .merge-request-commits
+    .commits
       - if @commits.count > 8
-        %ul.first_mr_commits.well-list
+        %ul.first-commits.well-list
           - @commits.first(8).each do |commit|
             = render "commits/commit", commit: commit
           %li.bottom
             8 of #{@commits.count} commits displayed.
             %strong
-              %a.mr_show_all_commits Click here to show all
-        %ul.all_mr_commits.hide.well-list
+              %a.show-all-commits Click here to show all
+        %ul.all-commits.hide.well-list
           - @commits.each do |commit|
             = render "commits/commit", commit: commit
 

app/views/merge_requests/show/_mr_accept.html.haml

@@ -40,6 +40,6 @@
     .alert.alert-info
       %strong This merge request already can not be merged. Try to reload page.
 
-  .merge_in_progress.hide
+  .merge-in-progress.hide
     %span.cgray Merge is in progress. Please wait. Page will be automatically reloaded.  
     = image_tag "ajax_loader.gif"