Download as
Browse Code »

Commit 8a179611262221f6f3cf2f8737d4340d74f0b282

Authored by Dmitriy Zaporozhets
1 parent 12cb7cee
Exists in spb-stable and in 3 other branches 6-8-stable, 7-0-stable, 7-0-stable-spb

Replace chosen with select2 

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Showing 23 changed files with 55 additions and 115 deletions   Show diff stats
app/assets/javascripts/application.js
  Diff comments   View file @8a17961
... ... @@ -19,7 +19,6 @@
19 19 //= require jquery.turbolinks
20 20 //= require bootstrap
21 21 //= require modernizr
22   -//= require chosen-jquery
23 22 //= require select2
24 23 //= require raphael
25 24 //= require g.raphael-min
... ...
app/assets/javascripts/issues.js.coffee
  Diff comments   View file @8a17961
... ... @@ -29,12 +29,10 @@
29 29 $('#filter_issue_search').val($('#issue_search').val())
30 30  
31 31 initSelects: ->
32   - $("#update_status").chosen()
33   - $("#update_assignee_id").chosen()
34   - $("#update_milestone_id").chosen()
35   - $("#label_name").chosen()
36   - $("#assignee_id").chosen()
37   - $("#milestone_id").chosen()
  32 + $("select#update_status").select2()
  33 + $("select#update_assignee_id").select2()
  34 + $("select#update_milestone_id").select2()
  35 + $("select#label_name").select2()
38 36 $("#milestone_id, #assignee_id, #label_name").on "change", ->
39 37 $(this).closest("form").submit()
40 38  
... ...
app/assets/javascripts/main.js.coffee
  Diff comments   View file @8a17961
... ... @@ -67,8 +67,8 @@ $ -&gt;
67 67 $('.appear-data').fadeIn()
68 68 e.preventDefault()
69 69  
70   - # Initialize chosen selects
71   - $('select.chosen').chosen()
  70 + # Initialize select2 selects
  71 + $('select.select2').select2(width: 'resolve')
