Refactoring & restyle pagination:

- remove admin kaminari theme. Use gitlab theme everywhere - use bootstrap styled for gitlab admin themes - dont reload page when change issue filter

Refactoring & restyle pagination:
- remove admin kaminari theme. Use gitlab theme everywhere - use bootstrap styled for gitlab admin themes - dont reload page when change issue filter
Dmitriy Zaporozhets
1 parent 52ad34fd
Showing 24 changed files with 63 additions and 142 deletions Show diff stats
app/assets/javascripts/issues.js
app/assets/stylesheets/gitlab_bootstrap/common.scss
app/assets/stylesheets/sections/issues.scss
app/views/admin/groups/index.html.haml
app/views/admin/projects/index.html.haml
app/views/admin/teams/index.html.haml
app/views/admin/users/index.html.haml
app/views/issues/_issues.html.haml
app/views/issues/index.html.haml
app/views/issues/index.js.haml
app/views/kaminari/admin/_first_page.html.haml
app/views/kaminari/admin/_gap.html.haml
app/views/kaminari/admin/_last_page.html.haml
app/views/kaminari/admin/_next_page.html.haml
app/views/kaminari/admin/_page.html.haml
app/views/kaminari/admin/_paginator.html.haml
app/views/kaminari/admin/_prev_page.html.haml
app/views/kaminari/gitlab/_gap.html.haml
app/views/kaminari/gitlab/_next_page.html.haml
app/views/kaminari/gitlab/_page.html.haml
@@ -12,7 +12,7 @@ function initIssuesSearch() {
  
       if (terms.length >= 2 || terms.length == 0) {
         $.get(href, { 'status': status, 'terms': terms, 'milestone_id': milestone_id }, function(response) {
-          $('#issues-table').html(response);
+          $('.issues-holder').html(response);
         });
       }
     }
