Commit aa22106b authored by Phil Hughes's avatar Phil Hughes Committed by Robert Speicher

Posts the due date through AJAX

parent 05523b5b
class @DueDateSelect
constructor: ->
$('.js-due-date-select').each (i, dropdown) ->
$dropdown = $(dropdown)
$dropdownParent = $dropdown.closest('.dropdown')
$addBtn = $('.js-due-date-add', $dropdownParent)
$datePicker = $dropdownParent.find('.js-due-date-calendar')
$block = $dropdown.closest('.block')
$loading = $block.find('.block-loading').hide()
$selectbox = $dropdown.closest('.selectbox')
$value = $block.find('.value')
fieldName = $dropdown.data('field-name')
abilityName = $dropdown.data('ability-name')
issueUpdateURL = $dropdown.data('issue-update')
$addBtn.on 'click', (e) ->
e.preventDefault()
e.stopPropagation()
# Create the post date
value = $("input[name='#{fieldName}']").val()
mediumDate = $.datepicker.formatDate("M d, yy", new Date(value))
data = {}
data[abilityName] = {}
data[abilityName].due_date = value
$.ajax(
type: 'PUT'
url: issueUpdateURL
data: data
beforeSend: ->
$loading.fadeIn()
$dropdown.trigger('loading.gl.dropdown')
$selectbox.hide()
$value.removeAttr('style')
$value.html(mediumDate)
).done (data) ->
$dropdown.trigger('loaded.gl.dropdown')
$loading.fadeOut()
$datePicker.datepicker(
dateFormat: "yy-mm-dd",
defaultDate: $("input[name='#{fieldName}']").val()
altField: "input[name='#{fieldName}']"
)
...@@ -358,6 +358,13 @@ ...@@ -358,6 +358,13 @@
border-top: 1px solid $dropdown-divider-color; border-top: 1px solid $dropdown-divider-color;
} }
.dropdown-due-date-footer {
padding-top: 0;
margin-left: 10px;
margin-right: 10px;
border-top: 0;
}
.dropdown-footer-list { .dropdown-footer-list {
font-size: 14px; font-size: 14px;
...@@ -395,3 +402,83 @@ ...@@ -395,3 +402,83 @@
height: 15px; height: 15px;
border-radius: $border-radius-base; border-radius: $border-radius-base;
} }
.dropdown-menu-due-date {
.ui-widget {
table {
margin: 0;
}
&.ui-datepicker-inline {
padding: 0 10px;
border: 0;
width: 100%;
}
.ui-datepicker-header {
padding: 8px;
border: 0;
}
.ui-state-active,
.ui-state-hover {
color: $md-link-color;
background-color: #ecf3fe;
}
.ui-datepicker-prev,
.ui-datepicker-next {
&:hover {
background-color: transparent;
border: 0;
}
}
.ui-datepicker-prev {
left: 1px;
top: 1px;
}
.ui-datepicker-next {
right: 1px;
top: 1px;
}
td {
padding: 0;
border: 1px solid rgba(0, 0, 0, .1);
&:first-child {
border-left: 0;
}
&:last-child {
border-right: 0;
}
a {
line-height: 17px;
border: 0;
border-radius: 0;
}
}
.ui-datepicker-title {
color: #555;
font-size: 15px;
line-height: 1;
font-weight: normal;
}
}
th {
padding: 5px 0;
color: #b8b8b8;
font-weight: normal;
text-transform: lowercase;
}
.ui-datepicker-unselectable {
background-color: #faf9f9;
}
}
...@@ -242,7 +242,7 @@ ...@@ -242,7 +242,7 @@
} }
} }
.btn { .issuable-pager {
background: $gray-normal; background: $gray-normal;
border: 1px solid $border-gray-normal; border: 1px solid $border-gray-normal;
&:hover { &:hover {
...@@ -251,7 +251,7 @@ ...@@ -251,7 +251,7 @@
} }
} }
a:not(.btn) { a:not(.issuable-pager) {
&:hover { &:hover {
color: $md-link-color; color: $md-link-color;
text-decoration: none; text-decoration: none;
......
...@@ -10,14 +10,14 @@ ...@@ -10,14 +10,14 @@
= sidebar_gutter_toggle_icon = sidebar_gutter_toggle_icon
.issuable-nav.hide-collapsed.pull-right.btn-group{role: 'group', "aria-label" => '...'} .issuable-nav.hide-collapsed.pull-right.btn-group{role: 'group', "aria-label" => '...'}
- if prev_issuable = prev_issuable_for(issuable) - if prev_issuable = prev_issuable_for(issuable)
= link_to 'Prev', [@project.namespace.becomes(Namespace), @project, prev_issuable], class: 'btn btn-default prev-btn' = link_to 'Prev', [@project.namespace.becomes(Namespace), @project, prev_issuable], class: 'btn btn-default prev-btn issuable-pager'
- else - else
%a.btn.btn-default.disabled{href: '#'} %a.btn.btn-default.issuable-pager.disabled{href: '#'}
Prev Prev
- if next_issuable = next_issuable_for(issuable) - if next_issuable = next_issuable_for(issuable)
= link_to 'Next', [@project.namespace.becomes(Namespace), @project, next_issuable], class: 'btn btn-default next-btn' = link_to 'Next', [@project.namespace.becomes(Namespace), @project, next_issuable], class: 'btn btn-default next-btn issuable-pager'
- else - else
%a.btn.btn-default.disabled{href: '#'} %a.btn.btn-default.issuable-pager.disabled{href: '#'}
Next Next
= form_for [@project.namespace.becomes(Namespace), @project, issuable], remote: true, html: {class: 'issuable-context-form inline-update js-issuable-update'} do |f| = form_for [@project.namespace.becomes(Namespace), @project, issuable], remote: true, html: {class: 'issuable-context-form inline-update js-issuable-update'} do |f|
...@@ -84,20 +84,32 @@ ...@@ -84,20 +84,32 @@
- else - else
.light None .light None
.title.hide-collapsed .title.hide-collapsed
%label
Due Date Due Date
= icon('spinner spin', class: 'block-loading')
- if can?(current_user, :"admin_#{issuable.to_ability_name}", @project) - if can?(current_user, :"admin_#{issuable.to_ability_name}", @project)
.pull-right = link_to 'Edit', '#', class: 'edit-link pull-right'
= link_to 'Edit', '#', class: 'edit-link' .value.bold.hide-collapsed
.value.hide-collapsed
- if issuable.due_date - if issuable.due_date
= icon('calendar')
= issuable.due_date.to_s(:medium) = issuable.due_date.to_s(:medium)
- else - else
.light None .light None
- if can?(current_user, :"admin_#{issuable.to_ability_name}", @project)
.selectbox.hide-collapsed .selectbox.hide-collapsed
= f.text_field :due_date = hidden_field_tag "#{issuable.to_ability_name}[due_date]", issuable.due_date
= hidden_field_tag :issuable_context .dropdown
%button.dropdown-menu-toggle.js-due-date-select{ type: "button", data: { toggle: "dropdown", field_name: "#{issuable.to_ability_name}[due_date]", ability_name: issuable.to_ability_name, issue_update: issuable_json_path(issuable) } }
%span.dropdown-toggle-text
Due date
= icon('chevron-down')
.dropdown-menu.dropdown-menu-due-date
= dropdown_title("Due date")
= dropdown_content do
.js-due-date-calendar
.dropdown-footer.dropdown-due-date-footer.clearfix
%button.btn.btn-primary.pull-left.js-due-date-add{ type: "button" }
Add
%button.btn.btn-default.pull-right{ type: "button" }
Cancel
- if issuable.project.labels.any? - if issuable.project.labels.any?
.block.labels .block.labels
...@@ -178,3 +190,4 @@ ...@@ -178,3 +190,4 @@
new IssuableContext('#{escape_javascript(current_user.to_json(only: [:username, :id, :name]))}'); new IssuableContext('#{escape_javascript(current_user.to_json(only: [:username, :id, :name]))}');
new Subscription('.subscription') new Subscription('.subscription')
new Sidebar(); new Sidebar();
new DueDateSelect();
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