72 72  
73 73 # Initialize tooltips
74 74 $('.has_tooltip').tooltip()
... ... @@ -126,12 +126,6 @@ $ -&gt;
126 126 $(@).remove()
127 127  
128 128 (($) ->
129   - _chosen = $.fn.chosen
130   - $.fn.extend chosen: (options) ->
131   - default_options = search_contains: "true"
132   - $.extend default_options, options
133   - _chosen.apply @, [default_options]
134   -
135 129 # Disable an element and add the 'disabled' Bootstrap class
136 130 $.fn.extend disable: ->
137 131 $(@).attr('disabled', 'disabled').addClass('disabled')
... ...
app/assets/javascripts/merge_requests.js.coffee
  Diff comments   View file @8a17961
... ... @@ -2,8 +2,8 @@
2 2 # * Filter merge requests
3 3 #
4 4 @merge_requestsPage = ->
5   - $('#assignee_id').chosen()
6   - $('#milestone_id').chosen()
  5 + $('#assignee_id').select2()
  6 + $('#milestone_id').select2()
7 7 $('#milestone_id, #assignee_id').on 'change', ->
8 8 $(this).closest('form').submit()
9 9  
... ...
app/assets/stylesheets/application.scss
  Diff comments   View file @8a17961
... ... @@ -4,7 +4,6 @@
4 4 * the top of the compiled file, but it's generally better to create a new file per style scope.
5 5 *= require jquery.ui.gitlab
6 6 *= require jquery.atwho
7   - *= require chosen
8 7 *= require select2
9 8 *= require_self
10 9 */
... ...
app/assets/stylesheets/generic/selects.scss
  Diff comments   View file @8a17961
1   -/** Chosen.js selectbox style override **/
2   -.chosen-container {
3   - min-width: 100px;
  1 +/** Select2 selectbox style override **/
4 2  
5   - .chosen-single {
6   - height: 26px;
7   - background: #EEE !important;
8   - border: 1px solid #DDD !important;
9   - @include box-shadow(none !important);
10   - @include border-radius(4px !important);
  3 +.select2-container {
  4 + .select2-choice {
  5 + background: #EEE;
  6 + border-color: #BBB;
11 7 }
12   -
13   - .chosen-results li.highlighted {
14   - background: #29b;
15   - }
16   -
17   - .chosen-drop {
18   - margin-top: 10px;
19   - border: 1px solid #DDD !important;
20   - @include border-radius(4px !important);
21   - }
22   -
23   - .chosen-search input {
24   - border: 1px solid #CCC !important;
25   - @include box-shadow(none !important);
26   - }
27   -}
28   -
29   -/** Select2 styling **/
30   -.select2-container .select2-choice {
31   - @include bg-light-gray-gradient;
32   -}
33   -
34   -.select2-container .select2-choice div {
35   - border: none;
36   - background: none;
37   -}
38   -
39   -.select2-drop {
40   - padding-top: 8px;
41   -}
42   -
43   -.select2-no-results, .select2-searching {
44   - padding: 7px;
45   - color: #666;
46   -}
47   -
48   -.chosen-container .chosen-single div b {
49   - background-position-y: 0px !important;
50   -}
51   -
52   -.chosen-container .chosen-drop .chosen-search input {
53   - background-position-y: -24px !important;
54   -}
55   -
56   -.chosen-compact {
57   - max-width: 170px !important;
58 8 }
59 9  
60 10 select {
61   - &.chosen {
  11 + &.select2 {
62 12 width: 100px;
63 13 }
64 14  
65   - &.chosen-sm {
  15 + &.select2-sm {
66 16 width: 100px;
67 17 }
68 18 }
69 19  
70 20 @media (min-width: $screen-sm-min) {
71 21 select {
72   - &.chosen {
  22 + &.select2 {
73 23 width: 150px;
74 24 }
75   - &.chosen-sm {
  25 + &.select2-sm {
76 26 width: 120px;
77 27 }
78 28 }
... ... @@ -81,10 +31,10 @@ select {
81 31 /* Medium devices (desktops, 992px and up) */
82 32 @media (min-width: $screen-md-min) {
83 33 select {
84   - &.chosen {
  34 + &.select2 {
85 35 width: 170px;
86 36 }
87   - &.chosen-sm {
  37 + &.select2-sm {
88 38 width: 140px;
89 39 }
90 40 }
... ... @@ -93,10 +43,10 @@ select {
93 43 /* Large devices (large desktops, 1200px and up) */
94 44 @media (min-width: $screen-lg-min) {
95 45 select {
96   - &.chosen {
  46 + &.select2 {
97 47 width: 200px;
98 48 }
99   - &.chosen-sm {
  49 + &.select2-sm {
100 50 width: 150px;
101 51 }
102 52 }
... ...
app/assets/stylesheets/sections/issues.scss
  Diff comments   View file @8a17961
... ... @@ -77,8 +77,8 @@ input.check_all_issues {
77 77 @media (min-width: 800px) { .issues_filters select { width: 160px; } }
78 78 @media (min-width: 1200px) { .issues_filters select { width: 220px; } }
79 79  
80   -@media (min-width: 800px) { .issues_bulk_update .chosen-container { min-width: 120px; } }
81   -@media (min-width: 1200px) { .issues_bulk_update .chosen-container { min-width: 160px; } }
  80 +@media (min-width: 800px) { .issues_bulk_update .select2-container { min-width: 120px; } }
  81 +@media (min-width: 1200px) { .issues_bulk_update .select2-container { min-width: 160px; } }
82 82  
83 83 .issues-holder {
84 84 .issues_filters {
... ... @@ -105,7 +105,7 @@ input.check_all_issues {
105 105 }
106 106  
107 107 .issues_bulk_update {
108   - .chosen-container {
  108 + .select2-container {
109 109 text-shadow: none;
110 110 }
111 111 }
... ...
app/assets/stylesheets/sections/merge_requests.scss
  Diff comments   View file @8a17961
... ... @@ -95,7 +95,7 @@
95 95 font-weight: normal !important;
96 96 }
97 97  
98   - .chosen-container .chosen-single {
  98 + .select2-container .select2-single {
99 99 span {
100 100 font-weight: bold;
101 101 color: #555;
... ...
app/assets/stylesheets/sections/projects.scss
  Diff comments   View file @8a17961
... ... @@ -230,7 +230,7 @@ ul.nav.nav-projects-tabs {
230 230 }
231 231 }
232 232  
233   -.transfer-project .chosen-container {
  233 +.transfer-project .select2-container {
234 234 min-width: 200px;
235 235 }
236 236  
... ... @@ -245,23 +245,23 @@ ul.nav.nav-projects-tabs {
245 245 }
246 246 }
247 247  
248   -.project-refs-form .chosen-container {
  248 +.project-refs-form .select2-container {
249 249 position: relative;
250 250 top: 0;
251 251 left: 0;
252 252 margin-right: 10px;
253 253  
254   - .chosen-single span {
  254 + .select2-single span {
255 255 font-weight: bold;
256 256 color: #555;
257 257 }
258 258  
259   - &.chosen-container-active {
260   - .chosen-drop {
  259 + &.select2-container-active {
  260 + .select2-drop {
261 261 min-width: 400px;
262 262 }
263 263  
264   - .chosen-results {
  264 + .select2-results {
265 265 max-height: 400px;
266 266 }
267 267 }
... ...
app/views/admin/groups/show.html.haml
  Diff comments   View file @8a17961
... ... @@ -57,7 +57,7 @@
57 57 %div
58 58 = users_select_tag(:user_ids, multiple: true)
59 59 %div.prepend-top-10
60   - = select_tag :group_access, options_for_select(UsersGroup.group_access_roles), class: "project-access-select chosen"
  60 + = select_tag :group_access, options_for_select(UsersGroup.group_access_roles), class: "project-access-select select2"
61 61 %hr
62 62 = submit_tag 'Add users into group', class: "btn btn-create"
63 63 .ui-box
... ...
app/views/groups/_new_group_member.html.haml
  Diff comments   View file @8a17961
... ... @@ -12,7 +12,7 @@
12 12 %p 2. Set access level for them
13 13 .form-group
14 14 = f.label :group_access, "Group Access", class: 'control-label'
15   - .col-sm-10= select_tag :group_access, options_for_select(UsersGroup.group_access_roles, @users_group.group_access), class: "project-access-select chosen"
  15 + .col-sm-10= select_tag :group_access, options_for_select(UsersGroup.group_access_roles, @users_group.group_access), class: "project-access-select select2"
16 16  
17 17 .form-actions
18 18 = f.submit 'Add users into group', class: "btn btn-create"
... ...
app/views/projects/edit.html.haml
  Diff comments   View file @8a17961
... ... @@ -26,7 +26,7 @@
26 26 - if @project.repository.exists? && @project.repository.branch_names.any?
27 27 .form-group
28 28 = f.label :default_branch, "Default Branch", class: 'control-label'
29   - .col-sm-10= f.select(:default_branch, @repository.branch_names, {}, {class: 'chosen select-wide'})
  29 + .col-sm-10= f.select(:default_branch, @repository.branch_names, {}, {class: 'select2 select-wide'})
30 30  
31 31  
32 32 = render "visibility_level", f: f, visibility_level: @project.visibility_level, can_change_visibility_level: can?(current_user, :change_visibility_level, @project)
... ... @@ -145,7 +145,7 @@
145 145 %span Namespace
146 146 .col-sm-10
147 147 .form-group
148   - = f.select :namespace_id, namespaces_options(@project.namespace_id), { prompt: 'Choose a project namespace' }, { class: 'chosen' }
  148 + = f.select :namespace_id, namespaces_options(@project.namespace_id), { prompt: 'Choose a project namespace' }, { class: 'select2' }
149 149 %ul
150 150 %li Be careful. Changing the project's namespace can have unintended side effects.
151 151 %li You can only transfer the project to namespaces you manage.
... ...
app/views/projects/issues/_form.html.haml
  Diff comments   View file @8a17961
... ... @@ -24,7 +24,7 @@
24 24 %i.icon-user
25 25 Assign to
26 26 .col-sm-10
27   - = f.select(:assignee_id, assignee_options(@issue), { include_blank: "Select a user" }, {class: 'chosen'})
  27 + = f.select(:assignee_id, assignee_options(@issue), { include_blank: "Select a user" }, {class: 'select2'})
28 28 &nbsp;
29 29 = link_to 'Assign to me', '#', class: 'btn btn-small assign-to-me-link'
30 30 .form-group
... ... @@ -32,7 +32,7 @@
32 32 = f.label :milestone_id, class: 'control-label' do
33 33 %i.icon-time
34 34 Milestone
35   - .col-sm-10= f.select(:milestone_id, milestone_options(@issue), { include_blank: "Select milestone" }, {class: 'chosen'})
  35 + .col-sm-10= f.select(:milestone_id, milestone_options(@issue), { include_blank: "Select milestone" }, {class: 'select2'})
36 36  
37 37 .form-group
38 38 = f.label :label_list, class: 'control-label' do
... ... @@ -87,6 +87,6 @@
87 87 });
88 88  
89 89 $('.assign-to-me-link').on('click', function(e){
90   - $('#issue_assignee_id').val("#{current_user.id}").trigger("chosen:updated");
  90 + $('#issue_assignee_id').val("#{current_user.id}").trigger("change");
91 91 e.preventDefault();
92 92 });
... ...
app/views/projects/issues/_issue_context.html.haml
  Diff comments   View file @8a17961
... ... @@ -6,7 +6,7 @@
6 6 - if can?(current_user, :modify_issue, @issue)
7 7 = link_to profile_path(issue.assignee) do
8 8 = image_tag(avatar_icon(issue.assignee.email), class: 'avatar avatar-inline s16 assignee') if issue.assignee
9   - = f.select(:assignee_id, assignee_options(@issue), { include_blank: "Assign to user (none):" }, {class: 'chosen'})
  9 + = f.select(:assignee_id, assignee_options(@issue), { include_blank: "Assign to user (none):" }, {class: 'select2'})
10 10 - elsif issue.assignee
11 11 = link_to_member(@project, @issue.assignee)
12 12  
... ... @@ -17,7 +17,7 @@
17 17 %cite.cgray Attached to milestone
18 18  
19 19 - if can?(current_user, :modify_issue, @issue)
20   - = f.select(:milestone_id, milestone_options(@issue), { include_blank: "Select milestone (none):" }, {class: 'chosen chosen-compact'})
  20 + = f.select(:milestone_id, milestone_options(@issue), { include_blank: "Select milestone (none):" }, {class: 'select2 select2-compact'})
21 21  
22 22 = hidden_field_tag :issue_context
23 23 = f.submit class: 'btn'
... ...
app/views/projects/issues/update.js.haml
  Diff comments   View file @8a17961
... ... @@ -5,7 +5,7 @@
5 5 - elsif params[:issue_context]
6 6 $('.issue-box .context').html("#{escape_javascript(render partial: 'issue_context', locals: { issue: @issue })}");
7 7 $('.issue-box .context').effect('highlight');
8   - $('.chosen').chosen();
  8 + $('.select2').select2();
9 9 $('.edit-issue.inline-update input[type="submit"]').hide();
10 10 - if @issue.milestone
11 11 $('.milestone-nav-link').replaceWith("<span class='milestone-nav-link'>| <span class='light'>Milestone</span> #{escape_javascript(link_to @issue.milestone.title, project_milestone_path(@issue.project, @issue.milestone))}</span>")
... ...
app/views/projects/merge_requests/_form.html.haml
  Diff comments   View file @8a17961
... ... @@ -10,10 +10,10 @@
10 10 .col-md-5
11 11 .clearfix
12 12 .pull-left
13   - = f.select(:source_project_id, [[@merge_request.source_project_path,@merge_request.source_project.id]] , {}, { class: 'source_project chosen span3', disabled: @merge_request.persisted? })
  13 + = f.select(:source_project_id, [[@merge_request.source_project_path,@merge_request.source_project.id]] , {}, { class: 'source_project select2 span3', disabled: @merge_request.persisted? })
14 14 .pull-left
15 15 &nbsp;
16   - = f.select(:source_branch, @merge_request.source_project.repository.branch_names, { include_blank: "Select branch" }, {class: 'source_branch chosen span2'})
  16 + = f.select(:source_branch, @merge_request.source_project.repository.branch_names, { include_blank: "Select branch" }, {class: 'source_branch select2 span2'})
17 17 .mr_source_commit.prepend-top-10
18 18 .col-md-2
19 19 .merge-request-angle
... ... @@ -22,10 +22,10 @@
22 22 .clearfix
23 23 .pull-left
24 24 - projects = @project.forked_from_project.nil? ? [@project] : [ @project,@project.forked_from_project]
25   - = f.select(:target_project_id, options_from_collection_for_select(projects, 'id', 'path_with_namespace'), {}, { class: 'target_project chosen span3', disabled: @merge_request.persisted? })
  25 + = f.select(:target_project_id, options_from_collection_for_select(projects, 'id', 'path_with_namespace'), {}, { class: 'target_project select2 span3', disabled: @merge_request.persisted? })
26 26 .pull-left
27 27 &nbsp;
28   - = f.select(:target_branch, @target_branches, { include_blank: "Select branch" }, {class: 'target_branch chosen span2'})
  28 + = f.select(:target_branch, @target_branches, { include_blank: "Select branch" }, {class: 'target_branch select2 span2'})
29 29 .mr_target_commit.prepend-top-10
30 30  
31 31 %hr
... ... @@ -47,7 +47,7 @@
47 47 %i.icon-user
48 48 Assign to
49 49 .col-sm-10
50   - = f.select(:assignee_id, assignee_options(@merge_request), { include_blank: "Select a user" }, {class: 'chosen'})
  50 + = f.select(:assignee_id, assignee_options(@merge_request), { include_blank: "Select a user" }, {class: 'select2'})
51 51 &nbsp;
52 52 = link_to 'Assign to me', '#', class: 'btn btn-small assign-to-me-link'
53 53 .form-group
... ... @@ -55,7 +55,7 @@
55 55 = f.label :milestone_id, class: 'control-label' do
56 56 %i.icon-time
57 57 Milestone
58   - .col-sm-10= f.select(:milestone_id, milestone_options(@merge_request), { include_blank: "Select milestone" }, {class: 'chosen'})
  58 + .col-sm-10= f.select(:milestone_id, milestone_options(@merge_request), { include_blank: "Select milestone" }, {class: 'select2'})
59 59  
60 60  
61 61 .form-actions
... ... @@ -90,6 +90,6 @@
90 90 $.get("#{branch_to_project_merge_requests_path(@source_project)}", {target_project_id: target_project.val(),ref: $(this).val() });
91 91 });
92 92 $('.assign-to-me-link').on('click', function(e){
93   - $('#merge_request_assignee_id').val("#{current_user.id}").trigger("chosen:updated");
  93 + $('#merge_request_assignee_id').val("#{current_user.id}").trigger("select2:updated");
94 94 e.preventDefault();
95 95 });
... ...
app/views/projects/merge_requests/update_branches.js.haml
  Diff comments   View file @8a17961
1 1 :plain
2 2 $(".target_branch").html("#{escape_javascript(options_for_select(@target_branches))}");
3   - $(".target_branch").trigger("chosen:updated");
  3 + $(".target_branch").trigger("select2:updated");
4 4 $(".mr_target_commit").html("");
5 5 $(".target_branch").trigger("change");
... ...
app/views/projects/new.html.haml
  Diff comments   View file @8a17961
... ... @@ -27,7 +27,7 @@
27 27 = f.label :namespace_id, class: 'control-label' do
28 28 %span Namespace
29 29 .col-sm-10
30   - = f.select :namespace_id, namespaces_options(params[:namespace_id] || :current_user), {}, {class: 'chosen', tabindex: 2}
  30 + = f.select :namespace_id, namespaces_options(params[:namespace_id] || :current_user), {}, {class: 'select2', tabindex: 2}
31 31  
32 32 .form-group
33 33 .col-sm-2
... ...
app/views/projects/protected_branches/index.html.haml
  Diff comments   View file @8a17961
... ... @@ -22,7 +22,7 @@
22 22 .entry.clearfix
23 23 = f.label :name, "Branch"
24 24 .col-md-3
25   - = f.select(:name, @project.open_branches.map { |br| [br.name, br.name] } , {include_blank: "Select branch"}, {class: "chosen span3"})
  25 + = f.select(:name, @project.open_branches.map { |br| [br.name, br.name] } , {include_blank: "Select branch"}, {class: "select2 span3"})
26 26 &nbsp;
27 27 = f.submit 'Protect', class: "btn-create btn"
28 28 - unless @branches.empty?
... ...
app/views/projects/snippets/_form.html.haml
  Diff comments   View file @8a17961
... ... @@ -14,7 +14,7 @@
14 14 .col-sm-10= f.text_field :title, placeholder: "Example Snippet", class: 'form-control', required: true
15 15 .form-group
16 16 = f.label "Lifetime"
17   - .col-sm-10= f.select :expires_at, lifetime_select_options, {}, {class: 'chosen span2'}
  17 + .col-sm-10= f.select :expires_at, lifetime_select_options, {}, {class: 'select2 span2'}
18 18 .form-group
19 19 .file-editor
20 20 = f.label :file_name, "File"
... ...
app/views/projects/team_members/_form.html.haml
  Diff comments   View file @8a17961
... ... @@ -17,7 +17,7 @@
17 17 %p 2. Set access level for them
18 18 .form-group
19 19 = f.label :project_access, "Project Access", class: 'control-label'
20   - .col-sm-10= select_tag :project_access, options_for_select(Gitlab::Access.options, @user_project_relation.project_access), class: "project-access-select chosen"
  20 + .col-sm-10= select_tag :project_access, options_for_select(Gitlab::Access.options, @user_project_relation.project_access), class: "project-access-select select2"
21 21  
22 22 .form-actions
23 23 = f.submit 'Add users', class: "btn btn-create"
... ...
app/views/projects/team_members/import.html.haml
  Diff comments   View file @8a17961
... ... @@ -6,7 +6,7 @@
6 6 = form_tag apply_import_project_team_members_path(@project), method: 'post', class: 'form-horizontal' do
7 7 .form-group
8 8 = label_tag :source_project_id, "Project", class: 'control-label'
9   - .col-sm-10= select_tag(:source_project_id, options_from_collection_for_select(current_user.authorized_projects, :id, :name_with_namespace), prompt: "Select project", class: "chosen lg", required: true)
  9 + .col-sm-10= select_tag(:source_project_id, options_from_collection_for_select(current_user.authorized_projects, :id, :name_with_namespace), prompt: "Select project", class: "select2 lg", required: true)
10 10  
11 11 .form-actions
12 12 = submit_tag 'Import project members', class: "btn btn-create"
... ...
app/views/shared/_ref_switcher.html.haml
  Diff comments   View file @8a17961
1 1 = form_tag switch_project_refs_path(@project), method: :get, class: "project-refs-form" do
2   - = select_tag "ref", grouped_options_refs, class: "project-refs-select chosen chosen-sm"
  2 + = select_tag "ref", grouped_options_refs, class: "project-refs-select select2 select2-sm"
3 3 = hidden_field_tag :destination, destination
4 4 - if defined?(path)
5 5 = hidden_field_tag :path, path
... ...