Commit c5c05f6a authored by Phil Hughes's avatar Phil Hughes

Updated UI for new merge request

Closes #2540
parent f76bfed9
class @Compare
constructor: (@opts) ->
@source_loading = $ ".js-source-loading"
@target_loading = $ ".js-target-loading"
@source_branch = $ "#merge_request_source_branch"
@target_branch = $ "#merge_request_target_branch"
@target_project = $ "#merge_request_target_project_id"
@initialState()
@cleanBinding()
@addBinding()
cleanBinding: ->
@source_branch.off "change"
@target_branch.off "change"
@target_project.off "change"
addBinding: ->
@source_branch.on "change", =>
@getSourceHtml()
@target_branch.on "change", =>
@getTargetHtml()
@target_project.on "change", =>
@getTargetProject()
initialState: ->
@getSourceHtml()
@getTargetHtml()
getTargetProject: ->
$.get @opts.targetProjectUrl,
target_project_id: @target_project.val()
getSourceHtml: ->
$.ajax(
url: @opts.sourceBranchUrl
data:
ref: @source_branch.val()
beforeSend: =>
@source_loading.show()
$(".mr_source_commit").html ""
success: (html) =>
@source_loading.hide()
$(".mr_source_commit").html html
$(".mr_source_commit .js-timeago").timeago()
)
getTargetHtml: ->
$.ajax(
url: @opts.targetBranchUrl
data:
target_project_id: @target_project.val()
ref: @target_branch.val()
beforeSend: =>
@target_loading.show()
$(".mr_target_commit").html ""
success: (html) =>
@target_loading.hide()
$(".mr_target_commit").html html
$(".mr_target_commit .js-timeago").timeago()
)
...@@ -123,6 +123,8 @@ ...@@ -123,6 +123,8 @@
.mr_source_commit, .mr_source_commit,
.mr_target_commit { .mr_target_commit {
margin-bottom: 0;
.commit { .commit {
margin: 0; margin: 0;
padding: 2px 0; padding: 2px 0;
...@@ -174,10 +176,6 @@ ...@@ -174,10 +176,6 @@
display: none; display: none;
} }
.merge-request-form .select2-container {
width: 250px !important;
}
#modal_merge_info .modal-dialog { #modal_merge_info .modal-dialog {
width: 600px; width: 600px;
...@@ -200,3 +198,48 @@ ...@@ -200,3 +198,48 @@
overflow-x: scroll; overflow-x: scroll;
} }
} }
.panel-new-merge-request {
.panel-heading {
padding: 5px 10px;
font-weight: 600;
line-height: 25px;
}
.panel-body {
padding: 10px 5px;
}
.panel-footer {
padding: 10px 10px;
}
.commit {
.commit-row-title {
margin-bottom: 4px;
}
.avatar {
width: 20px;
height: 20px;
margin-right: 5px;
}
.commit-row-info {
line-height: 20px;
}
}
.btn-clipboard {
margin-right: 5px;
padding: 0;
background: transparent;
}
}
.merge-request-select {
float: left;
width: 50%;
padding-left: 5px;
padding-right: 5px;
}
...@@ -207,11 +207,13 @@ class Projects::MergeRequestsController < Projects::ApplicationController ...@@ -207,11 +207,13 @@ class Projects::MergeRequestsController < Projects::ApplicationController
#This is always source #This is always source
@source_project = @merge_request.nil? ? @project : @merge_request.source_project @source_project = @merge_request.nil? ? @project : @merge_request.source_project
@commit = @repository.commit(params[:ref]) if params[:ref].present? @commit = @repository.commit(params[:ref]) if params[:ref].present?
render layout: false
end end
def branch_to def branch_to
@target_project = selected_target_project @target_project = selected_target_project
@commit = @target_project.commit(params[:ref]) if params[:ref].present? @commit = @target_project.commit(params[:ref]) if params[:ref].present?
render layout: false
end end
def update_branches def update_branches
......
...@@ -28,7 +28,7 @@ module CommitsHelper ...@@ -28,7 +28,7 @@ module CommitsHelper
def commit_to_html(commit, project, inline = true) def commit_to_html(commit, project, inline = true)
template = inline ? "inline_commit" : "commit" template = inline ? "inline_commit" : "commit"
escape_javascript(render "projects/commits/#{template}", commit: commit, project: project) unless commit.nil? render "projects/commits/#{template}", commit: commit, project: project unless commit.nil?
end end
# Breadcrumb links for a Project and, if applicable, a tree path # Breadcrumb links for a Project and, if applicable, a tree path
...@@ -117,7 +117,7 @@ module CommitsHelper ...@@ -117,7 +117,7 @@ module CommitsHelper
end end
end end
link_to( link_to(
"Browse Files »", "Browse Files",
namespace_project_tree_path(project.namespace, project, commit), namespace_project_tree_path(project.namespace, project, commit),
class: "pull-right" class: "pull-right"
) )
......
...@@ -35,8 +35,8 @@ ...@@ -35,8 +35,8 @@
= preserve(markdown(escape_once(commit.description), pipeline: :single_line)) = preserve(markdown(escape_once(commit.description), pipeline: :single_line))
.commit-row-info .commit-row-info
by
= commit_author_link(commit, avatar: true, size: 24) = commit_author_link(commit, avatar: true, size: 24)
authored
.committed_ago .committed_ago
#{time_ago_with_tooltip(commit.committed_date, skip_js: true)} &nbsp; #{time_ago_with_tooltip(commit.committed_date, skip_js: true)} &nbsp;
= link_to_browse_code(project, commit) = link_to_browse_code(project, commit)
...@@ -5,27 +5,31 @@ ...@@ -5,27 +5,31 @@
.hide.alert.alert-danger.mr-compare-errors .hide.alert.alert-danger.mr-compare-errors
.merge-request-branches.row .merge-request-branches.row
.col-md-6 .col-md-6
.panel.panel-default .panel.panel-default.panel-new-merge-request
.panel-heading .panel-heading
%strong Source branch Source branch
.panel-body .panel-body.clearfix
= f.select(:source_project_id, [[@merge_request.source_project_path,@merge_request.source_project.id]] , {}, { class: 'source_project select2 span3', disabled: @merge_request.persisted?, required: true }) .merge-request-select
&nbsp; = f.select(:source_project_id, [[@merge_request.source_project_path,@merge_request.source_project.id]] , {}, { class: 'source_project select2', disabled: @merge_request.persisted?, required: true })
= f.select(:source_branch, @merge_request.source_branches, { include_blank: true }, { class: 'source_branch select2 span2', required: true, data: { placeholder: "Select source branch" } }) .merge-request-select
= f.select(:source_branch, @merge_request.source_branches, { include_blank: true }, { class: 'source_branch select2', required: true, data: { placeholder: "Select source branch" } })
.panel-footer .panel-footer
.mr_source_commit = icon('spinner spin', class: "js-source-loading")
%ul.list-unstyled.mr_source_commit
.col-md-6 .col-md-6
.panel.panel-default .panel.panel-default.panel-new-merge-request
.panel-heading .panel-heading
%strong Target branch Target branch
.panel-body .panel-body.clearfix
- projects = @project.forked_from_project.nil? ? [@project] : [@project, @project.forked_from_project] - projects = @project.forked_from_project.nil? ? [@project] : [@project, @project.forked_from_project]
= f.select(:target_project_id, options_from_collection_for_select(projects, 'id', 'path_with_namespace', f.object.target_project_id), {}, { class: 'target_project select2 span3', disabled: @merge_request.persisted?, required: true }) .merge-request-select
&nbsp; = f.select(:target_project_id, options_from_collection_for_select(projects, 'id', 'path_with_namespace', f.object.target_project_id), {}, { class: 'target_project select2', disabled: @merge_request.persisted?, required: true })
= f.select(:target_branch, @merge_request.target_branches, { include_blank: true }, { class: 'target_branch select2 span2', required: true, data: { placeholder: "Select target branch" } }) .merge-request-select
= f.select(:target_branch, @merge_request.target_branches, { include_blank: true }, { class: 'target_branch select2', required: true, data: { placeholder: "Select target branch" } })
.panel-footer .panel-footer
.mr_target_commit = icon('spinner spin', class: "js-target-loading")
%ul.list-unstyled.mr_target_commit
- if @merge_request.errors.any? - if @merge_request.errors.any?
.alert.alert-danger .alert.alert-danger
...@@ -45,40 +49,11 @@ ...@@ -45,40 +49,11 @@
and and
%span.label-branch #{@merge_request.target_branch} %span.label-branch #{@merge_request.target_branch}
are the same. are the same.
.form-actions
= f.submit 'Compare branches and continue', class: "btn btn-new mr-compare-btn" = f.submit 'Compare branches and continue', class: "btn btn-new mr-compare-btn"
:javascript :javascript
var source_branch = $("#merge_request_source_branch") new Compare({
, target_branch = $("#merge_request_target_branch") targetProjectUrl: "#{update_branches_namespace_project_merge_requests_path(@source_project.namespace, @source_project)}",
, target_project = $("#merge_request_target_project_id"); sourceBranchUrl: "#{branch_from_namespace_project_merge_requests_path(@source_project.namespace, @source_project)}",
targetBranchUrl: "#{branch_to_namespace_project_merge_requests_path(@source_project.namespace, @source_project)}"
$.get("#{branch_from_namespace_project_merge_requests_path(@source_project.namespace, @source_project)}", {ref: source_branch.val() });
$.get("#{branch_to_namespace_project_merge_requests_path(@source_project.namespace, @source_project)}", {target_project_id: target_project.val(),ref: target_branch.val() });
target_project.on("change", function() {
$.get("#{update_branches_namespace_project_merge_requests_path(@source_project.namespace, @source_project)}", {target_project_id: $(this).val() });
});
source_branch.on("change", function() {
$.get("#{branch_from_namespace_project_merge_requests_path(@source_project.namespace, @source_project)}", {ref: $(this).val() });
$(".mr-compare-errors").fadeOut();
$(".mr-compare-btn").enable();
});
target_branch.on("change", function() {
$.get("#{branch_to_namespace_project_merge_requests_path(@source_project.namespace, @source_project)}", {target_project_id: target_project.val(),ref: $(this).val() });
$(".mr-compare-errors").fadeOut();
$(".mr-compare-btn").enable();
});
:javascript
$(".merge-request-form").on('submit', function () {
if ($("#merge_request_source_branch").val() === "" || $('#merge_request_target_branch').val() === "") {
$(".mr-compare-errors").html("You must select source and target branch to proceed");
$(".mr-compare-errors").fadeIn();
event.preventDefault();
return;
}
}); });
= commit_to_html(@commit, @source_project, false)
:plain
$(".mr_source_commit").html("#{commit_to_html(@commit, @source_project, false)}");
$('.js-timeago').timeago()
= commit_to_html(@commit, @target_project, false)
:plain
$(".mr_target_commit").html("#{commit_to_html(@commit, @target_project, false)}");
$('.js-timeago').timeago()
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment