Skip to content

Commit 3dc6210

Browse files
committed
Simplify view template by moving logics to JS
Refs. #3017
1 parent 68f82df commit 3dc6210

5 files changed

Lines changed: 62 additions & 113 deletions

File tree

app/assets/javascripts/rails_admin/ra.sidescroll.coffee

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,12 @@
44
setFrozenColPositions = ->
55
$listForm = $('#bulk_form')
66
return unless $listForm.is('.ra-sidescroll')
7+
frozenColumns = $listForm.data('ra-sidescroll')
78
$listForm.find('table tr').each (index, tr) ->
89
firstPosition = 0
9-
$(tr).find('.ra-sidescroll-frozen').each (idx, td) ->
10+
$(tr).children().slice(0, frozenColumns).each (idx, td) ->
11+
$(td).addClass('ra-sidescroll-frozen')
12+
$(td).addClass('last-of-frozen') if idx == frozenColumns - 1
1013
tdLeft = $(td).position().left
1114
firstPosition = tdLeft if idx == 0
1215
td.style.left = "#{tdLeft - firstPosition}px"
Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
.ra-sidescroll-table {
1+
.ra-sidescroll {
22
margin-bottom: 20px;
33
overflow-x: auto;
44
.table {
@@ -7,6 +7,12 @@
77

88
.ra-sidescroll-frozen {
99
position: sticky;
10+
11+
// border-right isn't sticky
12+
&.last-of-frozen {
13+
box-shadow: -1px 0 0 0 $table-border-color inset;
14+
padding-right: $table-condensed-cell-padding + 1px;
15+
}
1016
}
1117

1218
// Remove transparency on frozen cells.
@@ -20,10 +26,4 @@
2026
background-color: $table-bg-header-sort;
2127
}
2228
}
23-
24-
// border-right isn't sticky
25-
.ra-sidescroll-frozen-last {
26-
box-shadow: -1px 0 0 0 $table-border-color inset;
27-
padding-right: $table-condensed-cell-padding + 1px;
28-
}
2929
}

app/views/rails_admin/main/index.html.haml

Lines changed: 39 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,7 @@
1212
properties = @model_config.list.with(controller: self.controller, view: self, object: @abstract_model.model.new).visible_fields
1313
checkboxes = @model_config.list.checkboxes?
1414
# columns paginate
15-
horiz_scroll = @model_config.list.horizontal_scroll_list_calc
16-
unless horiz_scroll[:enabled]
15+
unless (frozen_columns = @model_config.list.sidescroll_frozen_columns)
1716
sets = get_column_sets(properties)
1817
properties = sets[params[:set].to_i] || []
1918
other_left = ((params[:set].to_i - 1) >= 0) && sets[params[:set].to_i - 1].present?
@@ -71,54 +70,50 @@
7170
%li{class: "#{'active' if scope.to_s == params[:scope] || (params[:scope].blank? && index == 0)}"}
7271
%a{href: index_path(params.merge(scope: scope, page: nil)), class: 'pjax'}= I18n.t("admin.scopes.#{@abstract_model.to_param}.#{scope}", default: I18n.t("admin.scopes.#{scope}", default: scope.to_s.titleize))
7372

74-
= form_tag bulk_action_path(model_name: @abstract_model.to_param), method: :post, id: "bulk_form", class: ["form", horiz_scroll[:num_frozen_columns] > 0 ? "ra-sidescroll" : nil].compact.join(' ') do
73+
= form_tag bulk_action_path(model_name: @abstract_model.to_param), method: :post, id: "bulk_form", class: ["form", frozen_columns ? 'ra-sidescroll' : nil], data: (frozen_columns ? {ra_sidescroll: frozen_columns} : {}) do
7574
= hidden_field_tag :bulk_action
7675
- if description.present?
7776
%p
7877
%strong= description
7978

