right_sidebar.js.coffee 5.25 KB
Newer Older
1 2
class @Sidebar
  constructor: (currentUser) ->
3 4
    @sidebar = $('aside')

5 6 7
    @addEventListeners()

  addEventListeners: ->
8 9
    @sidebar.on('click', '.sidebar-collapsed-icon', @, @sidebarCollapseClicked)
    $('.dropdown').on('hidden.gl.dropdown', @, @onSidebarDropdownHidden)
10 11 12
    $('.dropdown').on('loading.gl.dropdown', @sidebarDropdownLoading)
    $('.dropdown').on('loaded.gl.dropdown', @sidebarDropdownLoaded)

13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45

    $(document)
      .off 'click', '.js-sidebar-toggle'
      .on 'click', '.js-sidebar-toggle', (e, triggered) ->
        e.preventDefault()
        $this = $(this)
        $thisIcon = $this.find 'i'
        $allGutterToggleIcons = $('.js-sidebar-toggle i')
        if $thisIcon.hasClass('fa-angle-double-right')
          $allGutterToggleIcons
            .removeClass('fa-angle-double-right')
            .addClass('fa-angle-double-left')
          $('aside.right-sidebar')
            .removeClass('right-sidebar-expanded')
            .addClass('right-sidebar-collapsed')
          $('.page-with-sidebar')
            .removeClass('right-sidebar-expanded')
            .addClass('right-sidebar-collapsed')
        else
          $allGutterToggleIcons
            .removeClass('fa-angle-double-left')
            .addClass('fa-angle-double-right')
          $('aside.right-sidebar')
            .removeClass('right-sidebar-collapsed')
            .addClass('right-sidebar-expanded')
          $('.page-with-sidebar')
            .removeClass('right-sidebar-collapsed')
            .addClass('right-sidebar-expanded')
        if not triggered
          $.cookie("collapsed_gutter",
            $('.right-sidebar')
              .hasClass('right-sidebar-collapsed'), { path: '/' })

46 47 48 49
    $(document)
      .off 'click', '.js-issuable-todo'
      .on 'click', '.js-issuable-todo', @toggleTodo

50 51
  toggleTodo: (e) =>
    $this = $(e.currentTarget)
Phil Hughes's avatar
Phil Hughes committed
52 53
    $todoLoading = $('.js-issuable-todo-loading')
    $btnText = $('.js-issuable-todo-text', $this)
Phil Hughes's avatar
Phil Hughes committed
54 55 56 57 58 59
    ajaxType = if $this.attr('data-delete-path') then 'DELETE' else 'POST'

    if $this.attr('data-delete-path')
      url = "#{$this.attr('data-delete-path')}"
    else
      url = "#{$this.data('url')}"
60 61

    $.ajax(
Phil Hughes's avatar
Phil Hughes committed
62
      url: url
63
      type: ajaxType
64
      dataType: 'json'
Phil Hughes's avatar
Phil Hughes committed
65
      data:
Phil Hughes's avatar
Phil Hughes committed
66
        issuable_id: $this.data('issuable-id')
67
        issuable_type: $this.data('issuable-type')
68 69 70 71
      beforeSend: =>
        @beforeTodoSend($this, $todoLoading)
    ).done (data) =>
      @todoUpdateDone(data, $this, $btnText, $todoLoading)
72

73 74 75
  beforeTodoSend: ($btn, $todoLoading) ->
    $btn.disable()
    $todoLoading.removeClass 'hidden'
76

77 78 79
  todoUpdateDone: (data, $btn, $btnText, $todoLoading) ->
    $todoPendingCount = $('.todos-pending-count')
    $todoPendingCount.text data.count
80

81 82 83 84 85 86 87 88
    $btn.enable()
    $todoLoading.addClass 'hidden'

    if data.count is 0
      $todoPendingCount.addClass 'hidden'
    else
      $todoPendingCount.removeClass 'hidden'

Phil Hughes's avatar
Phil Hughes committed
89
    if data.delete_path?
90 91
      $btn
        .attr 'aria-label', $btn.data('mark-text')
Phil Hughes's avatar
Phil Hughes committed
92
        .attr 'data-delete-path', data.delete_path
93 94 95 96
      $btnText.text $btn.data('mark-text')
    else
      $btn
        .attr 'aria-label', $btn.data('todo-text')
Phil Hughes's avatar
Phil Hughes committed
97
        .removeAttr 'data-delete-path'
98
      $btnText.text $btn.data('todo-text')
99

100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121
  sidebarDropdownLoading: (e) ->
    $sidebarCollapsedIcon = $(@).closest('.block').find('.sidebar-collapsed-icon')
    img = $sidebarCollapsedIcon.find('img')
    i = $sidebarCollapsedIcon.find('i')
    $loading = $('<i class="fa fa-spinner fa-spin"></i>')
    if img.length
      img.before($loading)
      img.hide()
    else if i.length
      i.before($loading)
      i.hide()

  sidebarDropdownLoaded: (e) ->
    $sidebarCollapsedIcon = $(@).closest('.block').find('.sidebar-collapsed-icon')
    img = $sidebarCollapsedIcon.find('img')
    $sidebarCollapsedIcon.find('i.fa-spin').remove()
    i = $sidebarCollapsedIcon.find('i')
    if img.length
      img.show()
    else
      i.show()

122
  sidebarCollapseClicked: (e) ->
123 124 125

    return if $(e.currentTarget).hasClass('dont-change-state')

126 127 128 129 130
    sidebar = e.data
    e.preventDefault()
    $block = $(@).closest('.block')
    sidebar.openDropdown($block);

131 132
  openDropdown: (blockOrName) ->
    $block = if _.isString(blockOrName) then @getBlock(blockOrName) else blockOrName
133

134
    $block.find('.edit-link').trigger('click')
135

136 137 138
    if not @isOpen()
      @setCollapseAfterUpdate($block)
      @toggleSidebar('open')
139

140 141 142
  setCollapseAfterUpdate: ($block) ->
    $block.addClass('collapse-after-update')
    $('.page-with-sidebar').addClass('with-overlay')
143

144 145 146 147 148 149
  onSidebarDropdownHidden: (e) ->
    sidebar = e.data
    e.preventDefault()
    $block = $(@).closest('.block')
    sidebar.sidebarDropdownHidden($block)

150
  sidebarDropdownHidden: ($block) ->
151 152
    if $block.hasClass('collapse-after-update')
      $block.removeClass('collapse-after-update')
153
      $('.page-with-sidebar').removeClass('with-overlay')
154 155 156 157 158 159 160 161 162 163 164 165 166 167 168
      @toggleSidebar('hide')

  triggerOpenSidebar: ->
    @sidebar
      .find('.js-sidebar-toggle')
      .trigger('click')

  toggleSidebar: (action = 'toggle') ->
    if action is 'toggle'
      @triggerOpenSidebar()

    if action is 'open'
      @triggerOpenSidebar() if not @isOpen()

    if action is 'hide'
169
      @triggerOpenSidebar() if @isOpen()
170 171 172 173 174 175

  isOpen: ->
    @sidebar.is('.right-sidebar-expanded')

  getBlock: (name) ->
    @sidebar.find(".block.#{name}")