Updated create merge request submit view

Create merge request submit view now uses the same form layout as creating an issue.
The commits view now uses the same layout as the project commits view
The commits and diffs are now in separate tabs, as used in the merge request view

app/views/projects/merge_requests/_new_submit.html.haml

@@ -9,74 +9,103 @@
   %span.pull-right
     = link_to 'Change branches', new_project_merge_request_path(@project)
 
-= form_for [@project, @merge_request], html: { class: "merge-request-form gfm-form" } do |f|
-  .panel.panel-default
-
-    .panel-body
-      .form-group
-        .light
-          = f.label :title do
-            Title *
-        = f.text_field :title, class: "form-control input-lg js-gfm-input", maxlength: 255, rows: 5, required: true
-      .form-group
-        .light
-          = f.label :description, "Description"
+= form_for [@project, @merge_request], html: { class: "merge-request-form form-horizontal gfm-form" } do |f|
+  .merge-request-form-info
+    .form-group
+      = f.label :title, class: 'control-label' do
+        %strong Title *
+      .col-sm-10
+        = f.text_field :title, maxlength: 255, autofocus: true, class: 'form-control pad js-gfm-input', required: true
+    .form-group.issuable-description
+      = f.label :description, 'Description', class: 'control-label'
+      .col-sm-10
         = render layout: 'projects/md_preview' do
-          = render 'projects/zen', f: f, attr: :description,
-                                   classes: 'description form-control'
-          .clearfix.hint
-            .pull-left Description is parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"), target: '_blank'}.
-            .pull-right Attach images (JPG, PNG, GIF) by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector' }.
+          = render 'projects/zen', f: f, attr: :description, classes: 'description form-control'
+
+          .col-sm-12-hint
+            .pull-left
+              Parsed with
+              #{link_to 'Gitlab Flavored Markdown', help_page_path('markdown', 'markdown'), target: '_blank'}.
+            .pull-right
+              Attach images (JPG, PNG, GIF) by dragging & dropping
+              or #{link_to 'selecting them', '#', class: 'markdown-selector'}.
+
+          .clearfix
           .error-alert
-      .form-group
-        .issue-assignee
-          = f.label :assignee_id do
-            %i.fa.fa-user
-            Assign to
-          %div
-            = project_users_select_tag('merge_request[assignee_id]', placeholder: 'Select a user', class: 'custom-form-control', selected: @merge_request.assignee_id, project_id: @merge_request.target_project_id)
-             
-            = link_to 'Assign to me', '#', class: 'btn assign-to-me-link'
-      .form-group
-        .issue-milestone
-          = f.label :milestone_id do
-            %i.fa.fa-clock-o
-            Milestone
-          %div= f.select(:milestone_id, milestone_options(@merge_request), { include_blank: "Select milestone" }, {class: 'select2'})
-      .form-group
-        = f.label :label_ids do
-          %i.fa.fa-tag
-          Labels
-        %div
-          = f.collection_select :label_ids, @merge_request.target_project.labels.all, :id, :name, { selected: @merge_request.label_ids }, multiple: true, class: 'select2'
+    %hr
+    .form-group
+      .issue-assignee
+        = f.label :assignee_id, class: 'control-label' do
+          %i.fa.fa-user
+          Assign to
+      .col-sm-10
+        = project_users_select_tag('merge_request[assignee_id]', placeholder: 'Select a user', class: 'custom-form-control', selected: @merge_request.assignee_id, project_id: @merge_request.target_project_id)
+         
+        = link_to 'Assign to me', '#', class: 'btn assign-to-me-link'
+    .form-group
+      .issue-milestone
+        = f.label :milestone_id, class: 'control-label' do
+          %i.fa.fa-clock-o
+          Milestone
+        .col-sm-10
+          - if milestone_options(@merge_request).present?
+            = f.select(:milestone_id, milestone_options(@merge_request), {include_blank: 'Select milestone'}, {class: 'select2'})
+          - else
+            %span.light No open milestones available.
+           
+          - if can? current_user, :admin_milestone, @merge_request.target_project
+            = link_to 'Create new milestone', new_project_milestone_path(@merge_request.target_project), target: :blank
+    .form-group
+      = f.label :label_ids, class: 'control-label' do
+        %i.fa.fa-tag
+        Labels
+      .col-sm-10
+        - if @merge_request.target_project.labels.any?
+          = f.collection_select :label_ids, @merge_request.target_project.labels.all, :id, :name, {selected: @merge_request.label_ids}, multiple: true, class: 'select2'
+        - else
+          %span.light No labels yet.
+         
+        - if can? current_user, :admin_label, @merge_request.target_project
+          = link_to 'Create new label', new_project_label_path(@merge_request.target_project), target: :blank
 
-    .panel-footer
+    .form-actions
       - if contribution_guide_url(@target_project)
         %p
           Please review the
-          %strong #{link_to "guidelines for contribution", contribution_guide_url(@target_project)}
+          %strong #{link_to 'guidelines for contribution', contribution_guide_url(@target_project)}
           to this repository.
       = f.hidden_field :source_project_id
+      = f.hidden_field :source_branch
       = f.hidden_field :target_project_id
       = f.hidden_field :target_branch
-      = f.hidden_field :source_branch
-      = f.submit 'Submit merge request', class: "btn btn-create"
+      = f.submit 'Submit merge request', class: 'btn btn-create'
 
-.mr-compare
-  = render "projects/commits/commit_list"
-
-  %h4 Changes
-  - if @diffs.present?
-    = render "projects/diffs/diffs", diffs: @diffs, project: @project
-  - elsif @commits.size > MergeRequestDiff::COMMITS_SAFE_SIZE
-    .bs-callout.bs-callout-danger
-      %h4 This comparison includes more than #{MergeRequestDiff::COMMITS_SAFE_SIZE} commits.
-      %p To preserve performance the line changes are not shown.
-  - else
-    .bs-callout.bs-callout-danger
-      %h4 This comparison includes huge diff.
-      %p To preserve performance the line changes are not shown.
+.mr-compare.merge-request
+  %ul.nav.nav-tabs.merge-request-tabs
+    %li.commits-tab{data: {action: 'commits'}}
+      = link_to url_for(params) do
+        %i.fa.fa-history
+        Commits
+        %span.badge= @commits.size
+    %li.diffs-tab{data: {action: 'diffs'}}
+      = link_to url_for(params) do
+        %i.fa.fa-list-alt
+        Changes
+        %span.badge= @diffs.size
 
+  .commits.tab-content
+    = render "projects/commits/commits"
+  .diffs.tab-content
+    - if @diffs.present?
+      = render "projects/diffs/diffs", diffs: @diffs, project: @project
+    - elsif @commits.size > MergeRequestDiff::COMMITS_SAFE_SIZE
+      .bs-callout.bs-callout-danger
+        %h4 This comparison includes more than #{MergeRequestDiff::COMMITS_SAFE_SIZE} commits.
+        %p To preserve performance the line changes are not shown.
+    - else
+      .bs-callout.bs-callout-danger
+        %h4 This comparison includes a huge diff.
+        %p To preserve performance the line changes are not shown.
 
 :javascript
   $('.assign-to-me-link').on('click', function(e){
@@ -85,3 +114,9 @@
   });
 
   window.project_image_path_upload = "#{upload_image_project_path @project}";
+
+:javascript
+  var merge_request
+  merge_request = new MergeRequest({
+    action: 'commits'
+  });