80-
.table-wrapper{class: horiz_scroll[:enabled] && 'ra-sidescroll-table'}
81-
%table.table.table-condensed.table-striped
82-
%thead
83-
%tr
84-
- horiz_scroll_i = horiz_scroll[:num_frozen_columns]
79+
%table.table.table-condensed.table-striped
80+
%thead
81+
%tr
82+
- if checkboxes
83+
%th.shrink
84+
%input.toggle{type: "checkbox"}
85+
- if frozen_columns
86+
%th.last.shrink
87+
- if other_left
88+
%th.other.left.shrink= "..."
89+
- properties.each do |property|
90+
- selected = (sort == property.name.to_s)
91+
- if property.sortable
92+
- sort_location = index_path params.except('sort_reverse').except('page').merge(sort: property.name).merge(selected && sort_reverse != "true" ? {sort_reverse: "true"} : {})
93+
- sort_direction = (sort_reverse == 'true' ? "headerSortUp" : "headerSortDown" if selected)
94+
%th{class: "#{property.sortable && "header pjax" || nil} #{sort_direction if property.sortable && sort_direction} #{property.css_class} #{property.type_css_class}", :'data-href' => (property.sortable && sort_location), rel: "tooltip", title: "#{property.hint}"}= capitalize_first_letter(property.label)
95+
- if other_right
96+
%th.other.right.shrink= "..."
97+
- unless frozen_columns
98+
%th.last.shrink
99+
%tbody
100+
- @objects.each do |object|
101+
%tr{class: "#{@abstract_model.param_key}_row #{@model_config.list.with(object: object).row_css_class}"}
85102
- if checkboxes
86-
%th.shrink{class: [(horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last']}
87-
%input.toggle{type: "checkbox"}
88-
- if horiz_scroll[:enabled]
89-
%th.last.shrink{class: [(horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last']}
90-
- elsif other_left
91-
%th.other.left.shrink= "..."
92-
- properties.each do |property|
93-
- selected = (sort == property.name.to_s)
94-
- if property.sortable
95-
- sort_location = index_path params.except('sort_reverse').except('page').merge(sort: property.name).merge(selected && sort_reverse != "true" ? {sort_reverse: "true"} : {})
96-
- sort_direction = (sort_reverse == 'true' ? "headerSortUp" : "headerSortDown" if selected)
97-
%th{class: [property.sortable && "header pjax", property.sortable && sort_direction, property.css_class, property.type_css_class, (horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last'], :'data-href' => (property.sortable && sort_location), rel: "tooltip", title: "#{property.hint}"}= capitalize_first_letter(property.label)
98-
- unless horiz_scroll[:enabled]
99-
- if other_right
100-
%th.other.right.shrink= "..."
101-
%th.last.shrink
102-
%tbody
103-
- @objects.each do |object|
104-
- horiz_scroll_i = horiz_scroll[:num_frozen_columns]
105-
%tr{class: "#{@abstract_model.param_key}_row #{@model_config.list.with(object: object).row_css_class}"}
106-
- if checkboxes
107-
%td{class: [(horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last']}= check_box_tag "bulk_ids[]", object.id, false
108-
- td_links = capture do
109-
%td.last.links{class: [(horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last']}
110-
%ul.inline.list-inline= menu_for :member, @abstract_model, object, true
111-
- if horiz_scroll[:enabled]
112-
= td_links
113-
- elsif @other_left_link ||= other_left && index_path(params.except('set').merge(params[:set].to_i != 1 ? {set: (params[:set].to_i - 1)} : {}))
114-
%td.other.left= link_to "...", @other_left_link, class: 'pjax'
115-
- properties.map{ |property| property.bind(:object, object) }.each do |property|
116-
- value = property.pretty_value
117-
%td{class: [property.css_class, property.type_css_class, (horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last' ], title: strip_tags(value.to_s)}= value
118-
- unless horiz_scroll[:enabled]
119-
- if @other_right_link ||= other_right && index_path(params.merge(set: (params[:set].to_i + 1)))
120-
%td.other.right= link_to "...", @other_right_link, class: 'pjax'
121-
= td_links
103+
%td= check_box_tag "bulk_ids[]", object.id, false
104+
- if frozen_columns
105+
%td.last.links
106+
%ul.inline.list-inline= menu_for :member, @abstract_model, object, true
107+
- if @other_left_link ||= other_left && index_path(params.except('set').merge(params[:set].to_i != 1 ? {set: (params[:set].to_i - 1)} : {}))
108+
%td.other.left= link_to "...", @other_left_link, class: 'pjax'
109+
- properties.map{ |property| property.bind(:object, object) }.each do |property|
110+
- value = property.pretty_value
111+
%td{class: "#{property.css_class} #{property.type_css_class}", title: strip_tags(value.to_s)}= value
112+
- if @other_right_link ||= other_right && index_path(params.merge(set: (params[:set].to_i + 1)))
113+
%td.other.right= link_to "...", @other_right_link, class: 'pjax'
114+
- unless frozen_columns
115+
%td.last.links
116+
%ul.inline.list-inline= menu_for :member, @abstract_model, object, true
122117

123118
- if @model_config.list.limited_pagination
124119
.row

lib/rails_admin/config/sections/list.rb

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -44,24 +44,19 @@ class List < RailsAdmin::Config::Sections::Base
4444
nil
4545
end
4646

47-
def horizontal_scroll_list_calc
47+
def sidescroll_frozen_columns
4848
global_config = RailsAdmin::Config.sidescroll
4949
model_config = sidescroll
50-
enabled = model_config == false ? false : (!!model_config || !!global_config)
50+
enabled = model_config.nil? ? global_config : model_config
5151
if enabled
5252
num_frozen = model_config[:num_frozen_columns] if model_config.is_a?(Hash)
5353
unless num_frozen
5454
num_frozen = global_config[:num_frozen_columns] if global_config.is_a?(Hash)
5555
num_frozen ||= 3 # by default, freeze checkboxes, links & first property (usually primary key / id?)
5656
num_frozen -= 1 unless checkboxes? # model config should be explicit about this, only adjust if using global config
5757
end
58-
else
59-
num_frozen = 0
58+
num_frozen
6059
end
61-
{
62-
enabled: enabled,
63-
num_frozen_columns: num_frozen,
64-
}
6560
end
6661
end
6762
end

spec/integration/config/list/rails_admin_config_list_spec.rb

Lines changed: 9 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -475,7 +475,7 @@
475475
end
476476
end
477477

478-
describe 'sidescroll list option' do
478+
describe 'sidescroll' do
479479
all_team_columns = ['', '', 'Id', 'Created at', 'Updated at', 'Division', 'Name', 'Logo url', 'Team Manager', 'Ballpark', 'Mascot', 'Founded', 'Wins', 'Losses', 'Win percentage', 'Revenue', 'Color', 'Custom field', 'Main Sponsor', 'Players', 'Some Fans', 'Comments']
480480

481481
it "displays all fields on one page when true" do
@@ -487,12 +487,7 @@
487487
cols = all('th').collect(&:text)
488488
expect(cols[0..4]).to eq(all_team_columns[0..4])
489489
expect(cols).to contain_exactly(*all_team_columns)
490-
expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
491-
expect(page).to have_selector('.ra-sidescroll')
492-
expect(all('.ra-sidescroll-frozen').count).to eq(12)
493-
expect(all('th.ra-sidescroll-frozen').count).to eq(3)
494-
expect(all('td.ra-sidescroll-frozen').count).to eq(9)
495-
expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
490+
expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=3]')
496491
end
497492

498493
it "displays all fields with custom frozen columns" do
@@ -504,12 +499,7 @@
504499
cols = all('th').collect(&:text)
505500
expect(cols[0..4]).to eq(all_team_columns[0..4])
506501
expect(cols).to contain_exactly(*all_team_columns)
507-
expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
508-
expect(page).to have_selector('.ra-sidescroll')
509-
expect(all('.ra-sidescroll-frozen').count).to eq(8)
510-
expect(all('th.ra-sidescroll-frozen').count).to eq(2)
511-
expect(all('td.ra-sidescroll-frozen').count).to eq(6)
512-
expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
502+
expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=2]')
513503
end
514504

515505
it "displays all fields with no checkboxes" do
@@ -526,10 +516,7 @@
526516
cols = all('th').collect(&:text)
527517
expect(cols[0..3]).to eq(all_team_columns[1..4])
528518
expect(cols).to contain_exactly(*all_team_columns[1..-1])
529-
expect(all('.ra-sidescroll-frozen').count).to eq(8)
530-
expect(all('th.ra-sidescroll-frozen').count).to eq(2)
531-
expect(all('td.ra-sidescroll-frozen').count).to eq(6)
532-
expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
519+
expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=2]')
533520
end
534521

535522
it "displays all fields with no frozen columns" do
@@ -541,20 +528,13 @@
541528
cols = all('th').collect(&:text)
542529
expect(cols[0..4]).to eq(all_team_columns[0..4])
543530
expect(cols).to contain_exactly(*all_team_columns)
544-
expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
545-
expect(page).not_to have_selector('.ra-sidescroll')
546-
expect(all('.ra-sidescroll-frozen').count).to eq(0)
547-
expect(all('.ra-sidescroll-frozen-last').count).to eq(0)
531+
expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=0]')
548532
end
549533

550534
it "displays sets when not set" do
551535
visit index_path(model_name: 'team')
552536
expect(all('th').collect(&:text)).to eq ['', 'Id', 'Created at', 'Updated at', 'Division', 'Name', 'Logo url', '...', '']
553-
expect(page).to have_selector('.table-wrapper')
554-
expect(page).not_to have_selector('.table-wrapper.ra-sidescroll-table')
555537
expect(page).not_to have_selector('.ra-sidescroll')
556-
expect(all('.ra-sidescroll-frozen').count).to eq(0)
557-
expect(all('.ra-sidescroll-frozen-last').count).to eq(0)
558538
end
559539

560540
it "displays sets when global config is on but model config is off" do
@@ -568,11 +548,7 @@
568548
end
569549
visit index_path(model_name: 'team')
570550
expect(all('th').collect(&:text)).to eq ['', 'Id', 'Created at', 'Updated at', 'Division', 'Name', 'Logo url', '...', '']
571-
expect(page).to have_selector('.table-wrapper')
572-
expect(page).not_to have_selector('.table-wrapper.ra-sidescroll-table')
573551
expect(page).not_to have_selector('.ra-sidescroll')
574-
expect(all('.ra-sidescroll-frozen').count).to eq(0)
575-
expect(all('.ra-sidescroll-frozen-last').count).to eq(0)
576552
end
577553

578554
it "displays all fields when global config is off but model config is on" do
@@ -586,12 +562,7 @@
586562
cols = all('th').collect(&:text)
587563
expect(cols[0..4]).to eq(all_team_columns[0..4])
588564
expect(cols).to contain_exactly(*all_team_columns)
589-
expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
590-
expect(page).to have_selector('.ra-sidescroll')
591-
expect(all('.ra-sidescroll-frozen').count).to eq(12)
592-
expect(all('th.ra-sidescroll-frozen').count).to eq(3)
593-
expect(all('td.ra-sidescroll-frozen').count).to eq(9)
594-
expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
565+
expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=3]')
595566
end
596567

597568
it "displays all fields with custom model config settings" do
@@ -609,19 +580,9 @@
609580
cols = all('th').collect(&:text)
610581
expect(cols[0..4]).to eq(all_team_columns[0..4])
611582
expect(cols).to contain_exactly(*all_team_columns)
612-
expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
613-
expect(page).to have_selector('.ra-sidescroll')
614-
expect(all('.ra-sidescroll-frozen').count).to eq(8)
615-
expect(all('th.ra-sidescroll-frozen').count).to eq(2)
616-
expect(all('td.ra-sidescroll-frozen').count).to eq(6)
617-
expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
583+
expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=2]')
618584
visit index_path(model_name: 'player')
619-
expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
620-
expect(page).to have_selector('.ra-sidescroll')
621-
expect(all('.ra-sidescroll-frozen').count).to eq(12)
622-
expect(all('th.ra-sidescroll-frozen').count).to eq(3)
623-
expect(all('td.ra-sidescroll-frozen').count).to eq(9)
624-
expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
585+
expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=3]')
625586
end
626587

627588
it "displays all fields with model config checkbox settings" do
@@ -639,12 +600,7 @@
639600
cols = all('th').collect(&:text)
640601
expect(cols[0..3]).to eq(all_team_columns[1..4])
641602
expect(cols).to contain_exactly(*all_team_columns[1..-1])
642-
expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
643-
expect(page).to have_selector('.ra-sidescroll')
644-
expect(all('.ra-sidescroll-frozen').count).to eq(12)
645-
expect(all('th.ra-sidescroll-frozen').count).to eq(3)
646-
expect(all('td.ra-sidescroll-frozen').count).to eq(9)
647-
expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
603+
expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=3]')
648604
end
649605
end
650606
end

0 commit comments

Comments
 (0)