ui_bibz 0.9.0

data/test/ui/component_test.rb

@@ -0,0 +1,21 @@
+require 'test_helper'
+
+include UiBibz::Helpers
+class ComponentTest < ActionView::TestCase
+
+  test 'create complex component' do
+    actual = UiBibz::Ui::Component.new('New component', { status: :active, glyph: 'add' }, { class: 'new-class' }).render
+    expected = '<i class="glyph fa fa-add"></i> New component'
+
+    assert_equal expected, actual
+  end
+
+  test 'create complex component with block' do
+    actual = UiBibz::Ui::Component.new(status: :active) do
+      "New content"
+    end.render
+    expected = 'New content'
+
+    assert_equal expected, actual
+  end
+end

data/test/ui/dropdown_test.rb

@@ -0,0 +1,18 @@
+require 'test_helper'
+include UiBibz::Helpers
+class DropdownTest < ActionView::TestCase
+
+  test 'Dropdown' do
+    actual = UiBibz::Ui::Dropdown.new("Dropdown", type: :dropup, state: :success).tap do |d|
+      d.list 'toto'
+      d.list 'header', type: :header
+      d.list 'momo'
+      d.list '---'
+      d.list 'lolo'
+    end.render
+    expected = "<div class=\"dropup\"><button class=\"btn btn-success dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-expanded=\"false\">Dropdown <span class=\"caret\"></span></button><ul class=\"dropdown-menu dropdown-menu-left\" role=\"menu\"><li role=\"presentation\">toto</li><li class=\"dropdown-header\" role=\"presentation\">header</li><li role=\"presentation\">momo</li><li class=\"divider\" role=\"presentation\"></li><li role=\"presentation\">lolo</li></ul></div>"
+
+    assert_equal expected, actual
+  end
+
+end

data/test/ui/glyph_test.rb

@@ -0,0 +1,23 @@
+require 'test_helper'
+
+include UiBibz::Helpers
+class GlyphTest < ActionView::TestCase
+
+  test 'create glyph with a name' do
+    actual   = UiBibz::Ui::Glyph.new('add').render
+    expected = '<i class="glyph fa fa-add"></i>'
+    assert_equal expected, actual
+  end
+
+  test 'create glyph with hash' do
+    actual   = UiBibz::Ui::Glyph.new({ name: 'add', size: 3, type: 'li'}).render
+    expected = '<i class="glyph fa fa-add fa-3x fa-li"></i>'
+    assert_equal expected, actual
+  end
+
+  test 'create glyph with name and hash' do
+    actual   = UiBibz::Ui::Glyph.new('add', { size: 3, type: 'li' }).render
+    expected = '<i class="glyph fa fa-add fa-3x fa-li"></i>'
+    assert_equal expected, actual
+  end
+end

data/test/ui/grid_test.rb

@@ -0,0 +1,46 @@
+require 'test_helper'
+include UiBibz::Helpers
+class GridTest < ActionView::TestCase
+
+  test 'row' do
+    actual = UiBibz::Ui::Row.new() do
+      'test'
+    end.render
+    expected = "<div class=\"row\">test</div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'col with simple arg' do
+    actual = UiBibz::Ui::Col.new({ size: :lg, num: 1}) do
+      'test'
+    end.render
+    expected = "<div class=\"col-lg-1\">test</div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'col with multiple args' do
+    actual = UiBibz::Ui::Col.new([{ size: :lg, num: 1, offset: 2}, { num: 1 }], class: 'test') do
+      'test'
+    end.render
+    expected = "<div class=\"test col-lg-1 col-offset-2 col-md-1\">test</div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'grid' do
+    actual = UiBibz::Ui::Grid.new().tap do |g|
+      g.view position: :left do
+        'left'
+      end
+      g.view 'center', position: :center
+      g.view 'right', position: :right
+      g.view 'bottom', position: :bottom
+    end.render
+    expected = "<div class=\"grid row\"><div class=\"col grid-left col-md-1\">left</div><div class=\"col grid-center col-md-10\">center</div><div class=\"col grid-right col-md-1\">right</div><div class=\"col grid-bottom col-md-12\">bottom</div></div>"
+
+    assert_equal expected, actual
+  end
+
+end

