Simplify view template by moving logics to JS

Refs. #3017

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

@@ -4,9 +4,12 @@
  setFrozenColPositions = ->
  $listForm = $('#bulk_form')
  return unless $listForm.is('.ra-sidescroll')
+ frozenColumns = $listForm.data('ra-sidescroll')
  $listForm.find('table tr').each (index, tr) ->
  firstPosition = 0
- $(tr).find('.ra-sidescroll-frozen').each (idx, td) ->
+ $(tr).children().slice(0, frozenColumns).each (idx, td) ->
+ $(td).addClass('ra-sidescroll-frozen')
+ $(td).addClass('last-of-frozen') if idx == frozenColumns - 1
  tdLeft = $(td).position().left
  firstPosition = tdLeft if idx == 0
  td.style.left = "#{tdLeft - firstPosition}px"

app/assets/stylesheets/rails_admin/ra.sidescroll.scss

@@ -1,4 +1,4 @@
-.ra-sidescroll-table {
+.ra-sidescroll {
  margin-bottom: 20px;
  overflow-x: auto;
  .table {
@@ -7,6 +7,12 @@
 
  .ra-sidescroll-frozen {
  position: sticky;
+
+ // border-right isn't sticky
+ &.last-of-frozen {
+ box-shadow: -1px 0 0 0 $table-border-color inset;
+ padding-right: $table-condensed-cell-padding + 1px;
+ }
  }
 
  // Remove transparency on frozen cells.
@@ -20,10 +26,4 @@
  background-color: $table-bg-header-sort;
  }
  }
-
- // border-right isn't sticky
- .ra-sidescroll-frozen-last {
- box-shadow: -1px 0 0 0 $table-border-color inset;
- padding-right: $table-condensed-cell-padding + 1px;
- }
 }

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

@@ -12,8 +12,7 @@
  properties = @model_config.list.with(controller: self.controller, view: self, object: @abstract_model.model.new).visible_fields
  checkboxes = @model_config.list.checkboxes?
  # columns paginate
- horiz_scroll = @model_config.list.horizontal_scroll_list_calc
- unless horiz_scroll[:enabled]
+ unless (frozen_columns = @model_config.list.sidescroll_frozen_columns)
  sets = get_column_sets(properties)
  properties = sets[params[:set].to_i] || []
  other_left = ((params[:set].to_i - 1) >= 0) && sets[params[:set].to_i - 1].present?
@@ -71,54 +70,50 @@
  %li{class: "#{'active' if scope.to_s == params[:scope] || (params[:scope].blank? && index == 0)}"}
  %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))
 
- = 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
+ = 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
  = hidden_field_tag :bulk_action
  - if description.present?
  %p
  %strong= description
 
- .table-wrapper{class: horiz_scroll[:enabled] && 'ra-sidescroll-table'}
- %table.table.table-condensed.table-striped
- %thead
- %tr
- - horiz_scroll_i = horiz_scroll[:num_frozen_columns]
+ %table.table.table-condensed.table-striped
+ %thead
+ %tr
+ - if checkboxes
+ %th.shrink
+ %input.toggle{type: "checkbox"}
+ - if frozen_columns
+ %th.last.shrink
+ - if other_left
+ %th.other.left.shrink= "..."
+ - properties.each do |property|
+ - selected = (sort == property.name.to_s)
+ - if property.sortable
+ - sort_location = index_path params.except('sort_reverse').except('page').merge(sort: property.name).merge(selected && sort_reverse != "true" ? {sort_reverse: "true"} : {})
+ - sort_direction = (sort_reverse == 'true' ? "headerSortUp" : "headerSortDown" if selected)
+ %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)
+ - if other_right
+ %th.other.right.shrink= "..."
+ - unless frozen_columns
+ %th.last.shrink
+ %tbody
+ - @objects.each do |object|
+ %tr{class: "#{@abstract_model.param_key}_row #{@model_config.list.with(object: object).row_css_class}"}
  - if checkboxes
