Commit 7157f79caa88689f1b8989d183ef20fbc942bd0f

Authored by Dmitriy Zaporozhets
1 parent 9f405068

Refactor js behaviours helpers

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
app/assets/javascripts/behaviors/details_behavior.coffee
1 1 $ ->
2 2 $("body").on "click", ".js-details-target", ->
3 3 container = $(@).closest(".js-details-container")
4   -
5 4 container.toggleClass("open")
  5 +
  6 + # Show details content. Hides link after click.
  7 + #
  8 + # %div
  9 + # %a.js-details-expand
  10 + # %div.js-details-content
  11 + #
  12 + $("body").on "click", ".js-details-expand", (e) ->
  13 + $(@).next('.js-details-content').removeClass("hide")
  14 + $(@).hide()
  15 + e.preventDefault()
... ...
app/assets/javascripts/behaviors/toggler_behavior.coffee
1 1 $ ->
2 2 $("body").on "click", ".js-toggler-target", ->
3 3 container = $(@).closest(".js-toggler-container")
4   -
5 4 container.toggleClass("on")
6 5  
7   - $("body").on "click", ".js-toggle-visibility-link", (e) ->
  6 + # Toggle button. Show/hide content inside parent container.
  7 + # Button does not change visibility. If button has icon - it changes chevron style.
  8 + #
  9 + # %div.js-toggle-container
  10 + # %a.js-toggle-button
  11 + # %div.js-toggle-content
  12 + #
  13 + $("body").on "click", ".js-toggle-button", (e) ->