data/test/ui/list_group_test.rb

@@ -0,0 +1,28 @@
+require 'test_helper'
+include UiBibz::Helpers
+class ListGroupTest < ActionView::TestCase
+
+  test 'list_group with link' do
+    actual = UiBibz::Ui::ListGroup.new(type: :link).tap do |lg|
+      lg.list 'Momo', { state: :success, url: '#momo' }
+      lg.list({ tap: true, active: true, url: '#toto' }) do |l|
+        l.header 'My title'
+        l.body   'My body'
+      end
+    end.render
+    expected = "<div class=\"list-group\"><a href=\"#momo\" class=\"list-group-item-success list-group-item\">Momo</a><a type=\"link\" href=\"#toto\" class=\"list-group-item\"><h4 class=\"list-group-item-heading\">My title</h4><p class=\"list-group-item-text\">My body</p></a></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'list_group' do
+    actual = UiBibz::Ui::ListGroup.new().tap do |lg|
+      lg.list 'Lulu'
+      lg.list 'Toto'
+    end.render
+    expected = "<ul class=\"list-group\"><li class=\"list-group-item\">Lulu</li><li class=\"list-group-item\">Toto</li></ul>"
+
+    assert_equal expected, actual
+  end
+
+end

data/test/ui/nav_test.rb

@@ -0,0 +1,27 @@
+require 'test_helper'
+include UiBibz::Helpers
+class NavTest < ActionView::TestCase
+
+  test 'Nav with tab' do
+    actual = UiBibz::Ui::Nav.new().tap do |n|
+      n.link 'Home', status: :active, url: "#Home", selector: 'home'
+      n.link 'Profile', url: "#profile", selector: 'profile'
+      n.link 'Messages', url: "#messages", selector: 'messages'
+    end.render
+    expected = "<ul class=\"nav nav-tabs\"><li class=\"active\" role=\"presentation\"><a aria-controls=\"home\" role=\"tab\" data-toggle=\"tab\" href=\"#Home\">Home</a></li><li role=\"presentation\"><a aria-controls=\"profile\" role=\"tab\" data-toggle=\"tab\" href=\"#profile\">Profile</a></li><li role=\"presentation\"><a aria-controls=\"messages\" role=\"tab\" data-toggle=\"tab\" href=\"#messages\">Messages</a></li></ul>"
+
+    assert_equal expected, actual
+  end
+
+  test 'Nav with pills' do
+    actual = UiBibz::Ui::Nav.new(type: :pills, position: :justified).tap do |n|
+      n.link 'Home', status: :active, url: "#Home", selector: 'home'
+      n.link 'Profile', url: "#profile", selector: 'profile', badge: 16
+      n.link 'Messages', url: "#messages", selector: 'messages', status: :disabled
+    end.render
+    expected = "<ul class=\"nav nav-pills nav-justified\"><li class=\"active\" role=\"presentation\"><a href=\"#Home\">Home</a></li><li role=\"presentation\"><a href=\"#profile\">Profile<span class=\"badge\">16</span></a></li><li class=\"disabled\" role=\"presentation\"><a href=\"#messages\">Messages</a></li></ul>"
+
+    assert_equal expected, actual
+  end
+
+end

data/test/ui/panel_test.rb