- %th.shrink{class: [(horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last']}
- %input.toggle{type: "checkbox"}
- - if horiz_scroll[:enabled]
- %th.last.shrink{class: [(horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last']}
- - elsif other_left
- %th.other.left.shrink= "..."
- - properties.each do |property|
- - selected = (sort == property.name.to_s)
- - if property.sortable
- - sort_location = index_path params.except('sort_reverse').except('page').merge(sort: property.name).merge(selected && sort_reverse != "true" ? {sort_reverse: "true"} : {})
- - sort_direction = (sort_reverse == 'true' ? "headerSortUp" : "headerSortDown" if selected)
- %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)
- - unless horiz_scroll[:enabled]
- - if other_right
- %th.other.right.shrink= "..."
- %th.last.shrink
- %tbody
- - @objects.each do |object|
- - horiz_scroll_i = horiz_scroll[:num_frozen_columns]
- %tr{class: "#{@abstract_model.param_key}_row #{@model_config.list.with(object: object).row_css_class}"}
- - if checkboxes
- %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
- - td_links = capture do
- %td.last.links{class: [(horiz_scroll_i -= 1) > -1 && 'ra-sidescroll-frozen', horiz_scroll_i == 0 && 'ra-sidescroll-frozen-last']}
- %ul.inline.list-inline= menu_for :member, @abstract_model, object, true
- - if horiz_scroll[:enabled]
- = td_links
- - elsif @other_left_link ||= other_left && index_path(params.except('set').merge(params[:set].to_i != 1 ? {set: (params[:set].to_i - 1)} : {}))
- %td.other.left= link_to "...", @other_left_link, class: 'pjax'
- - properties.map{ |property| property.bind(:object, object) }.each do |property|
- - value = property.pretty_value
- %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
- - unless horiz_scroll[:enabled]
- - if @other_right_link ||= other_right && index_path(params.merge(set: (params[:set].to_i + 1)))
- %td.other.right= link_to "...", @other_right_link, class: 'pjax'
- = td_links
+ %td= check_box_tag "bulk_ids[]", object.id, false
+ - if frozen_columns
+ %td.last.links
+ %ul.inline.list-inline= menu_for :member, @abstract_model, object, true
+ - if @other_left_link ||= other_left && index_path(params.except('set').merge(params[:set].to_i != 1 ? {set: (params[:set].to_i - 1)} : {}))
+ %td.other.left= link_to "...", @other_left_link, class: 'pjax'
+ - properties.map{ |property| property.bind(:object, object) }.each do |property|
+ - value = property.pretty_value
+ %td{class: "#{property.css_class} #{property.type_css_class}", title: strip_tags(value.to_s)}= value
+ - if @other_right_link ||= other_right && index_path(params.merge(set: (params[:set].to_i + 1)))
+ %td.other.right= link_to "...", @other_right_link, class: 'pjax'
+ - unless frozen_columns
+ %td.last.links
+ %ul.inline.list-inline= menu_for :member, @abstract_model, object, true
 
  - if @model_config.list.limited_pagination
  .row

lib/rails_admin/config/sections/list.rb

@@ -44,24 +44,19 @@ class List < RailsAdmin::Config::Sections::Base
  nil
  end
 
- def horizontal_scroll_list_calc
+ def sidescroll_frozen_columns
  global_config = RailsAdmin::Config.sidescroll
  model_config = sidescroll
- enabled = model_config == false ? false : (!!model_config || !!global_config)
+ enabled = model_config.nil? ? global_config : model_config
  if enabled
  num_frozen = model_config[:num_frozen_columns] if model_config.is_a?(Hash)
  unless num_frozen
  num_frozen = global_config[:num_frozen_columns] if global_config.is_a?(Hash)
  num_frozen ||= 3 # by default, freeze checkboxes, links & first property (usually primary key / id?)
  num_frozen -= 1 unless checkboxes? # model config should be explicit about this, only adjust if using global config
  end
- else
- num_frozen = 0
+ num_frozen
  end
- {
- enabled: enabled,
- num_frozen_columns: num_frozen,
- }
  end
  end
  end

spec/integration/config/list/rails_admin_config_list_spec.rb

@@ -475,7 +475,7 @@
  end
  end
 
- describe 'sidescroll list option' do
+ describe 'sidescroll' do
  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']
 
  it "displays all fields on one page when true" do
@@ -487,12 +487,7 @@
  cols = all('th').collect(&:text)
  expect(cols[0..4]).to eq(all_team_columns[0..4])
  expect(cols).to contain_exactly(*all_team_columns)
- expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
- expect(page).to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(12)
- expect(all('th.ra-sidescroll-frozen').count).to eq(3)
- expect(all('td.ra-sidescroll-frozen').count).to eq(9)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
+ expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=3]')
  end
 
  it "displays all fields with custom frozen columns" do
@@ -504,12 +499,7 @@
  cols = all('th').collect(&:text)
  expect(cols[0..4]).to eq(all_team_columns[0..4])
  expect(cols).to contain_exactly(*all_team_columns)
- expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
- expect(page).to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(8)
- expect(all('th.ra-sidescroll-frozen').count).to eq(2)
- expect(all('td.ra-sidescroll-frozen').count).to eq(6)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
+ expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=2]')
  end
 
  it "displays all fields with no checkboxes" do
@@ -526,10 +516,7 @@
  cols = all('th').collect(&:text)
  expect(cols[0..3]).to eq(all_team_columns[1..4])
  expect(cols).to contain_exactly(*all_team_columns[1..-1])
- expect(all('.ra-sidescroll-frozen').count).to eq(8)
- expect(all('th.ra-sidescroll-frozen').count).to eq(2)
- expect(all('td.ra-sidescroll-frozen').count).to eq(6)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
+ expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=2]')
  end
 
  it "displays all fields with no frozen columns" do
@@ -541,20 +528,13 @@
  cols = all('th').collect(&:text)
  expect(cols[0..4]).to eq(all_team_columns[0..4])
  expect(cols).to contain_exactly(*all_team_columns)
- expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
- expect(page).not_to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(0)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(0)
+ expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=0]')
  end
 
  it "displays sets when not set" do
  visit index_path(model_name: 'team')
  expect(all('th').collect(&:text)).to eq ['', 'Id', 'Created at', 'Updated at', 'Division', 'Name', 'Logo url', '...', '']
- expect(page).to have_selector('.table-wrapper')
- expect(page).not_to have_selector('.table-wrapper.ra-sidescroll-table')
  expect(page).not_to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(0)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(0)
  end
 
  it "displays sets when global config is on but model config is off" do
@@ -568,11 +548,7 @@
  end
  visit index_path(model_name: 'team')
  expect(all('th').collect(&:text)).to eq ['', 'Id', 'Created at', 'Updated at', 'Division', 'Name', 'Logo url', '...', '']
- expect(page).to have_selector('.table-wrapper')
- expect(page).not_to have_selector('.table-wrapper.ra-sidescroll-table')
  expect(page).not_to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(0)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(0)
  end
 
  it "displays all fields when global config is off but model config is on" do
@@ -586,12 +562,7 @@
  cols = all('th').collect(&:text)
  expect(cols[0..4]).to eq(all_team_columns[0..4])
  expect(cols).to contain_exactly(*all_team_columns)
- expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
- expect(page).to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(12)
- expect(all('th.ra-sidescroll-frozen').count).to eq(3)
- expect(all('td.ra-sidescroll-frozen').count).to eq(9)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
+ expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=3]')
  end
 
  it "displays all fields with custom model config settings" do