@@ -69,13 +69,6 @@ fieldset legend { font-size: 17px; }
  
 /** PAGINATION **/
 .gitlab_pagination {
-  span a { color: $link_color; }
-  .prev, .next, .current, .page a {
-    padding: 10px;
-  }
-  .current {
-    border-bottom: 2px solid $style_color;
-  }
 }
  
 .tab-content {
@@ -77,7 +77,7 @@ input.check_all_issues {
 @media (min-width: 800px)  { .issues_bulk_update select { width: 120px; }  }
 @media (min-width: 1200px) { .issues_bulk_update select { width: 160px; }  }
  
-#issues-table-holder {
+.issues-holder {
   .issues_filters {
   }
  
@@ -34,4 +34,4 @@
       %td.bgred
         = link_to 'Edit', edit_admin_group_path(group), id: "edit_#{dom_id(group)}", class: "btn btn-small"
         = link_to 'Destroy', [:admin, group], confirm: "REMOVE #{group.name}? Are you sure?", method: :delete, class: "btn btn-small btn-remove"
-= paginate @groups, theme: "admin"
+= paginate @groups, theme: "gitlab"
@@ -56,6 +56,4 @@
               = link_to 'Destroy', [project], confirm: "REMOVE #{project.name}? Are you sure?", method: :delete, class: "btn btn-small btn-remove"
         - if @projects.blank?
           %p.nothing_here_message 0 projects matches
-        - else
-          %li.bottom
-            = paginate @projects, theme: "gitlab"
+    = paginate @projects, theme: "gitlab"
@@ -40,4 +40,4 @@
         = link_to 'Edit', edit_admin_team_path(team), id: "edit_#{dom_id(team)}", class: "btn btn-small"
         = link_to 'Destroy', admin_team_path(team), confirm: "REMOVE #{team.name}? Are you sure?", method: :delete, class: "btn btn-small btn-remove"
  
-= paginate @teams, theme: "admin"
+= paginate @teams, theme: "gitlab"
@@ -58,5 +58,4 @@
                 - else
                   = link_to 'Block', block_admin_user_path(user), confirm: 'USER WILL BE BLOCKED! Are you sure?', method: :put, class: "btn btn-small btn-remove"
                 = link_to 'Destroy', [:admin, user], confirm: "USER #{user.name} WILL BE REMOVED! Are you sure?", method: :delete, class: "btn btn-small btn-remove"
-        %li.bottom
-          = paginate @admin_users, theme: "gitlab"
+      = paginate @admin_users, theme: "gitlab"
-= render @issues
+.ui-box
+  .title
+    = check_box_tag "check_all_issues", nil, false, class: "check_all_issues left"
+    .clearfix
+      .issues_bulk_update.hide
+        = form_tag bulk_update_project_issues_path(@project), method: :post  do
+          %span.update_issues_text Update selected issues with &nbsp;
+          .left
+            = select_tag('update[status]', options_for_select(['open', 'closed']), prompt: "Status")
+            = select_tag('update[assignee_id]', options_from_collection_for_select(@project.users.all, "id", "name", params[:assignee_id]), prompt: "Assignee")
+            = select_tag('update[milestone_id]', options_from_collection_for_select(issues_active_milestones, "id", "title", params[:milestone_id]), prompt: "Milestone")
+            = hidden_field_tag 'update[issues_ids]', []
+            = hidden_field_tag :status, params[:status]
+          = button_tag "Save", class: "btn update_selected_issues btn-small btn-save"
+      .issues_filters
+        = form_tag project_issues_path(@project), method: :get, remote: true  do
+          = select_tag(:label_name, options_for_select(issue_tags, params[:label_name]), prompt: "Labels")
+          = select_tag(:assignee_id, options_from_collection_for_select([unassigned_filter] + @project.users.all, "id", "name", params[:assignee_id]), prompt: "Assignee")
+          = select_tag(:milestone_id, options_from_collection_for_select([unassigned_filter] + issues_active_milestones, "id", "title", params[:milestone_id]), prompt: "Milestone")
+          = hidden_field_tag :status, params[:status]
+
+  %ul.well-list.issues-list
+    = render @issues
+    - if @issues.blank?
+      %li
+        %h4.nothing_here_message Nothing to show here
  
 - if @issues.present?
-  %li.bottom
-    .left= paginate @issues, remote: true, theme: "gitlab"
-    .pull-right
-      %span.issue_counter #{@issues.total_count}
-      issues for this filter
-- else
-  %li
-    %h4.nothing_here_message Nothing to show here
+  .pull-right
+    %span.issue_counter #{@issues.total_count}
+    issues for this filter
  
+  = paginate @issues, remote: true, theme: "gitlab"
@@ -19,30 +19,8 @@
 .row
   .span3
     = render 'filter', entity: 'issue'
-  .span9
-    %div#issues-table-holder.ui-box
-      .title
-        = check_box_tag "check_all_issues", nil, false, class: "check_all_issues left"
-        .clearfix
-          .issues_bulk_update.hide
-            = form_tag bulk_update_project_issues_path(@project), method: :post  do
-              %span.update_issues_text Update selected issues with &nbsp;
-              .left
-                = select_tag('update[status]', options_for_select(['open', 'closed']), prompt: "Status")
-                = select_tag('update[assignee_id]', options_from_collection_for_select(@project.users.all, "id", "name", params[:assignee_id]), prompt: "Assignee")
-                = select_tag('update[milestone_id]', options_from_collection_for_select(issues_active_milestones, "id", "title", params[:milestone_id]), prompt: "Milestone")
-                = hidden_field_tag 'update[issues_ids]', []
-                = hidden_field_tag :status, params[:status]
-              = button_tag "Save", class: "btn update_selected_issues btn-small btn-save"
-          .issues_filters
-            = form_tag project_issues_path(@project), method: :get  do
-              = select_tag(:label_name, options_for_select(issue_tags, params[:label_name]), prompt: "Labels")
-              = select_tag(:assignee_id, options_from_collection_for_select([unassigned_filter] + @project.users.all, "id", "name", params[:assignee_id]), prompt: "Assignee")
-              = select_tag(:milestone_id, options_from_collection_for_select([unassigned_filter] + issues_active_milestones, "id", "title", params[:milestone_id]), prompt: "Milestone")
-              = hidden_field_tag :status, params[:status]
-
-      %ul#issues-table.well-list.issues-list
-        = render "issues"
+  .span9.issues-holder
+    = render "issues"
  
 :javascript
   $(function(){
 :plain
-  $('#issues-table').html("#{escape_javascript(render('issues'))}");
+  $('.issues-holder').html("#{escape_javascript(render('issues'))}");
+  History.replaceState({path: "#{request.url}"}, document.title, "#{request.url}");
+  issuesPage();
@@ -1,9 +0,0 @@
--#  Link to the "First" page
--#  available local variables
--#    url:           url to the first page
--#    current_page:  a page object for the currently displayed page
--#    num_pages:     total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%span.first
-  = link_to_unless current_page.first?, raw(t 'views.pagination.first'), url, remote: remote
@@ -1,9 +0,0 @@
--#  Non-link tag that stands for skipped pages...
--#  available local variables
--#    current_page:  a page object for the currently displayed page
--#    num_pages:     total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%li{class: "page"}
-  %span.page.gap
-    = raw(t 'views.pagination.truncate')
@@ -1,9 +0,0 @@
--#  Link to the "Last" page
--#  available local variables
--#    url:           url to the last page
--#    current_page:  a page object for the currently displayed page
--#    num_pages:     total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%span.last
-  = link_to_unless current_page.last?, raw(t 'views.pagination.last'), url, {remote: remote}
@@ -1,9 +0,0 @@
--#  Link to the "Next" page
--#  available local variables
--#    url:           url to the next page
--#    current_page:  a page object for the currently displayed page
--#    num_pages:     total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%li.next
-  = link_to_unless current_page.last?, raw(t 'views.pagination.next'), url, rel: 'next', remote: remote
@@ -1,10 +0,0 @@
--#  Link showing page number
--#  available local variables
--#    page:          a page object for "this" page
--#    url:           url to this page
--#    current_page:  a page object for the currently displayed page
--#    num_pages:     total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%li{class: "page#{' active' if page.current?}"}
-  = link_to page, url, {remote: remote, rel: page.next? ? 'next' : page.prev? ? 'prev' : nil}
@@ -1,17 +0,0 @@
--#  The container tag
--#  available local variables
--#    current_page:  a page object for the currently displayed page
--#    num_pages:     total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
--#    paginator:     the paginator that renders the pagination tags inside
-= paginator.render do
-  %div.pagination
-    %ul
-      = prev_page_tag unless current_page.first?
-      - each_page do |page|
-        - if page.left_outer? || page.right_outer? || page.inside_window?
-          = page_tag page
-        - elsif !page.was_truncated?
-          = gap_tag
-      = next_page_tag unless current_page.last?
@@ -1,9 +0,0 @@
--#  Link to the "Previous" page
--#  available local variables
--#    url:           url to the previous page
--#    current_page:  a page object for the currently displayed page
--#    num_pages:     total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%li{class: "prev" }
-  = link_to_unless current_page.first?, raw(t 'views.pagination.previous'), url, rel: 'prev', remote: remote
@@ -4,5 +4,6 @@
 -#    num_pages:     total number of pages
 -#    per_page:      number of items to fetch per page
 -#    remote:        data-remote
-%span.page.gap
-  = raw(t 'views.pagination.truncate')
+%li{class: "page"}
+  %span.page.gap
+    = raw(t 'views.pagination.truncate')
@@ -5,5 +5,5 @@
 -#    num_pages:     total number of pages
 -#    per_page:      number of items to fetch per page
 -#    remote:        data-remote
-%span.next
+%li.next
   = link_to_unless current_page.last?, raw(t 'views.pagination.next'), url, rel: 'next', remote: remote
@@ -6,5 +6,5 @@
 -#    num_pages:     total number of pages
 -#    per_page:      number of items to fetch per page
 -#    remote:        data-remote
-%span{class: "page#{' current' if page.current?}"}
-  = link_to_unless page.current?, page, url, {remote: remote, rel: page.next? ? 'next' : page.prev? ? 'prev' : nil}
+%li{class: "page#{' active' if page.current?}"}
+  = link_to page, url, {remote: remote, rel: page.next? ? 'next' : page.prev? ? 'prev' : nil}
@@ -6,11 +6,12 @@
 -#    remote:        data-remote
 -#    paginator:     the paginator that renders the pagination tags inside
 = paginator.render do
-  %nav.gitlab_pagination
-    = prev_page_tag
-    - each_page do |page|
-      - if page.left_outer? || page.right_outer? || page.inside_window?
-        = page_tag page
-      - elsif !page.was_truncated?
-        = gap_tag
-    = next_page_tag
+  %div.pagination
+    %ul
+      = prev_page_tag unless current_page.first?
+      - each_page do |page|
+        - if page.left_outer? || page.right_outer? || page.inside_window?
+          = page_tag page
+        - elsif !page.was_truncated?
+          = gap_tag
+      = next_page_tag unless current_page.last?
@@ -5,5 +5,5 @@
 -#    num_pages:     total number of pages
 -#    per_page:      number of items to fetch per page
 -#    remote:        data-remote
-%span.prev
+%li{class: "prev" }
   = link_to_unless current_page.first?, raw(t 'views.pagination.previous'), url, rel: 'prev', remote: remote
@@ -25,11 +25,11 @@
         - if @merge_requests.blank?
           %li
             %h4.nothing_here_message Nothing to show here
-        - if @merge_requests.present?
-          %li.bottom
-            .left= paginate @merge_requests, theme: "gitlab"
-            .pull-right
-              %span.cgray.pull-right #{@merge_requests.total_count} merge requests for this filter
+    - if @merge_requests.present?
+      .pull-right
+        %span.cgray.pull-right #{@merge_requests.total_count} merge requests for this filter
+
+      = paginate @merge_requests, theme: "gitlab"
  
 :javascript
   $(merge_requestsPage);
@@ -17,4 +17,4 @@
     - unless @projects.present?
       %h3.nothing_here_message No public projects
  
-  = paginate @projects, theme: "admin"
+  = paginate @projects, theme: "gitlab"
...	...	@@ -12,7 +12,7 @@ function initIssuesSearch() {
12	12
13	13	if (terms.length >= 2 \|\| terms.length == 0) {
14	14	$.get(href, { 'status': status, 'terms': terms, 'milestone_id': milestone_id }, function(response) {
15		- $('#issues-table').html(response);
	15	+ $('.issues-holder').html(response);
16	16	});
17	17	}
18	18	}
...	...
...	...	@@ -69,13 +69,6 @@ fieldset legend { font-size: 17px; }
69	69
70	70	/ PAGINATION /
71	71	.gitlab_pagination {
72		- span a { color: $link_color; }
73		- .prev, .next, .current, .page a {
74		- padding: 10px;
75		- }
76		- .current {
77		- border-bottom: 2px solid $style_color;
78		- }
79	72	}
80	73
81	74	.tab-content {
...	...
...	...	@@ -77,7 +77,7 @@ input.check_all_issues {
77	77	@media (min-width: 800px) { .issues_bulk_update select { width: 120px; } }
78	78	@media (min-width: 1200px) { .issues_bulk_update select { width: 160px; } }
79	79
80		-#issues-table-holder {
	80	+.issues-holder {
81	81	.issues_filters {
82	82	}
83	83
...	...
...	...	@@ -34,4 +34,4 @@
34	34	%td.bgred
35	35	= link_to 'Edit', edit_admin_group_path(group), id: "edit_#{dom_id(group)}", class: "btn btn-small"
36	36	= link_to 'Destroy', [:admin, group], confirm: "REMOVE #{group.name}? Are you sure?", method: :delete, class: "btn btn-small btn-remove"
37		-= paginate @groups, theme: "admin"
	37	+= paginate @groups, theme: "gitlab"
...	...
...	...	@@ -56,6 +56,4 @@
56	56	= link_to 'Destroy', [project], confirm: "REMOVE #{project.name}? Are you sure?", method: :delete, class: "btn btn-small btn-remove"
57	57	- if @projects.blank?
58	58	%p.nothing_here_message 0 projects matches
59		- - else
60		- %li.bottom
61		- = paginate @projects, theme: "gitlab"
	59	+ = paginate @projects, theme: "gitlab"
...	...
...	...	@@ -40,4 +40,4 @@
40	40	= link_to 'Edit', edit_admin_team_path(team), id: "edit_#{dom_id(team)}", class: "btn btn-small"
41	41	= link_to 'Destroy', admin_team_path(team), confirm: "REMOVE #{team.name}? Are you sure?", method: :delete, class: "btn btn-small btn-remove"
42	42
43		-= paginate @teams, theme: "admin"
	43	+= paginate @teams, theme: "gitlab"
...	...
...	...	@@ -58,5 +58,4 @@
58	58	- else
59	59	= link_to 'Block', block_admin_user_path(user), confirm: 'USER WILL BE BLOCKED! Are you sure?', method: :put, class: "btn btn-small btn-remove"
60	60	= link_to 'Destroy', [:admin, user], confirm: "USER #{user.name} WILL BE REMOVED! Are you sure?", method: :delete, class: "btn btn-small btn-remove"
61		- %li.bottom
62		- = paginate @admin_users, theme: "gitlab"
	61	+ = paginate @admin_users, theme: "gitlab"
...	...
1		-= render @issues
	1	+.ui-box
	2	+ .title
	3	+ = check_box_tag "check_all_issues", nil, false, class: "check_all_issues left"
	4	+ .clearfix
	5	+ .issues_bulk_update.hide
	6	+ = form_tag bulk_update_project_issues_path(@project), method: :post do
	7	+ %span.update_issues_text Update selected issues with
	8	+ .left
	9	+ = select_tag('update[status]', options_for_select(['open', 'closed']), prompt: "Status")
	10	+ = select_tag('update[assignee_id]', options_from_collection_for_select(@project.users.all, "id", "name", params[:assignee_id]), prompt: "Assignee")
	11	+ = select_tag('update[milestone_id]', options_from_collection_for_select(issues_active_milestones, "id", "title", params[:milestone_id]), prompt: "Milestone")
	12	+ = hidden_field_tag 'update[issues_ids]', []
	13	+ = hidden_field_tag :status, params[:status]
	14	+ = button_tag "Save", class: "btn update_selected_issues btn-small btn-save"
	15	+ .issues_filters
	16	+ = form_tag project_issues_path(@project), method: :get, remote: true do
	17	+ = select_tag(:label_name, options_for_select(issue_tags, params[:label_name]), prompt: "Labels")
	18	+ = select_tag(:assignee_id, options_from_collection_for_select([unassigned_filter] + @project.users.all, "id", "name", params[:assignee_id]), prompt: "Assignee")
	19	+ = select_tag(:milestone_id, options_from_collection_for_select([unassigned_filter] + issues_active_milestones, "id", "title", params[:milestone_id]), prompt: "Milestone")
	20	+ = hidden_field_tag :status, params[:status]
	21	+
	22	+ %ul.well-list.issues-list
	23	+ = render @issues
	24	+ - if @issues.blank?
	25	+ %li
	26	+ %h4.nothing_here_message Nothing to show here
2	27
3	28	- if @issues.present?
4		- %li.bottom
5		- .left= paginate @issues, remote: true, theme: "gitlab"
6		- .pull-right
7		- %span.issue_counter #{@issues.total_count}
8		- issues for this filter
9		-- else
10		- %li
11		- %h4.nothing_here_message Nothing to show here
	29	+ .pull-right
	30	+ %span.issue_counter #{@issues.total_count}
	31	+ issues for this filter
12	32
	33	+ = paginate @issues, remote: true, theme: "gitlab"
...	...
...	...	@@ -19,30 +19,8 @@
19	19	.row
20	20	.span3
21	21	= render 'filter', entity: 'issue'
22		- .span9
23		- %div#issues-table-holder.ui-box
24		- .title
25		- = check_box_tag "check_all_issues", nil, false, class: "check_all_issues left"
26		- .clearfix
27		- .issues_bulk_update.hide
28		- = form_tag bulk_update_project_issues_path(@project), method: :post do
29		- %span.update_issues_text Update selected issues with
30		- .left
31		- = select_tag('update[status]', options_for_select(['open', 'closed']), prompt: "Status")
32		- = select_tag('update[assignee_id]', options_from_collection_for_select(@project.users.all, "id", "name", params[:assignee_id]), prompt: "Assignee")
33		- = select_tag('update[milestone_id]', options_from_collection_for_select(issues_active_milestones, "id", "title", params[:milestone_id]), prompt: "Milestone")
34		- = hidden_field_tag 'update[issues_ids]', []
35		- = hidden_field_tag :status, params[:status]
36		- = button_tag "Save", class: "btn update_selected_issues btn-small btn-save"
37		- .issues_filters
38		- = form_tag project_issues_path(@project), method: :get do
39		- = select_tag(:label_name, options_for_select(issue_tags, params[:label_name]), prompt: "Labels")
40		- = select_tag(:assignee_id, options_from_collection_for_select([unassigned_filter] + @project.users.all, "id", "name", params[:assignee_id]), prompt: "Assignee")
41		- = select_tag(:milestone_id, options_from_collection_for_select([unassigned_filter] + issues_active_milestones, "id", "title", params[:milestone_id]), prompt: "Milestone")
42		- = hidden_field_tag :status, params[:status]
43		-
44		- %ul#issues-table.well-list.issues-list
45		- = render "issues"
	22	+ .span9.issues-holder
	23	+ = render "issues"
46	24
47	25	:javascript
48	26	$(function(){
...	...
1	1	:plain
2		- $('#issues-table').html("#{escape_javascript(render('issues'))}");
	2	+ $('.issues-holder').html("#{escape_javascript(render('issues'))}");
	3	+ History.replaceState({path: "#{request.url}"}, document.title, "#{request.url}");
	4	+ issuesPage();
...	...