@@ -0,0 +1,52 @@
+require 'test_helper'
+include UiBibz::Helpers
+class PanelTest < ActionView::TestCase
+
+  setup do
+    @content = 'Example'
+  end
+
+  test 'simple panel' do
+    actual   = UiBibz::Ui::Panel.new(@content).render
+    expected = "<div class=\"panel-default panel\"><div class=\"panel-body\">#{ @content }</div></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'simple panel with block' do
+    actual = UiBibz::Ui::Panel.new do
+      @content
+    end.render
+    expected = "<div class=\"panel-default panel\"><div class=\"panel-body\">#{ @content }</div></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'simple panel with tap' do
+    actual = UiBibz::Ui::Panel.new().tap do |p|
+      p.body @content
+    end.render
+    expected = "<div class=\"panel-default panel\"><div class=\"panel-body\">#{ @content }</div></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'complex panel with tap' do
+    actual = UiBibz::Ui::Panel.new({state: :danger}, { class: 'example'}).tap do |p|
+      p.header 'header', class: 'header-example'
+      p.body class: 'body-example' do
+        @content
+      end
+      p.footer do
+        "footer"
+      end
+    end.render
+    expected = "<div class=\"example panel-danger panel\">\
+<div class=\"header-example panel-heading\">header</div>\
+<div class=\"body-example panel-body\">#{ @content }</div>\
+<div class=\"panel-footer\">footer</div></div>"
+
+    assert_equal expected, actual
+  end
+
+end

data/test/ui/table_test.rb