8 14 $(@).find('i').
9 15 toggleClass('icon-chevron-down').
10 16 toggleClass('icon-chevron-up')
11   - container = $(".js-toggle-visibility-container")
12   - container.toggleClass("hide")
13   - e.preventDefault()
14   -
15   - $("body").on "click", ".js-toggle-button", (e) ->
16 17 $(@).closest(".js-toggle-container").find(".js-toggle-content").toggle()
17 18 e.preventDefault()
... ...
app/assets/javascripts/main.js.coffee
... ... @@ -62,11 +62,6 @@ $ -&gt;
62 62 $('.remove-row').bind 'ajax:success', ->
63 63 $(this).closest('li').fadeOut()
64 64  
65   - # Click a .appear-link, appear-data fadeout
66   - $(".appear-link").on 'click', (e) ->
67   - $('.appear-data').fadeIn()
68   - e.preventDefault()
69   -
70 65 # Initialize select2 selects
71 66 $('select.select2').select2(width: 'resolve', dropdownAutoWidth: true)
72 67  
... ... @@ -121,10 +116,6 @@ $ -&gt;
121 116 $(@).next('table').show()
122 117 $(@).remove()
123 118  
124   - $(".diff-content").on "click", ".js-details-expand", ->
125   - $(@).next('.js-details-contain').removeClass("hide")
126   - $(@).remove()
127   -
128 119 (($) ->
129 120 # Disable an element and add the 'disabled' Bootstrap class
130 121 $.fn.extend disable: ->
... ...
app/assets/stylesheets/generic/common.scss
... ... @@ -298,10 +298,6 @@ img.emoji {
298 298 width: 20px;
299 299 }
300 300  
301   -.appear-data {
302   - display: none;
303   -}
304   -
305 301 .chart {
306 302 overflow: hidden;
307 303 height: 220px;
... ...
app/views/groups/members.html.haml
... ... @@ -9,7 +9,7 @@
9 9  
10 10 %hr
11 11  
12   -.clearfix
  12 +.clearfix.js-toggle-container
13 13 = form_tag members_group_path(@group), method: :get, class: 'form-inline member-search-form' do
14 14 .form-group
15 15 = search_field_tag :search, params[:search], { placeholder: 'Find member by name', class: 'form-control search-text-input input-mn-300' }
... ... @@ -17,11 +17,11 @@
17 17  
18 18 - if current_user && current_user.can?(:manage_group, @group)
19 19 .pull-right
20   - = link_to '#', class: 'btn btn-new js-toggle-visibility-link' do
  20 + = link_to '#', class: 'btn btn-new js-toggle-button' do
21 21 Add members
22 22 %i.icon-chevron-down
23 23  
24   - .js-toggle-visibility-container.hide.new-group-member-holder
  24 + .js-toggle-content.hide.new-group-member-holder
25 25 = render "new_group_member"
26 26  
27 27 .ui-box.prepend-top-20
... ...
app/views/projects/commit/_commit_box.html.haml
... ... @@ -47,7 +47,7 @@
47 47 - if @branches.any?
48 48 and in
49 49 = link_to("#{pluralize(@branches.count, "other branch")}", "#", class: "js-details-expand")
50   - %span.js-details-contain.hide
  50 + %span.js-details-content.hide
51 51 = commit_branches_links(@project, @branches)
52 52  
53 53 .commit-box
... ...
app/views/projects/edit.html.haml
... ... @@ -93,100 +93,101 @@
93 93  
94 94  
95 95  
96   - .centered-light-block
97   - %h3
98   - %i.icon-warning-sign
99   - Dangerous settings
100   -
101   - %p Project settings below may result in data loss!
102   - = link_to '#', class: 'btn js-toggle-visibility-link' do
103   - Show it to me
104   - %i.icon-chevron-down
105   -
106   - .js-toggle-visibility-container.hide
107   - - if can? current_user, :archive_project, @project
108   - .ui-box.ui-box-danger
109   - .title
110   - - if @project.archived?
111   - Unarchive project
112   - - else
113   - Archive project
114   - .body
115   - - if @project.archived?
116   - %p
117   - Unarchiving the project will mark its repository as active.
118   - %br
119   - The project can be committed to.
120   - %br
121   - %strong Once active this project shows up in the search and on the dashboard.
122   - = link_to 'Unarchive', unarchive_project_path(@project),
123   - data: { confirm: "Are you sure that you want to unarchive this project?\nWhen this project is unarchived it is active and can be comitted to again." },
124   - method: :post, class: "btn btn-remove"
125   - - else
126   - %p
127   - Archiving the project will mark its repository as read-only.
128   - %br
129   - It is hidden from the dashboard and doesn't show up in searches.
130   - %br
131   - %strong Archived projects cannot be committed to!
132   - = link_to 'Archive', archive_project_path(@project),
133   - data: { confirm: "Are you sure that you want to archive this project?\nAn archived project cannot be committed to." },
134   - method: :post, class: "btn btn-remove"
135   - - else
136   - .nothing-here-block Only the project owner can archive a project
137   -
138   - - if can?(current_user, :change_namespace, @project)
  96 + .danger-settings.js-toggle-container
  97 + .centered-light-block
  98 + %h3
  99 + %i.icon-warning-sign
  100 + Dangerous settings
  101 +
  102 + %p Project settings below may result in data loss!
  103 + = link_to '#', class: 'btn js-toggle-button' do
  104 + Show it to me
  105 + %i.icon-chevron-down
  106 +
  107 + .js-toggle-content.hide
  108 + - if can? current_user, :archive_project, @project
  109 + .ui-box.ui-box-danger
  110 + .title
  111 + - if @project.archived?
  112 + Unarchive project
  113 + - else
  114 + Archive project
  115 + .body
  116 + - if @project.archived?
  117 + %p
  118 + Unarchiving the project will mark its repository as active.
  119 + %br
  120 + The project can be committed to.
  121 + %br
  122 + %strong Once active this project shows up in the search and on the dashboard.
  123 + = link_to 'Unarchive', unarchive_project_path(@project),
  124 + data: { confirm: "Are you sure that you want to unarchive this project?\nWhen this project is unarchived it is active and can be comitted to again." },
  125 + method: :post, class: "btn btn-remove"
  126 + - else
  127 + %p
  128 + Archiving the project will mark its repository as read-only.
  129 + %br
  130 + It is hidden from the dashboard and doesn't show up in searches.
  131 + %br
  132 + %strong Archived projects cannot be committed to!
  133 + = link_to 'Archive', archive_project_path(@project),
  134 + data: { confirm: "Are you sure that you want to archive this project?\nAn archived project cannot be committed to." },
  135 + method: :post, class: "btn btn-remove"
  136 + - else
  137 + .nothing-here-block Only the project owner can archive a project
  138 +
  139 + - if can?(current_user, :change_namespace, @project)
  140 + .ui-box.ui-box-danger
  141 + .title Transfer project
  142 + .errors-holder
  143 + .form-holder
  144 + = form_for(@project, url: transfer_project_path(@project), method: :put, remote: true, html: { class: 'transfer-project form-horizontal' }) do |f|
  145 + .form-group
  146 + = f.label :namespace_id, class: 'control-label' do
  147 + %span Namespace
  148 + .col-sm-10
  149 + .form-group
  150 + = f.select :namespace_id, namespaces_options(@project.namespace_id), { prompt: 'Choose a project namespace' }, { class: 'select2' }
  151 + %ul
  152 + %li Be careful. Changing the project's namespace can have unintended side effects.
  153 + %li You can only transfer the project to namespaces you manage.
  154 + %li You will need to update your local repositories to point to the new location.
  155 + .form-actions
  156 + = f.submit 'Transfer', class: "btn btn-remove"
  157 + - else
  158 + .nothing-here-block Only the project owner can transfer a project
  159 +
139 160 .ui-box.ui-box-danger
140   - .title Transfer project
  161 + .title Rename repository
141 162 .errors-holder
142 163 .form-holder
143   - = form_for(@project, url: transfer_project_path(@project), method: :put, remote: true, html: { class: 'transfer-project form-horizontal' }) do |f|
  164 + = form_for(@project, html: { class: 'form-horizontal' }) do |f|
144 165 .form-group
145   - = f.label :namespace_id, class: 'control-label' do
146   - %span Namespace
147   - .col-sm-10
  166 + = f.label :path, class: 'control-label' do
  167 + %span Path
  168 + .col-sm-9
148 169 .form-group
149   - = f.select :namespace_id, namespaces_options(@project.namespace_id), { prompt: 'Choose a project namespace' }, { class: 'select2' }
  170 + .input-group
  171 + = f.text_field :path, class: 'form-control'
  172 + %span.input-group-addon .git
150 173 %ul
151   - %li Be careful. Changing the project's namespace can have unintended side effects.
152   - %li You can only transfer the project to namespaces you manage.
  174 + %li Be careful. Renaming a project's repository can have unintended side effects.
153 175 %li You will need to update your local repositories to point to the new location.
154 176 .form-actions
155   - = f.submit 'Transfer', class: "btn btn-remove"
156   - - else
157   - .nothing-here-block Only the project owner can transfer a project
158   -
159   - .ui-box.ui-box-danger
160   - .title Rename repository
161   - .errors-holder
162   - .form-holder
163   - = form_for(@project, html: { class: 'form-horizontal' }) do |f|
164   - .form-group
165   - = f.label :path, class: 'control-label' do
166   - %span Path
167   - .col-sm-9
168   - .form-group
169   - .input-group
170   - = f.text_field :path, class: 'form-control'
171   - %span.input-group-addon .git
172   - %ul
173   - %li Be careful. Renaming a project's repository can have unintended side effects.
174   - %li You will need to update your local repositories to point to the new location.
175   - .form-actions
176   - = f.submit 'Rename', class: "btn btn-remove"
177   -
178   - - if can?(current_user, :remove_project, @project)
179   - .ui-box.ui-box-danger
180   - .title Remove project
181   - .body
182   - %p
183   - Removing the project will delete its repository and all related resources including issues, merge requests etc.
184   - %br
185   - %strong Removed projects cannot be restored!
186   -
187   - = link_to 'Remove project', @project, data: { confirm: remove_project_message(@project) }, method: :delete, class: "btn btn-remove"
188   - - else
189   - .nothing-here-block Only project owner can remove a project
  177 + = f.submit 'Rename', class: "btn btn-remove"
  178 +
  179 + - if can?(current_user, :remove_project, @project)
  180 + .ui-box.ui-box-danger
  181 + .title Remove project
  182 + .body
  183 + %p
  184 + Removing the project will delete its repository and all related resources including issues, merge requests etc.
  185 + %br
  186 + %strong Removed projects cannot be restored!
  187 +
  188 + = link_to 'Remove project', @project, data: { confirm: remove_project_message(@project) }, method: :delete, class: "btn btn-remove"
  189 + - else
  190 + .nothing-here-block Only project owner can remove a project
190 191  
191 192 .save-project-loader.hide
192 193 %center
... ...
app/views/projects/merge_requests/show/_mr_accept.html.haml
... ... @@ -15,18 +15,19 @@
15 15 = link_to "click here", "#modal_merge_info", class: "how_to_merge_link vlink", title: "How To Merge", "data-toggle" => "modal"
16 16 for instructions.
17 17  
18   - %br
19   - If you want to modify merge commit message -
20   - %strong
21   - = link_to "click here", "#", class: "modify-merge-commit-link js-toggle-visibility-link", title: "Modify merge commit message"
22 18  
23   - .js-toggle-visibility-container.hide
24   - .form-group
25   - = label_tag :merge_commit_message, "Commit message", class: 'control-label'
26   - .col-sm-10
27   - = text_area_tag :merge_commit_message, @merge_request.merge_commit_message, class: "form-control js-gfm-input", rows: 14, required: true
28   - %p.hint
29   - The recommended maximum line length is 52 characters for the first line and 72 characters for all following lines.
  19 + .js-toggle-container
  20 + %p
  21 + If you want to modify merge commit message -
  22 + %strong
  23 + = link_to "click here", "#", class: "modify-merge-commit-link js-toggle-button", title: "Modify merge commit message"
  24 + .js-toggle-content.hide
  25 + .form-group
  26 + = label_tag :merge_commit_message, "Commit message", class: 'control-label'
  27 + .col-sm-10
  28 + = text_area_tag :merge_commit_message, @merge_request.merge_commit_message, class: "form-control js-gfm-input", rows: 14, required: true
  29 + %p.hint
  30 + The recommended maximum line length is 52 characters for the first line and 72 characters for all following lines.
30 31  
31 32 .accept-group
32 33 .pull-left
... ...
app/views/projects/new.html.haml
... ... @@ -9,18 +9,6 @@
9 9 %strong Project name
10 10 .col-sm-10
11 11 = f.text_field :name, placeholder: "Example Project", class: "form-control", tabindex: 1, autofocus: true
12   - .help-inline
13   - = link_to "#", class: 'js-toggle-visibility-link' do
14   - %span Customize repository name?
15   -
16   - .form-group.js-toggle-visibility-container.hide
17   - = f.label :path, class: 'control-label' do
18   - %span Repository name
19   - .col-sm-10
20   - .input-group
21   - = f.text_field :path, class: 'form-control'
22   - %span.input-group-addon .git
23   -
24 12  
25 13 - if current_user.can_select_namespace?
26 14 .form-group
... ... @@ -29,19 +17,39 @@
29 17 .col-sm-10
30 18 = f.select :namespace_id, namespaces_options(params[:namespace_id] || :current_user), {}, {class: 'select2', tabindex: 2}
31 19  
32   - .form-group
33   - .col-sm-2
34   - .col-sm-10
35   - = link_to "#", class: 'appear-link' do
36   - %i.icon-upload-alt
37   - %span Import existing repository?
38   - .form-group.appear-data.import-url-data
39   - = f.label :import_url, class: 'control-label' do
40   - %span Import existing repo
41   - .col-sm-10
42   - = f.text_field :import_url, class: 'form-control', placeholder: 'https://github.com/randx/six.git'
43   - .light
44   - URL must be cloneable
  20 + %hr
  21 + .js-toggle-container
  22 + .form-group
  23 + .col-sm-2
  24 + .col-sm-10
  25 + = link_to "#", class: 'js-toggle-button' do
  26 + %span Customize repository name?
  27 + .js-toggle-content.hide
  28 + .form-group
  29 + = f.label :path, class: 'control-label' do
  30 + %span Repository name
  31 + .col-sm-10
  32 + .input-group
  33 + = f.text_field :path, class: 'form-control'
  34 + %span.input-group-addon .git
  35 +
  36 + .js-toggle-container
  37 + .form-group
  38 + .col-sm-2
  39 + .col-sm-10
  40 + = link_to "#", class: 'js-toggle-button' do
  41 + %i.icon-upload-alt
  42 + %span Import existing repository?
  43 + .js-toggle-content.hide
  44 + .form-group.import-url-data
  45 + = f.label :import_url, class: 'control-label' do
  46 + %span Import existing repo
  47 + .col-sm-10
  48 + = f.text_field :import_url, class: 'form-control', placeholder: 'https://github.com/randx/six.git'
  49 + .light
  50 + URL must be cloneable
  51 + %hr
  52 +
45 53 .form-group
46 54 = f.label :description, class: 'control-label' do
47 55 Description
... ...