diff --git a/app/assets/javascripts/right_sidebar.js.coffee b/app/assets/javascripts/right_sidebar.js.coffee index def735d3b4a..ce8de7515dd 100644 --- a/app/assets/javascripts/right_sidebar.js.coffee +++ b/app/assets/javascripts/right_sidebar.js.coffee @@ -47,40 +47,41 @@ class @Sidebar .off 'click', '.js-issuable-todo' .on 'click', '.js-issuable-todo', @toggleTodo - toggleTodo: (e) -> + toggleTodo: -> $this = $(@) - $btnText = $this.find('span') - data = { - todo_id: $this.attr('data-id') - } + $todoLoading = $('.js-issuable-todo-loading') + $btnText = $('.js-issuable-todo-text', $this) $.ajax( url: $this.data('url') type: 'POST' dataType: 'json' - data: data + data: + todo_id: $this.attr('data-id') beforeSend: -> $this.disable() - $('.js-issuable-todo-loading').removeClass 'hidden' + $todoLoading.removeClass 'hidden' ).done (data) -> $todoPendingCount = $('.todos-pending-count') $todoPendingCount.text data.count $this.enable() - $('.js-issuable-todo-loading').addClass 'hidden' + $todoLoading.addClass 'hidden' if data.count is 0 - $todoPendingCount - .addClass 'hidden' + $todoPendingCount.addClass 'hidden' else - $todoPendingCount - .removeClass 'hidden' + $todoPendingCount.removeClass 'hidden' if data.todo? + $this + .attr 'aria-label', $this.data('mark-text') + .attr 'data-id', data.todo.id $btnText.text $this.data('mark-text') - $this.attr 'data-id', data.todo.id else - $this.removeAttr 'data-id' + $this + .attr 'aria-label', $this.data('todo-text') + .removeAttr 'data-id' $btnText.text $this.data('todo-text') sidebarDropdownLoading: (e) -> diff --git a/app/views/shared/issuable/_sidebar.html.haml b/app/views/shared/issuable/_sidebar.html.haml index e3aacb50c97..26052c47b0f 100644 --- a/app/views/shared/issuable/_sidebar.html.haml +++ b/app/views/shared/issuable/_sidebar.html.haml @@ -9,12 +9,11 @@ %a.gutter-toggle.pull-right.js-sidebar-toggle{ role: "button", href: "#", aria: { label: "Toggle sidebar" } } = sidebar_gutter_toggle_icon - if current_user - %button.btn.btn-default.issuable-header-btn.pull-right.js-issuable-todo{ type: "button", data: { todo_text: "Add Todo", mark_text: "Mark Done", id: (todo.id unless todo.nil?), url: issuable_todo_path(issuable) } } - - if todo.nil? - %span + %button.btn.btn-default.issuable-header-btn.pull-right.js-issuable-todo{ type: "button", aria: { label: (todo.nil? ? "Add Todo" : "Mark Done") }, data: { todo_text: "Add Todo", mark_text: "Mark Done", id: (todo.id unless todo.nil?), url: issuable_todo_path(issuable) } } + %span.js-issuable-todo-text + - if todo.nil? Add Todo - - else - %span + - else Mark Done = icon('spin spinner', class: 'hidden js-issuable-todo-loading')