@@ -0,0 +1,178 @@
+require 'test_helper'
+require "ui_bibz/ui/table/components/store"
+require "ui_bibz/ui/table/ux/paginable"
+require "ui_bibz/ui/table/ux/searchable"
+require "ui_bibz/ui/table/ux/sortable"
+require "ui_bibz/ui/table/ux/actionable"
+include UiBibz::Helpers
+class TableTest < ActionView::TestCase
+
+  setup do
+    create_list(:user, 25)
+    params = {
+      controller: 'users',
+      action:     'index',
+      sort:       'users.name_fr',
+      direction:  'asc',
+      search:     'Name fr',
+      per_page:   2,
+      page:       1
+    }
+    @users  = User.table_search_pagination(params, session)
+    @store = UiBibz::Ui::Store.new @users
+  end
+
+  test 'table search field' do
+    actual   = UiBibz::Ui::TableSearchField.new({ store: @users}).render
+    expected = "<form action=\"/users\" accept-charset=\"UTF-8\" method=\"get\"><input name=\"utf8\" type=\"hidden\" value=\"&#x2713;\" /><div class=\"input-group input-group-sm table-search-field\"><span class=\"input-group-addon\"><i class=\"glyph fa fa-search\"></i></span><input type=\"search\" value=\"Name fr\" name=\"search\" class=\"form-control\" placeholder=\"Search by name_fr and name_en...\" /><span class=\"clear-search-btn input-group-addon\"><i class=\"glyph fa fa-times-circle\"></i></span></div></form>"
+
+    assert_equal expected, actual
+  end
+
+  test 'table pagination' do
+    actual = UiBibz::Ui::TablePagination.new({ store: @users}).render
+    expected = "<ul class=\"pagination pagination\"><li class=\"prev disabled\"><span>&#8592; Previous</span></li> <li class=\"active\"><span>1</span></li> <li><a rel=\"next\" href=\"/users?page=2\">2</a></li> <li><a href=\"/users?page=3\">3</a></li> <li><a href=\"/users?page=4\">4</a></li> <li><a href=\"/users?page=5\">5</a></li> <li><a href=\"/users?page=6\">6</a></li> <li><a href=\"/users?page=7\">7</a></li> <li><a href=\"/users?page=8\">8</a></li> <li><a href=\"/users?page=9\">9</a></li> <li class=\"disabled\"><span>&hellip;</span></li> <li><a href=\"/users?page=12\">12</a></li> <li><a href=\"/users?page=13\">13</a></li> <li class=\"next\"><a rel=\"next\" href=\"/users?page=2\">Next &#8594;</a></li></ul>"
+
+    assert_equal expected, actual
+  end
+
+  test 'table non sortable' do
+    options  = { sortable: false }
+    actual   = UiBibz::Ui::Sortable.new(@store, options).header(@store.columns.list.first)
+    expected = "Id"
+
+    assert_equal expected, actual
+  end
+
+  test 'table sortable' do
+    options  = { sortable: true }
+    actual   = UiBibz::Ui::Sortable.new(@store, options).header(@store.columns.list.first)
+    expected = "<a class=\"dropup\" href=\"/users?direction=asc&amp;search=Name+fr&amp;sort=users.id\">Id</a>"
+
+    assert_equal expected, actual
+  end
+
+  test 'table non paginable' do
+    options      = { paginable: false }
+    pagination   = UiBibz::Ui::Paginable.new(@store, options)
+    actual       = pagination.render if pagination.paginable?
+    expected     = nil
+
+    assert_equal expected, actual
+  end
+
+  test 'table paginable' do
+    options      = { paginable: true }
+    pagination   = UiBibz::Ui::Paginable.new(@store, options)
+    actual       = pagination.render if pagination.paginable?
+    expected     = "<div><ul class=\"pagination pagination\"><li class=\"prev disabled\"><span>&#8592; Previous</span></li> <li class=\"active\"><span>1</span></li> <li><a rel=\"next\" href=\"/users?page=2\">2</a></li> <li><a href=\"/users?page=3\">3</a></li> <li><a href=\"/users?page=4\">4</a></li> <li><a href=\"/users?page=5\">5</a></li> <li><a href=\"/users?page=6\">6</a></li> <li><a href=\"/users?page=7\">7</a></li> <li><a href=\"/users?page=8\">8</a></li> <li><a href=\"/users?page=9\">9</a></li> <li class=\"disabled\"><span>&hellip;</span></li> <li><a href=\"/users?page=12\">12</a></li> <li><a href=\"/users?page=13\">13</a></li> <li class=\"next\"><a rel=\"next\" href=\"/users?page=2\">Next &#8594;</a></li></ul><form action=\"/users\" accept-charset=\"UTF-8\" method=\"get\"><input name=\"utf8\" type=\"hidden\" value=\"&#x2713;\" /><div class=\"table-pagination-per-page\">Displaying User <b>1&nbsp;-&nbsp;2</b> of <b>25</b> in total | Per page: <select name=\"per_page\" id=\"per_page\" class=\"form-control\"><option value=\"25\">25</option>
+<option value=\"50\">50</option>
+<option value=\"100\">100</option></select></div></form><br class=\"clear\" /></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'table non searchable' do
+    options  = { searchable: false }
+    actual   = UiBibz::Ui::Searchable.new(@store, options).render
+    expected = "<div><div class=\"title\">Users list</div><br class=\"clear\" /></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'table non searchable with a title and glyph' do
+    options  = { searchable: false, glyph: 'toto', title: 'Title list' }
+    actual   = UiBibz::Ui::Searchable.new(@store, options).render
+    expected = "<div><div class=\"title\"><i class=\"glyph fa fa-toto\"></i>Title list</div><br class=\"clear\" /></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'table searchable' do
+    options  = { searchable: true }
+    actual   = UiBibz::Ui::Searchable.new(@store, options).render
+    expected = "<div><div class=\"title\">Users list</div><div class=\"input-group input-group-sm table-search-field\"><span class=\"input-group-addon\"><i class=\"glyph fa fa-search\"></i></span><input type=\"search\" value=\"Name fr\" name=\"search\" class=\"form-control\" placeholder=\"Search by name_fr and name_en...\" /><span class=\"clear-search-btn input-group-addon\"><i class=\"glyph fa fa-times-circle\"></i></span></div><br class=\"clear\" /></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'table actionable header' do
+    options  = { actionable: true }
+    action   = UiBibz::Ui::Actionable.new(@store, options)
+    actual   = action.header []
+    expected = ["<th class=\"action\"></th>"]
+
+    assert_equal expected, actual
+  end
+
+  test 'table actionable body' do
+    options  = { actionable: true }
+    action   = UiBibz::Ui::Actionable.new(@store, options)
+    actual   = action.body @store.records.first, []
+    expected = ["<td><div class=\"btn-group-xs dropdown\"><button class=\"btn btn-default dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-expanded=\"false\"><i class=\"glyph fa fa-ellipsis-v fa-fw\"></i> Actions <span class=\"caret\"></span></button><ul class=\"dropdown-menu dropdown-menu-right\" role=\"menu\"></ul></div></td>"]
+
+
+    assert_equal expected, actual
+  end
+
+  test 'table actionable inject_url' do
+    options  = { actionable: true }
+    action   = UiBibz::Ui::Actionable.new(@store, options)
+    actual   = action.inject_url 'http://localhost/users/id/test', @store.records.first
+    expected = "http://localhost/users/1/test"
+
+    assert_equal expected, actual
+  end
+
+  test 'table non actionable header' do
+    options  = { actionable: false }
+    action   = UiBibz::Ui::Actionable.new(@store, options)
+    actual   = action.header []
+    expected = []
+
+    assert_equal expected, actual
+  end
+
+  test 'table non actionable body' do
+    options  = { actionable: false }
+    action   = UiBibz::Ui::Actionable.new(@store, options)
+    actual   = action.body @store.records.first, []
+    expected = []
+
+    assert_equal expected, actual
+  end
+
+  test 'simple table_panel' do
+    actual = UiBibz::Ui::TablePanel.new(store: @users, tap: true).render
+  end
+
+  test 'complex table_panel' do
+    actual = UiBibz::Ui::TablePanel.new({ store: @users, tap: true }, { class: 'toto' }).tap do |pane|
+      pane.header 'Test header'
+      pane.body class: 'ui' do
+        'Test body'
+      end
+    end.render
+  end
+
+  test 'complex table_panel with custom actions' do
+    actual = UiBibz::Ui::TablePanel.new({ store: @users, tap: true }, { class: 'toto'}).tap do |pane|
+      pane.header 'Test header'
+      pane.body cls: 'ui' do
+        'Test body'
+      end
+      pane.columns do |c|
+        c.column({ name: '#', data_index: 'id' })
+        c.column({ name: 'Name fr', data_index: 'name_fr', link: edit_user_path(:id), order: 2 })
+        c.column({ name: 'Name en', data_index: 'name_en', order: 1 })
+        c.column({ name: 'Name en', data_index: 'name_en', format: lambda{ |records, record| "name #{ record.id}"}})
+      end
+      pane.actions do |a|
+        a.action 'toto', url: users_path(:id), glyph: 'eye'
+        a.action '---'
+        a.action 'momo', url: users_path(:id), glyph: 'home'
+      end
+    end.render
+  end
+
+end

