diff options
author | Jacob Schatz <jacobschatz@Jacobs-MBP.fios-router.home> | 2016-04-09 07:09:09 +0300 |
---|---|---|
committer | Jacob Schatz <jacobschatz@Jacobs-MBP.fios-router.home> | 2016-04-13 23:10:49 +0300 |
commit | 42e0625dfb2a791affd592df1f879083702e6f86 (patch) | |
tree | 328494558d9c9b6a38d576534ed94164f2778a31 /app/assets/javascripts/issues.js.coffee | |
parent | 1617d1e0267f389e040772bfed0dd29e34b25c06 (diff) |
Filter by multiple labels with little animation.
Diffstat (limited to 'app/assets/javascripts/issues.js.coffee')
-rw-r--r-- | app/assets/javascripts/issues.js.coffee | 36 |
1 files changed, 35 insertions, 1 deletions
diff --git a/app/assets/javascripts/issues.js.coffee b/app/assets/javascripts/issues.js.coffee index fc9f6301bcc..320b92d2a60 100644 --- a/app/assets/javascripts/issues.js.coffee +++ b/app/assets/javascripts/issues.js.coffee @@ -1,5 +1,6 @@ @Issues = init: -> + Issues.initTemplates() Issues.initSearch() Issues.initChecks() @@ -15,6 +16,15 @@ else $(this).html totalIssues - 1 + initTemplates: -> + Issue.labelRow = _.template( + '<% _.each(labels, function(label){ %> + <span class="label-row"> + <a href="#"><span class="label color-label" style="background-color: <%= label.color %>; color: #FFFFFF" title="<%= label.description %>" data-container="body"><%= label.title %></span></a> + </span> + <% }); %>' + ) + reload: -> Issues.initChecks() $('#filter_issue_search').val($('#issue_search').val()) @@ -50,7 +60,6 @@ , 500) filterResults: (form) => - formData = form.serialize() $('.issues-holder, .merge-requests-holder').css("opacity", '0.5') @@ -70,6 +79,31 @@ history.replaceState {page: issuesUrl}, document.title, issuesUrl Issues.reload() Issues.updateStateFilters() + $filteredLabels = $('.filtered-labels') + $filteredLabelsSpans = $filteredLabels.find('span') + gl.animate.animateEach( + $filteredLabelsSpans, + 'fadeOutDown', 20, { + cssStart: { + opacity: 1 + }, + cssEnd: { + opacity: 0 + } + }).then( -> + $filteredLabels.html(Issue.labelRow(data)) + $spans = $filteredLabels.find('span') + $spans.css('opacity',0) + return gl.animate.animateEach($spans, 'fadeInUp', 20, { + cssStart: { + opacity: 0 + }, + cssEnd: { + opacity: 1 + } + }) + ) + dataType: "json" checkChanged: -> |