@@ -609,19 +580,9 @@
  cols = all('th').collect(&:text)
  expect(cols[0..4]).to eq(all_team_columns[0..4])
  expect(cols).to contain_exactly(*all_team_columns)
- expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
- expect(page).to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(8)
- expect(all('th.ra-sidescroll-frozen').count).to eq(2)
- expect(all('td.ra-sidescroll-frozen').count).to eq(6)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
+ expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=2]')
  visit index_path(model_name: 'player')
- expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
- expect(page).to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(12)
- expect(all('th.ra-sidescroll-frozen').count).to eq(3)
- expect(all('td.ra-sidescroll-frozen').count).to eq(9)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
+ expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=3]')
  end
 
  it "displays all fields with model config checkbox settings" do
@@ -639,12 +600,7 @@
  cols = all('th').collect(&:text)
  expect(cols[0..3]).to eq(all_team_columns[1..4])
  expect(cols).to contain_exactly(*all_team_columns[1..-1])
- expect(page).to have_selector('.table-wrapper.ra-sidescroll-table')
- expect(page).to have_selector('.ra-sidescroll')
- expect(all('.ra-sidescroll-frozen').count).to eq(12)
- expect(all('th.ra-sidescroll-frozen').count).to eq(3)
- expect(all('td.ra-sidescroll-frozen').count).to eq(9)
- expect(all('.ra-sidescroll-frozen-last').count).to eq(4)
+ expect(page).to have_selector('.ra-sidescroll[data-ra-sidescroll=3]')
  end
  end
 end