data/test/ui_bibz_test.rb

@@ -0,0 +1,13 @@
+require 'test_helper'
+
+class UiBibzTest < ActiveSupport::TestCase
+  test "truth" do
+    assert_kind_of Module, UiBibz
+  end
+
+  test 'setup block yields self' do
+    UiBibz.setup do |config|
+      assert_equal UiBibz, config
+    end
+  end
+end

data/test/ui_helper_test.rb

@@ -0,0 +1,44 @@
+require 'test_helper'
+
+include UiBibz::Helpers
+class UiHelperTest < ActionView::TestCase
+
+  test 'breadcrumb' do
+    actual = breadcrumb do |b|
+      b.link 'Home', url: '#home', glyph: 'home'
+      b.link 'Toto', { url: '#toto', status: :active }
+    end
+    expected = "<ol class=\"breadcrumb\"><li><a href=\"#home\"><i class=\"glyph fa fa-home\"></i> Home</a></li><li class=\"active\"><a href=\"#toto\">Toto</a></li></ol>"
+
+    assert_equal expected, actual
+  end
+
+  test 'alert' do
+    actual = notify 'toto'
+    expected = "<div class=\"alert-info alert\" role=\"alert\">toto</div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'label' do
+    actual   = lab 'toto', state: :success, glyph: 'pencil'
+    expected = "<span class=\"label-success label\"><i class=\"glyph fa fa-pencil\"></i> toto</span>"
+
+    assert_equal expected, actual
+  end
+
+  test 'jumbotron with full_width' do
+    actual   = jumbotron 'toto', full_width: true
+    expected = "<div class=\"jumbotron\"><div class=\"container\">toto</div></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'jumbotron' do
+    actual   = jumbotron 'toto'
+    expected = "<div class=\"jumbotron\">toto</div>"
+
+    assert_equal expected, actual
+  end
+
+end

