ui_bibz 2.0.0.alpha24 → 2.0.0.alpha26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CONTRIBUTORS.md +19 -0
- data/Gemfile +1 -0
- data/Gemfile.lock +60 -55
- data/app/assets/javascripts/interface.coffee +11 -0
- data/app/assets/javascripts/ui_bibz.coffee +3 -1
- data/app/assets/stylesheets/table.sass +1 -2
- data/app/assets/stylesheets/ui_bibz.sass +2 -0
- data/app/inputs/custom_inputs/autocomplete_input.rb +3 -2
- data/app/inputs/custom_inputs/date_picker_input.rb +2 -2
- data/app/inputs/custom_inputs/dropdown_select_input.rb +2 -2
- data/app/inputs/custom_inputs/formula_input.rb +2 -2
- data/app/inputs/custom_inputs/markdown_editor_input.rb +2 -2
- data/app/inputs/custom_inputs/multi_column_input.rb +2 -2
- data/app/inputs/custom_inputs/multi_select_input.rb +2 -2
- data/app/inputs/custom_inputs/radios_input.rb +20 -0
- data/app/inputs/custom_inputs/surround_input.rb +2 -2
- data/app/inputs/custom_inputs/switch_input.rb +2 -2
- data/config/initializers/will_paginate.rb +79 -0
- data/lib/ui_bibz.rb +56 -30
- data/lib/ui_bibz/helpers/ui_core_helper.rb +45 -37
- data/lib/ui_bibz/ui/core/alert.rb +1 -2
- data/lib/ui_bibz/ui/core/{breadcrumb/breadcrumb.rb → breadcrumb.rb} +5 -5
- data/lib/ui_bibz/ui/core/cards/card.rb +6 -6
- data/lib/ui_bibz/ui/core/cards/components/block/card_block_link.rb +1 -1
- data/lib/ui_bibz/ui/core/cards/components/block/card_block_text.rb +1 -1
- data/lib/ui_bibz/ui/core/cards/components/block/card_block_title.rb +1 -1
- data/lib/ui_bibz/ui/core/cards/components/card_block.rb +4 -4
- data/lib/ui_bibz/ui/core/cards/components/card_footer.rb +1 -1
- data/lib/ui_bibz/ui/core/cards/components/card_header.rb +1 -1
- data/lib/ui_bibz/ui/core/cards/components/card_image.rb +1 -1
- data/lib/ui_bibz/ui/core/cards/components/card_list_group.rb +2 -2
- data/lib/ui_bibz/ui/core/component.rb +4 -51
- data/lib/ui_bibz/ui/core/component/glyph_extension.rb +19 -0
- data/lib/ui_bibz/ui/core/component/klass_extension.rb +38 -0
- data/lib/ui_bibz/ui/core/{dropdown → dropdowns}/components/dropdown_divider.rb +1 -1
- data/lib/ui_bibz/ui/core/{dropdown → dropdowns}/components/dropdown_header.rb +2 -2
- data/lib/ui_bibz/ui/core/{dropdown → dropdowns}/components/dropdown_link.rb +2 -2
- data/lib/ui_bibz/ui/core/{dropdown → dropdowns}/dropdown.rb +11 -12
- data/lib/ui_bibz/ui/core/{buttons/button_split_dropdown.rb → dropdowns/split_dropdown.rb} +6 -10
- data/lib/ui_bibz/ui/core/{buttons → forms/buttons}/button.rb +5 -5
- data/lib/ui_bibz/ui/core/{buttons → forms/buttons}/button_choice.rb +8 -8
- data/lib/ui_bibz/ui/core/{buttons → forms/buttons}/button_group.rb +5 -5
- data/lib/ui_bibz/ui/core/{buttons → forms/buttons}/button_link.rb +13 -9
- data/lib/ui_bibz/ui/core/forms/choices/checkbox_field.rb +98 -0
- data/lib/ui_bibz/ui/core/forms/choices/radio_field.rb +98 -0
- data/lib/ui_bibz/ui/core/{inputs → forms/choices}/switch_field.rb +3 -3
- data/lib/ui_bibz/ui/core/{inputs → forms/dates}/date_picker_field.rb +6 -6
- data/lib/ui_bibz/ui/core/{inputs → forms/numbers}/formula_field.rb +5 -5
- data/lib/ui_bibz/ui/core/{inputs → forms/selects}/dropdown_select_field.rb +5 -5
- data/lib/ui_bibz/ui/core/{inputs → forms/selects}/multi_column_field.rb +5 -5
- data/lib/ui_bibz/ui/core/{inputs → forms/selects}/multi_select_field.rb +8 -8
- data/lib/ui_bibz/ui/core/{inputs → forms/textareas}/markdown_editor_field.rb +5 -5
- data/lib/ui_bibz/ui/core/{inputs → forms/texts}/autocomplete_field.rb +5 -5
- data/lib/ui_bibz/ui/core/{inputs → forms/texts}/surround_field.rb +5 -5
- data/lib/ui_bibz/ui/core/glyph.rb +2 -1
- data/lib/ui_bibz/ui/core/{list → lists}/components/list.rb +11 -11
- data/lib/ui_bibz/ui/core/{list/components → lists/components/list}/list_body.rb +2 -2
- data/lib/ui_bibz/ui/core/{list/components → lists/components/list}/list_header.rb +2 -2
- data/lib/ui_bibz/ui/core/{list → lists}/list_group.rb +4 -4
- data/lib/ui_bibz/ui/core/navs/components/nav_dropdown.rb +1 -1
- data/lib/ui_bibz/ui/core/navs/components/navbar_form.rb +3 -1
- data/lib/ui_bibz/ui/core/paths/breadcrumb.rb +109 -0
- data/lib/ui_bibz/ui/core/{breadcrumb → paths}/components/breadcrumb_link.rb +6 -6
- data/lib/ui_bibz/ui/core/{stars.rb → star.rb} +14 -14
- data/lib/ui_bibz/ui/core/tag.rb +1 -2
- data/lib/ui_bibz/ui/core/{modal → windows}/components/modal_body.rb +2 -2
- data/lib/ui_bibz/ui/core/{modal → windows}/components/modal_footer.rb +2 -2
- data/lib/ui_bibz/ui/core/{modal → windows}/components/modal_header.rb +2 -2
- data/lib/ui_bibz/ui/core/{modal → windows}/modal.rb +8 -8
- data/lib/ui_bibz/ui/ux/tables/components/actions.rb +9 -9
- data/lib/ui_bibz/ui/ux/tables/extensions/actionable.rb +1 -1
- data/lib/ui_bibz/ui/ux/tables/table_pagination.rb +5 -4
- data/lib/ui_bibz/version.rb +1 -1
- data/test/dummy/app/controllers/users_controller.rb +18 -0
- data/test/dummy/app/models/user.rb +1 -0
- data/test/dummy/config/application.rb +1 -1
- data/test/dummy/config/initializers/simple_form_bootstrap.rb +155 -0
- data/test/simple_form_test.rb +123 -0
- data/test/test_helper.rb +2 -2
- data/test/ui/breadcrumb_test.rb +2 -2
- data/test/ui/button_test.rb +13 -39
- data/test/ui/dropdown_test.rb +14 -1
- data/test/ui/glyph_test.rb +6 -0
- data/test/ui/input_dropdown_select_field_test.rb +9 -9
- data/test/ui/input_switch_field_test.rb +11 -11
- data/test/ui/inputs_test.rb +26 -12
- data/test/ui/list_group_test.rb +2 -2
- data/test/ui/{stars_test.rb → star_test.rb} +7 -7
- data/test/ui/table_test.rb +3 -3
- data/test/ui_helper_test.rb +6 -1
- data/ui_bibz.gemspec +4 -3
- data/vendor/assets/stylesheets/awesome-bootstrap-checkbox.scss +250 -0
- metadata +65 -39
- data/lib/ui_bibz/helpers/pagination_helper.rb +0 -55
- data/lib/ui_bibz/ui/core/buttons/button_dropdown.rb +0 -82
data/test/ui/inputs_test.rb
CHANGED
@@ -4,14 +4,14 @@ include UiBibz::Helpers
|
|
4
4
|
class InputsTest < ActionView::TestCase
|
5
5
|
|
6
6
|
test "Date Picker Field" do
|
7
|
-
actual = UiBibz::Ui::Core::
|
7
|
+
actual = UiBibz::Ui::Core::Forms::Dates::DatePickerField.new(['date_1', 'date_2'], { append: 'a', prepend: 'b', range: 'u' }, { class: 'datepicker-test' }).render
|
8
8
|
expected = "<div class=\"input-group input-daterange\"><span class=\"input-group-addon\">a</span><input type=\"text\" name=\"date_1\" id=\"date_1\" class=\"datepicker-test date_picker form-control\" data-date-locale=\"en\" data-provide=\"datepicker\" data-date-format=\"dd/mm/yyyy\" data-date-today-btn=\"linked\" /><span class=\"input-group-addon input-group-range\">u</span><input type=\"text\" name=\"date_2\" id=\"date_2\" class=\"datepicker-test date_picker form-control\" data-date-locale=\"en\" data-provide=\"datepicker\" data-date-format=\"dd/mm/yyyy\" data-date-today-btn=\"linked\" /><span class=\"input-group-addon\">b</span></div>"
|
9
9
|
|
10
10
|
assert_equal expected, actual
|
11
11
|
end
|
12
12
|
|
13
13
|
test "Date Picker Field data html options" do
|
14
|
-
actual = UiBibz::Ui::Core::
|
14
|
+
actual = UiBibz::Ui::Core::Forms::Dates::DatePickerField.new('date', { today_highlight: true, calendar_weeks: true, autoclose: true, dates_disabled: ["11/01/2016", "12/01/2016"] }, { class: 'datepicker-test' }).render
|
15
15
|
expected = "<input type=\"text\" name=\"date\" id=\"date\" class=\"datepicker-test date_picker form-control\" data-date-locale=\"en\" data-provide=\"datepicker\" data-date-format=\"dd/mm/yyyy\" data-date-today-btn=\"linked\" data-date-today-highlight=\"true\" data-date-calendar-weeks=\"true\" data-date-autoclose=\"true\" data-dates-disabled=\"["11/01/2016","12/01/2016"]\" />"
|
16
16
|
|
17
17
|
assert_equal expected, actual
|
@@ -19,7 +19,7 @@ class InputsTest < ActionView::TestCase
|
|
19
19
|
|
20
20
|
test "Multi Column Field" do
|
21
21
|
options = options_for_select(2.times.map{ |i| "option #{i}" })
|
22
|
-
actual = UiBibz::Ui::Core::
|
22
|
+
actual = UiBibz::Ui::Core::Forms::Selects::MultiColumnField.new('example', option_tags: options).render
|
23
23
|
expected = "<select name=\"example[]\" id=\"example\" class=\"multi-column\" multiple=\"multiple\"><option value=\"option 0\">option 0</option>
|
24
24
|
<option value=\"option 1\">option 1</option></select>"
|
25
25
|
|
@@ -28,7 +28,7 @@ class InputsTest < ActionView::TestCase
|
|
28
28
|
|
29
29
|
test "Multi Column Field data html options" do
|
30
30
|
grouped_options = { 'North America' => [['United statuss','US'], 'Canada'], 'Europe' => ['Denmark','Germany','France'] }
|
31
|
-
actual = UiBibz::Ui::Core::
|
31
|
+
actual = UiBibz::Ui::Core::Forms::Selects::MultiColumnField.new('example', { option_tags: grouped_options_for_select(grouped_options), searchable: true, selectable_opt_group: true }).render
|
32
32
|
expected = "<select name=\"example[]\" id=\"example\" data-searchable=\"true\" data-selectable-optgroup=\"true\" class=\"multi-column\" multiple=\"multiple\"><optgroup label=\"North America\"><option value=\"US\">United statuss</option>
|
33
33
|
<option value=\"Canada\">Canada</option></optgroup><optgroup label=\"Europe\"><option value=\"Denmark\">Denmark</option>
|
34
34
|
<option value=\"Germany\">Germany</option>
|
@@ -39,7 +39,7 @@ class InputsTest < ActionView::TestCase
|
|
39
39
|
|
40
40
|
test "Multi Select Field" do
|
41
41
|
options = options_for_select(2.times.map{ |i| "option #{i}" })
|
42
|
-
actual = UiBibz::Ui::Core::
|
42
|
+
actual = UiBibz::Ui::Core::Forms::Selects::MultiSelectField.new('example', option_tags: options).render
|
43
43
|
expected = "<select name=\"example[]\" id=\"example\" class=\"btn-secondary btn multi-select\" multiple=\"multiple\"><option value=\"option 0\">option 0</option>
|
44
44
|
<option value=\"option 1\">option 1</option></select>"
|
45
45
|
|
@@ -48,7 +48,7 @@ class InputsTest < ActionView::TestCase
|
|
48
48
|
|
49
49
|
test "Multi Select Field data html options" do
|
50
50
|
grouped_options = { 'North America' => [['United statuss','US'], 'Canada'], 'Europe' => ['Denmark','Germany','France'] }
|
51
|
-
actual = UiBibz::Ui::Core::
|
51
|
+
actual = UiBibz::Ui::Core::Forms::Selects::MultiSelectField.new('example', { option_tags: grouped_options_for_select(grouped_options), clickable_opt_group: true, collapsible_opt_group: true, searchable: true, select_all_option: true, status: :danger }).render
|
52
52
|
expected = "<select name=\"example[]\" id=\"example\" data-enable-clickable-opt-groups=\"true\" data-enable-collapsible-opt-groups=\"true\" data-enable-filtering=\"true\" data-include-select-all-option=\"true\" class=\"btn-danger btn multi-select\" multiple=\"multiple\"><optgroup label=\"North America\"><option value=\"US\">United statuss</option>
|
53
53
|
<option value=\"Canada\">Canada</option></optgroup><optgroup label=\"Europe\"><option value=\"Denmark\">Denmark</option>
|
54
54
|
<option value=\"Germany\">Germany</option>
|
@@ -58,21 +58,21 @@ class InputsTest < ActionView::TestCase
|
|
58
58
|
end
|
59
59
|
|
60
60
|
test 'surround_field without prepend and append' do
|
61
|
-
actual = UiBibz::Ui::Core::
|
61
|
+
actual = UiBibz::Ui::Core::Forms::Texts::SurroundField.new('test').render
|
62
62
|
expected = "<input type=\"text\" name=\"test\" id=\"test\" class=\"form-control\" />"
|
63
63
|
|
64
64
|
assert_equal expected, actual
|
65
65
|
end
|
66
66
|
|
67
67
|
test 'surround_field with prepend and append' do
|
68
|
-
actual = UiBibz::Ui::Core::
|
68
|
+
actual = UiBibz::Ui::Core::Forms::Texts::SurroundField.new('test', append: '1', prepend: '2').render
|
69
69
|
expected = "<div class=\"input-group\"><span class=\"input-group-addon\">1</span><input type=\"text\" name=\"test\" id=\"test\" class=\"form-control\" /><span class=\"input-group-addon\">2</span></div>"
|
70
70
|
|
71
71
|
assert_equal expected, actual
|
72
72
|
end
|
73
73
|
|
74
74
|
test 'surround_field size' do
|
75
|
-
actual = UiBibz::Ui::Core::
|
75
|
+
actual = UiBibz::Ui::Core::Forms::Texts::SurroundField.new('test', size: :xs, append: '1', prepend: '2').render
|
76
76
|
expected = "<div class=\"input-group input-group-xs\"><span class=\"input-group-addon\">1</span><input type=\"text\" name=\"test\" id=\"test\" class=\"form-control\" /><span class=\"input-group-addon\">2</span></div>"
|
77
77
|
|
78
78
|
assert_equal expected, actual
|
@@ -80,7 +80,7 @@ class InputsTest < ActionView::TestCase
|
|
80
80
|
|
81
81
|
test 'autocomplete_field' do
|
82
82
|
options = options_for_select(2.times.map{ |i| "option #{i}" })
|
83
|
-
actual = UiBibz::Ui::Core::
|
83
|
+
actual = UiBibz::Ui::Core::Forms::Texts::AutocompleteField.new('test', { option_tags: options }, { id: 'test' }).render
|
84
84
|
expected = "<input type=\"text\" name=\"test\" id=\"test\" class=\"form-control\" autocomplete=\"true\" list=\"test-datalist\" /><datalist id=\"test-datalist\"><option value=\"option 0\">option 0</option>
|
85
85
|
<option value=\"option 1\">option 1</option></datalist>"
|
86
86
|
|
@@ -88,17 +88,31 @@ class InputsTest < ActionView::TestCase
|
|
88
88
|
end
|
89
89
|
|
90
90
|
test 'formula_field' do
|
91
|
-
actual = UiBibz::Ui::Core::
|
91
|
+
actual = UiBibz::Ui::Core::Forms::Numbers::FormulaField.new('value').render
|
92
92
|
expected = "<div class=\"input-group formula_field\"><input type=\"text\" name=\"value_formula\" id=\"value_formula\" value=\"\" class=\"formula_field_input form-control\" /><span class=\"formula_field_sign input-group-addon\">=</span><input type=\"text\" name=\"value\" id=\"value\" readonly=\"readonly\" class=\"formula_field_result form-control\" /><span class=\"formula_field_alert input-group-addon\" data-toggle=\"tooltip\"><i class=\"glyph-danger glyph fa fa-exclamation-triangle\"></i></span></div>"
|
93
93
|
|
94
94
|
assert_equal expected, actual
|
95
95
|
end
|
96
96
|
|
97
97
|
test 'markdown_editor' do
|
98
|
-
actual = UiBibz::Ui::Core::
|
98
|
+
actual = UiBibz::Ui::Core::Forms::Textareas::MarkdownEditorField.new('comments').render
|
99
99
|
expected = "<textarea name=\"comments\" id=\"comments\" data-provide=\"markdown\" data-iconlibrary=\"fa\">
|
100
100
|
</textarea>"
|
101
101
|
|
102
102
|
assert_equal expected, actual
|
103
103
|
end
|
104
|
+
|
105
|
+
test 'checkbox_field' do
|
106
|
+
actual = UiBibz::Ui::Core::Forms::Choices::CheckboxField.new('John', { value: 1, status: :primary, type: :circle }).render
|
107
|
+
expected = "<div class=\"abc-checkbox-primary checkbox abc-checkbox abc-checkbox-circle\"><input type=\"checkbox\" name=\"John\" id=\"John\" value=\"1\" class=\"styled\" /><label for=\"John\">John</label></div>"
|
108
|
+
|
109
|
+
assert_equal expected, actual
|
110
|
+
end
|
111
|
+
|
112
|
+
test 'radio_field' do
|
113
|
+
actual = UiBibz::Ui::Core::Forms::Choices::RadioField.new('John', { value: 1, status: :primary, type: :square }).render
|
114
|
+
expected = "<div class=\"abc-checkbox-primary checkbox abc-checkbox\"><input type=\"radio\" name=\"John\" id=\"John_1\" value=\"1\" /><label for=\"John_1\">John</label></div>"
|
115
|
+
|
116
|
+
assert_equal expected, actual
|
117
|
+
end
|
104
118
|
end
|
data/test/ui/list_group_test.rb
CHANGED
@@ -3,7 +3,7 @@ include UiBibz::Helpers
|
|
3
3
|
class ListGroupTest < ActionView::TestCase
|
4
4
|
|
5
5
|
test 'list_group with link' do
|
6
|
-
actual = UiBibz::Ui::Core::ListGroup.new(type: :link).tap do |lg|
|
6
|
+
actual = UiBibz::Ui::Core::Lists::ListGroup.new(type: :link).tap do |lg|
|
7
7
|
lg.list 'Momo', { status: :success, url: '#momo' }
|
8
8
|
lg.list({ tap: true, active: true, url: '#state' }) do |l|
|
9
9
|
l.header 'My title'
|
@@ -16,7 +16,7 @@ class ListGroupTest < ActionView::TestCase
|
|
16
16
|
end
|
17
17
|
|
18
18
|
test 'list_group' do
|
19
|
-
actual = UiBibz::Ui::Core::ListGroup.new().tap do |lg|
|
19
|
+
actual = UiBibz::Ui::Core::Lists::ListGroup.new().tap do |lg|
|
20
20
|
lg.list 'Lulu'
|
21
21
|
lg.list 'state'
|
22
22
|
end.render
|
@@ -1,40 +1,40 @@
|
|
1
1
|
require 'test_helper'
|
2
2
|
|
3
3
|
include UiBibz::Helpers
|
4
|
-
class
|
4
|
+
class StarTest < ActionView::TestCase
|
5
5
|
|
6
6
|
test "stars with 1" do
|
7
|
-
actual = UiBibz::Ui::Core::
|
7
|
+
actual = UiBibz::Ui::Core::Star.new(1).render
|
8
8
|
expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i></span>"
|
9
9
|
assert_equal expected, actual
|
10
10
|
end
|
11
11
|
|
12
12
|
test "stars with 2.1" do
|
13
|
-
actual = UiBibz::Ui::Core::
|
13
|
+
actual = UiBibz::Ui::Core::Star.new(2.1).render
|
14
14
|
expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star-half-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i></span>"
|
15
15
|
assert_equal expected, actual
|
16
16
|
end
|
17
17
|
|
18
18
|
test "stars with 3.6 with status danger" do
|
19
|
-
actual = UiBibz::Ui::Core::
|
19
|
+
actual = UiBibz::Ui::Core::Star.new(3.6, { status: :danger }).render
|
20
20
|
expected = "<span class=\"stars-notation\"><i class=\"glyph-danger glyph fa fa-star\"></i> <i class=\"glyph-danger glyph fa fa-star\"></i> <i class=\"glyph-danger glyph fa fa-star\"></i> <i class=\"glyph-danger glyph fa fa-star-half-o\"></i> <i class=\"glyph-danger glyph fa fa-star-o\"></i></span>"
|
21
21
|
assert_equal expected, actual
|
22
22
|
end
|
23
23
|
|
24
24
|
test "stars with 4.9" do
|
25
|
-
actual = UiBibz::Ui::Core::
|
25
|
+
actual = UiBibz::Ui::Core::Star.new(4.9).render
|
26
26
|
expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star-half-o\"></i></span>"
|
27
27
|
assert_equal expected, actual
|
28
28
|
end
|
29
29
|
|
30
30
|
test "stars with 5" do
|
31
|
-
actual = UiBibz::Ui::Core::
|
31
|
+
actual = UiBibz::Ui::Core::Star.new(5).render
|
32
32
|
expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i></span>"
|
33
33
|
assert_equal expected, actual
|
34
34
|
end
|
35
35
|
|
36
36
|
test "stars with number options 11.2" do
|
37
|
-
actual = UiBibz::Ui::Core::
|
37
|
+
actual = UiBibz::Ui::Core::Star.new(2.5, { num: 11.2 }).render
|
38
38
|
expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star-half-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i></span>"
|
39
39
|
assert_equal expected, actual
|
40
40
|
end
|
data/test/ui/table_test.rb
CHANGED
@@ -32,7 +32,7 @@ class TableTest < ActionView::TestCase
|
|
32
32
|
|
33
33
|
test 'table pagination' do
|
34
34
|
actual = UiBibz::Ui::Ux::Tables::TablePagination.new({ store: @users }).render
|
35
|
-
expected = "<
|
35
|
+
expected = "<nav class=\"pagination\"><ul class=\"pagination\" role=\"group\"><li class=\"previous page-item disabled\"><span class=\"page-link\">«</span></li> <li class=\"page-item active\"><span class=\"page-link\">1</span></li> <li class=\"page-item\"><a class=\"page-link\" rel=\"next\" href=\"/users?direction=asc&page=2&per_page=2&search=Name+fr&sort=users.name_fr\">2</a></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=3&per_page=2&search=Name+fr&sort=users.name_fr\">3</a></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=4&per_page=2&search=Name+fr&sort=users.name_fr\">4</a></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=5&per_page=2&search=Name+fr&sort=users.name_fr\">5</a></li> <li class=\"page-item disabled\"><i class=\"page-link\">…</i></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=12&per_page=2&search=Name+fr&sort=users.name_fr\">12</a></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=13&per_page=2&search=Name+fr&sort=users.name_fr\">13</a></li> <li class=\"next page-item\"><a class=\"page-link\" rel=\"next\" href=\"/users?direction=asc&page=2&per_page=2&search=Name+fr&sort=users.name_fr\">»</a></li></ul></nav>"
|
36
36
|
|
37
37
|
assert_equal expected, actual
|
38
38
|
end
|
@@ -59,14 +59,14 @@ class TableTest < ActionView::TestCase
|
|
59
59
|
actual = pagination.render if pagination.paginable?
|
60
60
|
expected = nil
|
61
61
|
|
62
|
-
|
62
|
+
assert_nil actual
|
63
63
|
end
|
64
64
|
|
65
65
|
test 'table paginable' do
|
66
66
|
options = { paginable: true }
|
67
67
|
pagination = UiBibz::Ui::Ux::Tables::Paginable.new(@store, options)
|
68
68
|
actual = pagination.render if pagination.paginable?
|
69
|
-
expected = "<div><
|
69
|
+
expected = "<div><nav class=\"pagination\"><ul class=\"pagination\" role=\"group\"><li class=\"previous page-item disabled\"><span class=\"page-link\">«</span></li> <li class=\"page-item active\"><span class=\"page-link\">1</span></li> <li class=\"page-item\"><a class=\"page-link\" rel=\"next\" href=\"/users?direction=asc&page=2&per_page=2&search=Name+fr&sort=users.name_fr\">2</a></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=3&per_page=2&search=Name+fr&sort=users.name_fr\">3</a></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=4&per_page=2&search=Name+fr&sort=users.name_fr\">4</a></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=5&per_page=2&search=Name+fr&sort=users.name_fr\">5</a></li> <li class=\"page-item disabled\"><i class=\"page-link\">…</i></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=12&per_page=2&search=Name+fr&sort=users.name_fr\">12</a></li> <li class=\"page-item\"><a class=\"page-link\" href=\"/users?direction=asc&page=13&per_page=2&search=Name+fr&sort=users.name_fr\">13</a></li> <li class=\"next page-item\"><a class=\"page-link\" rel=\"next\" href=\"/users?direction=asc&page=2&per_page=2&search=Name+fr&sort=users.name_fr\">»</a></li></ul></nav><form action=\"/users\" accept-charset=\"UTF-8\" method=\"get\"><input name=\"utf8\" type=\"hidden\" value=\"✓\" /><div class=\"table-pagination-per-page\">Displaying User <b>1 - 2</b> of <b>25</b> in total | Per page: <input type=\"hidden\" name=\"sort\" value=\"users.name_fr\" /><input type=\"hidden\" name=\"direction\" value=\"asc\" /><input type=\"hidden\" name=\"per_page\" value=\"2\" /><input type=\"hidden\" name=\"page\" value=\"1\" /><select name=\"per_page\" id=\"per_page\" class=\"form-control\"><option value=\"5\">5</option>
|
70
70
|
<option value=\"10\">10</option>
|
71
71
|
<option value=\"20\">20</option>
|
72
72
|
<option value=\"30\">30</option>
|
data/test/ui_helper_test.rb
CHANGED
@@ -67,8 +67,13 @@ class UiHelperTest < ActionView::TestCase
|
|
67
67
|
n.link 'lala', url: '#'
|
68
68
|
n.link 'lolo', url: '#'
|
69
69
|
end
|
70
|
+
nb.form '/search', { type: :form_tag, position: :right } do
|
71
|
+
concat text_field_tag 'search'
|
72
|
+
concat button :submit
|
73
|
+
end
|
70
74
|
end
|
71
|
-
expected = "<nav class=\"navbar navbar-inverse navbar-fixed-bottom\"><div class=\"container-fluid\"><div class=\"navbar-header\"><button class=\"navbar-
|
75
|
+
expected = "<nav class=\"navbar navbar-inverse navbar-fixed-bottom\"><div class=\"container-fluid\"><div class=\"navbar-header\"><button class=\"navbar-toggler hidden-sm-up\" type=\"button\" data-toggle=\"collapse\" data-target=\"#navbar-collapse-243510900091050741589988795055654058002\">☰</button></div><div class=\"collapse navbar-toggleable-xs\" id=\"navbar-collapse-243510900091050741589988795055654058002\"><a class=\"navbar-brand\" href=\"/\">My title</a><ul class=\"nav navbar-nav\"><li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">state</a></li><li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">Tata</a></li></ul><ul class=\"nav navbar-nav pull-right\"><li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">lala</a></li><li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">lolo</a></li></ul><form class=\"navbar-form form-inline pull-right\" action=\"/search\" accept-charset=\"UTF-8\" method=\"post\"><input name=\"utf8\" type=\"hidden\" value=\"✓\" /><input type=\"text\" name=\"search\" id=\"search\" /><button class=\"btn-primary btn\">submit</button><input type=\"text\" name=\"search\" id=\"search\" /><button class=\"btn-primary btn\">submit</button></form>
|
76
|
+
+</div></div></nav>"
|
72
77
|
|
73
78
|
refute_equal expected, actual
|
74
79
|
end
|
data/ui_bibz.gemspec
CHANGED
@@ -29,20 +29,20 @@ Gem::Specification.new do |s|
|
|
29
29
|
#s.add_dependency 'bundler', '>= 1.8.4'
|
30
30
|
s.add_dependency 'rails', '>= 4.2.0'
|
31
31
|
s.add_dependency 'will_paginate', '~> 3.1.0'
|
32
|
-
s.add_dependency 'will_paginate-bootstrap'
|
33
32
|
s.add_dependency 'will-paginate-i18n'
|
33
|
+
s.add_dependency 'will_paginate-bootstrap4'
|
34
34
|
s.add_dependency 'haml'
|
35
35
|
s.add_dependency 'haml-rails'
|
36
36
|
s.add_dependency 'sass-rails', '>= 5.0.0'
|
37
37
|
s.add_dependency 'font-awesome-sass'
|
38
|
-
s.add_dependency 'bootstrap', '4.0.0.
|
38
|
+
s.add_dependency 'bootstrap', '4.0.0.alpha5'
|
39
39
|
|
40
40
|
# Javascript gems (rails-assets.org)
|
41
41
|
#s.add_dependency 'rails-assets-tether', '>= 1.1.0'
|
42
42
|
#s.add_dependency 'rails-assets-bootstrap-select', '>= 1.10.0'
|
43
43
|
#s.add_dependency 'rails-assets-bootstrap-datepicker', '>= 1.6.0'
|
44
44
|
|
45
|
-
# not compatible with
|
45
|
+
# not compatible with bootstrap 4
|
46
46
|
#s.add_dependency 'rails-assets-bootstrap-switch', '>= 3.3.2'
|
47
47
|
#s.add_dependency 'rails-assets-bootstrap-multiselect', '>= 0.9.13'
|
48
48
|
|
@@ -50,5 +50,6 @@ Gem::Specification.new do |s|
|
|
50
50
|
s.add_development_dependency "minitest"
|
51
51
|
s.add_development_dependency "sqlite3"
|
52
52
|
s.add_development_dependency "factory_girl_rails", "~> 4.0"
|
53
|
+
s.add_development_dependency "simplecov"
|
53
54
|
s.add_development_dependency "codeclimate-test-reporter"
|
54
55
|
end
|
@@ -0,0 +1,250 @@
|
|
1
|
+
|
2
|
+
//
|
3
|
+
// Checkboxes
|
4
|
+
// --------------------------------------------------
|
5
|
+
|
6
|
+
|
7
|
+
$font-family-icon: 'FontAwesome' !default;
|
8
|
+
$fa-var-check: "\f00c" !default;
|
9
|
+
$check-icon: $fa-var-check !default;
|
10
|
+
|
11
|
+
@mixin checkbox-variant($parent, $color) {
|
12
|
+
#{$parent} input[type="checkbox"]:checked + label,
|
13
|
+
#{$parent} input[type="radio"]:checked + label {
|
14
|
+
&::before {
|
15
|
+
background-color: $color;
|
16
|
+
border-color: $color;
|
17
|
+
}
|
18
|
+
&::after{
|
19
|
+
color: #fff;
|
20
|
+
}
|
21
|
+
}
|
22
|
+
}
|
23
|
+
|
24
|
+
@mixin checkbox-variant-indeterminate($parent, $color) {
|
25
|
+
#{$parent} input[type="checkbox"]:indeterminate + label,
|
26
|
+
#{$parent} input[type="radio"]:indeterminate + label {
|
27
|
+
&::before {
|
28
|
+
background-color: $color;
|
29
|
+
border-color: $color;
|
30
|
+
}
|
31
|
+
&::after{
|
32
|
+
background-color: #fff;
|
33
|
+
}
|
34
|
+
}
|
35
|
+
}
|
36
|
+
|
37
|
+
.abc-checkbox{
|
38
|
+
padding-left: 20px;
|
39
|
+
|
40
|
+
label{
|
41
|
+
display: inline-block;
|
42
|
+
vertical-align: middle;
|
43
|
+
position: relative;
|
44
|
+
padding-left: 5px;
|
45
|
+
|
46
|
+
&::before{
|
47
|
+
cursor: pointer;
|
48
|
+
content: "";
|
49
|
+
display: inline-block;
|
50
|
+
position: absolute;
|
51
|
+
width: 17px;
|
52
|
+
height: 17px;
|
53
|
+
left: 0;
|
54
|
+
margin-left: -20px;
|
55
|
+
border: 1px solid $input-border-color;
|
56
|
+
border-radius: 3px;
|
57
|
+
background-color: #fff;
|
58
|
+
@include transition(border 0.15s ease-in-out, color 0.15s ease-in-out);
|
59
|
+
}
|
60
|
+
|
61
|
+
&::after{
|
62
|
+
cursor: pointer;
|
63
|
+
display: inline-block;
|
64
|
+
position: absolute;
|
65
|
+
width: 16px;
|
66
|
+
height: 16px;
|
67
|
+
left: 0;
|
68
|
+
top: 0;
|
69
|
+
margin-left: -20px;
|
70
|
+
padding-left: 3px;
|
71
|
+
padding-top: 1px;
|
72
|
+
font-size: 11px;
|
73
|
+
color: $input-color;
|
74
|
+
}
|
75
|
+
}
|
76
|
+
|
77
|
+
input[type="checkbox"],
|
78
|
+
input[type="radio"] {
|
79
|
+
cursor: pointer;
|
80
|
+
opacity: 0;
|
81
|
+
z-index: 1;
|
82
|
+
|
83
|
+
&:focus + label::before{
|
84
|
+
@include tab-focus();
|
85
|
+
}
|
86
|
+
|
87
|
+
&:checked + label::after{
|
88
|
+
font-family: $font-family-icon;
|
89
|
+
content: $check-icon;
|
90
|
+
}
|
91
|
+
|
92
|
+
&:indeterminate + label::after{
|
93
|
+
display: block;
|
94
|
+
content: "";
|
95
|
+
width: 10px;
|
96
|
+
height: 3px;
|
97
|
+
background-color: #555555;
|
98
|
+
border-radius: 2px;
|
99
|
+
margin-left: -16.5px;
|
100
|
+
margin-top: 7px;
|
101
|
+
}
|
102
|
+
|
103
|
+
&:disabled + label{
|
104
|
+
opacity: 0.65;
|
105
|
+
|
106
|
+
&::before{
|
107
|
+
background-color: $input-bg-disabled;
|
108
|
+
cursor: not-allowed;
|
109
|
+
}
|
110
|
+
}
|
111
|
+
|
112
|
+
}
|
113
|
+
|
114
|
+
&.abc-checkbox-circle label::before{
|
115
|
+
border-radius: 50%;
|
116
|
+
}
|
117
|
+
|
118
|
+
&.checkbox-inline{
|
119
|
+
margin-top: 0;
|
120
|
+
}
|
121
|
+
}
|
122
|
+
|
123
|
+
@include checkbox-variant('.abc-checkbox-primary', $brand-primary);
|
124
|
+
@include checkbox-variant('.abc-checkbox-danger', $brand-danger);
|
125
|
+
@include checkbox-variant('.abc-checkbox-info', $brand-info);
|
126
|
+
@include checkbox-variant('.abc-checkbox-warning', $brand-warning);
|
127
|
+
@include checkbox-variant('.abc-checkbox-success', $brand-success);
|
128
|
+
|
129
|
+
|
130
|
+
@include checkbox-variant-indeterminate('.abc-checkbox-primary', $brand-primary);
|
131
|
+
@include checkbox-variant-indeterminate('.abc-checkbox-danger', $brand-danger);
|
132
|
+
@include checkbox-variant-indeterminate('.abc-checkbox-info', $brand-info);
|
133
|
+
@include checkbox-variant-indeterminate('.abc-checkbox-warning', $brand-warning);
|
134
|
+
@include checkbox-variant-indeterminate('.abc-checkbox-success', $brand-success);
|
135
|
+
|
136
|
+
//
|
137
|
+
// Radios
|
138
|
+
// --------------------------------------------------
|
139
|
+
|
140
|
+
@mixin radio-variant($parent, $color) {
|
141
|
+
#{$parent} input[type="radio"]{
|
142
|
+
+ label{
|
143
|
+
&::after{
|
144
|
+
background-color: $color;
|
145
|
+
}
|
146
|
+
}
|
147
|
+
&:checked + label{
|
148
|
+
&::before {
|
149
|
+
border-color: $color;
|
150
|
+
}
|
151
|
+
&::after{
|
152
|
+
background-color: $color;
|
153
|
+
}
|
154
|
+
}
|
155
|
+
}
|
156
|
+
}
|
157
|
+
|
158
|
+
.abc-radio{
|
159
|
+
padding-left: 20px;
|
160
|
+
|
161
|
+
label{
|
162
|
+
display: inline-block;
|
163
|
+
vertical-align: middle;
|
164
|
+
position: relative;
|
165
|
+
padding-left: 5px;
|
166
|
+
|
167
|
+
&::before{
|
168
|
+
cursor: pointer;
|
169
|
+
content: "";
|
170
|
+
display: inline-block;
|
171
|
+
position: absolute;
|
172
|
+
width: 17px;
|
173
|
+
height: 17px;
|
174
|
+
left: 0;
|
175
|
+
margin-left: -20px;
|
176
|
+
border: 1px solid $input-border-color;
|
177
|
+
border-radius: 50%;
|
178
|
+
background-color: #fff;
|
179
|
+
@include transition(border 0.15s ease-in-out);
|
180
|
+
}
|
181
|
+
|
182
|
+
&::after{
|
183
|
+
cursor: pointer;
|
184
|
+
display: inline-block;
|
185
|
+
position: absolute;
|
186
|
+
content: " ";
|
187
|
+
width: 11px;
|
188
|
+
height: 11px;
|
189
|
+
left: 3px;
|
190
|
+
top: 3px;
|
191
|
+
margin-left: -20px;
|
192
|
+
border-radius: 50%;
|
193
|
+
background-color: $input-color;
|
194
|
+
transform: scale(0, 0);
|
195
|
+
|
196
|
+
transition: transform .1s cubic-bezier(.8,-0.33,.2,1.33);
|
197
|
+
//curve - http://cubic-bezier.com/#.8,-0.33,.2,1.33
|
198
|
+
}
|
199
|
+
}
|
200
|
+
|
201
|
+
input[type="radio"]{
|
202
|
+
cursor: pointer;
|
203
|
+
opacity: 0;
|
204
|
+
z-index: 1;
|
205
|
+
|
206
|
+
&:focus + label::before{
|
207
|
+
@include tab-focus();
|
208
|
+
}
|
209
|
+
|
210
|
+
&:checked + label::after{
|
211
|
+
transform: scale(1, 1);
|
212
|
+
}
|
213
|
+
|
214
|
+
&:disabled + label{
|
215
|
+
opacity: 0.65;
|
216
|
+
|
217
|
+
&::before{
|
218
|
+
cursor: not-allowed;
|
219
|
+
}
|
220
|
+
}
|
221
|
+
|
222
|
+
}
|
223
|
+
|
224
|
+
&.radio-inline{
|
225
|
+
margin-top: 0;
|
226
|
+
}
|
227
|
+
}
|
228
|
+
|
229
|
+
@include radio-variant('.abc-radio-primary', $brand-primary);
|
230
|
+
@include radio-variant('.abc-radio-danger', $brand-danger);
|
231
|
+
@include radio-variant('.abc-radio-info', $brand-info);
|
232
|
+
@include radio-variant('.abc-radio-warning', $brand-warning);
|
233
|
+
@include radio-variant('.abc-radio-success', $brand-success);
|
234
|
+
|
235
|
+
|
236
|
+
input[type="checkbox"],
|
237
|
+
input[type="radio"] {
|
238
|
+
&.styled:checked + label:after {
|
239
|
+
font-family: $font-family-icon;
|
240
|
+
content: $check-icon;
|
241
|
+
}
|
242
|
+
.styled:checked + label {
|
243
|
+
&::before {
|
244
|
+
color: #fff;
|
245
|
+
}
|
246
|
+
&::after {
|
247
|
+
color: #fff;
|
248
|
+
}
|
249
|
+
}
|
250
|
+
}
|