data/ui_bibz.gemspec

@@ -0,0 +1,36 @@
+$:.push File.expand_path("../lib", __FILE__)
+
+# Maintain your gem's version:
+require "ui_bibz/version"
+
+# Describe your gem and declare its dependencies:
+Gem::Specification.new do |s|
+  s.name        = "ui_bibz"
+  s.version     = UiBibz::VERSION
+  s.authors     = ["Thooams"]
+  s.email       = ["thooams@gmail.com"]
+  s.homepage    = "https://github.com/thooams/ui-bibz"
+  s.summary     = "A Rails plugin with Boostrap framework..."
+  s.description = "A Rails plugin with Boostrap framework..."
+  s.license     = "MIT"
+
+  s.files         = `git ls-files`.split("\n")
+  s.test_files    = `git ls-files -- {test,spec,features}/*`.split("\n")
+  s.executables   = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
+  s.require_paths = ["lib"]
+
+  # rails
+  s.add_dependency 'rails', '~> 4.2.0'
+  s.add_dependency 'will_paginate', '~> 3.0.6'
+  s.add_dependency 'will_paginate-bootstrap'
+  s.add_dependency 'will-paginate-i18n'
+  s.add_dependency 'haml'
+  s.add_dependency 'haml-rails'
+  s.add_dependency 'sass-rails', '~> 5.0.1'
+
+  s.add_development_dependency "minitest"
+  s.add_development_dependency "sqlite3"
+  s.add_development_dependency "factory_girl_rails", "~> 4.0"
+  s.add_development_dependency "codeclimate-test-reporter"
+
+end

data/vendor/assets/javascripts/ui_bibz.js.coffee

@@ -0,0 +1,24 @@
+# For turbolink
+$(document).on 'ready page:load', ->
+
+  # Submit form when per_page select changing
+  $('.table-pagination-per-page select').change () ->
+    $(this).parents('form').submit()
+
+  # Clear search
+  $('.table-search-field .clear-search-btn').click () ->
+    $(this).prev().val('')
+    $(this).parents('form').submit()
+
+  # Resize search field
+  $('.table-panel input[type=search]').blur ->
+    $parent = $(this).parent()
+    $parent.removeClass('has-value') if $(this).val() == ''
+    $parent.removeClass('is-focused')
+
+  $('.table-panel input[type=search]').focus ->
+    $(this).parent().addClass('is-focused has-value')
+
+  $('.table-panel input[type=search]').each ->
+    $(this).parent().addClass('has-value') if $(this).val() != ''
+

data/vendor/assets/stylesheets/ui_bibz.sass

@@ -0,0 +1,46 @@
+.table-panel
+  .action
+    width: 92px
+  .panel-heading
+    background-color: #f5f5f5
+    .title
+      float: left
+      font-size: 20px
+    .has-value
+      width: 400px !important
+    .input-group
+      width: 300px
+      transition: width .5s ease-in-out
+      float: right
+  .panel-table, .panel-body
+    overflow-x: auto
+  .panel-footer
+    padding: 10px 10px
+    .pagination
+      margin: 0
+    .table-pagination-per-page
+      float: right
+      select
+        width: 75px
+        display: inline-block
+
+.table-hover>tbody>tr:hover
+  td:last-child .dropdown
+    display: block
+
+.table-hover>tbody>tr
+  td:last-child
+    height: 39px
+    .dropdown
+      display: none
+
+.table-search-field
+  .clear-search-btn
+    cursor: pointer
+  .glyph
+    margin: 0
+
+.table
+  .action
+    width: 92px
+