booties 0.0.1 → 0.0.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 2d085cd32d4093b862593138682a49d28d80ba19
-  data.tar.gz: ad4d954a6ae014dbe64ec24b0f9a4ac661781892
+  metadata.gz: 0fcf7ffcb28fe2eda72a78078eacab0f5d4e46bc
+  data.tar.gz: 01b4199a6284230d495d67d12813c28ef228300e
 SHA512:
-  metadata.gz: b781658c589e18073d3339a3037f96f368f730a2236adc5138252f46dc50581a6ed38178d91cfe98cc44dba55b27fa90396f1eeee90484a571c80df0e90fdf6d
-  data.tar.gz: 7c055485c578ee6ba5151a0fcad0854858789d9be12faaaf1da8d000525648464960edd185ce7bae39fc8289119bc2870d6abac206d0f276e904c056a2a20ce3
+  metadata.gz: 7d47f0151b0b117e0ef04c46b7d9456ef0f841210aba716979655e41085fc5a8886acb2259d5bae5e09e7a15c272edf2b032d278d53a174fac5512e3211431fe
+  data.tar.gz: 2565c2da18b7282c646a07ed2fec8fdbaea91aa8d9bae5993cb5738c787d23a395e65ab7a2c25d433b3d0c9a57a71a199dd29d755f6ebd75741d087cd5347d7b

data/app/helpers/booties/application_helper.rb

@@ -2,7 +2,7 @@ module Booties
   module ApplicationHelper
     ##
     # Renders an ol tag with the "breadcrumb" class and fills it with the
-    # content of the block.
+    # content of the block. The following:
     #
     #   <% breadcrumbs do %>
     #     <li>Foo</li>
@@ -10,7 +10,7 @@ module Booties
     #   <% end %>
     #   <%= yield :breadcrumb %>
     #
-    # Produces:
+    # will produce:
     #
     #   <ol class="breadcrumb">
     #     <li>Foo</li>
@@ -27,54 +27,151 @@ module Booties
     ##
     # Renders a span tag with the "label" class and a contextual label class
     # derived from +context+. Defaults to "label-default". The content of the
-    # tag is passed in as +content+.
+    # tag is passed in as +content+. The following:
     #
     #   <%= flag 'foo' %>
     #
-    # Produces:
+    # will produce:
     #
     #   <span class="label label-default">foo</span>
     #
-    # Alternatively, you can pass the content in as a block.
+    # Alternatively, you can pass the content in as a block. The following:
     #
     #   <%= flag do %>
     #     foo
     #   <% end %>
     #
-    # Produces:
+    # will produce:
     #
     #   <span class="label label-default">foo</span>
     #
-    # You can provide a different context for the label as +context+.
+    # You can provide a different context for the label as +context+. The
+    # following:
     #
     #   <%= flag 'foo', context: :primary %>
     #
-    # Produces:
+    # will produce:
     #
     #   <span class="label label-primary">foo</span>
     #
     # Additional options passed in through +options+ will be passed to
-    # #content_tag to added as attributes to the span tag.
+    # #content_tag to be added as attributes to the span tag. The following:
     #
     #   <%= flag 'foo', id: 'bar' %>
     #
-    # Produces:
+    # will produce:
     #
     #   <span class="label label-default" id="bar">foo</span>
     #
-    # If +options+ includes a :class key, the contents will be merged with the
-    # classes required by Bootstrap labels.
+    # If the +:class+ option is passed in the contents will be merged with the
+    # classes required by Bootstrap labels. The following:
     #
     #   <%= flag 'foo', class: 'bar' %>
     #
-    # Produces:
+    # will produce:
     #
     #   <span class="label label-default bar">foo</span>
     def flag(content = nil, context: :default, **options, &block)
-      content ||= capture(&block)
-      classes   = %W[label label-#{context}]
-      classes  |= Array(options.delete(:class)).flat_map(&:split)
+      content ||= capture &block
+      classes = Booties.merge_classes %W[label label-#{context}],
+        options.delete(:class)
       content_tag :span, content, class: classes, **options
     end
+
+    ##
+    # Renders a span tag with the "badge" class. The content of the tag is
+    # passed in as +content+. The following:
+    #
+    #   <%= badge 'foo' %>
+    #
+    # will produce:
+    #
+    #   <span class="badge">foo</span>
+    #
+    # Alternatively, you can pass the content in as a block. The following:
+    #
+    #   <%= badge do %> foo <% end %>
+    #
+    # will produce:
+    #
+    #   <span class="badge">foo</span>
+    #
+    # Any options passed in through +options+ will be passed to #content_tag to
+    # be added as attributes to the span tag. The following:
+    #
+    #   <%= badge 'foo', id: 'bar' %>
+    #
+    # will produce:
+    #
+    #   <span class="badge" id="bar">foo</span>
+    #
+    # If the +:class+ option is passed in, the contents will be merged with the
+    # classes required by Bootstrap badges. The following:
+    #
+    #   <%= badge 'foo', class: 'bar' %>
+    #
+    # will produce:
+    #
+    #   <span class="badge bar">foo</span>
+    def badge(content = nil, **options, &block)
+      content ||= capture &block
+      classes = Booties.merge_classes ['badge'], options.delete(:class)
+      content_tag :span, content, class: classes, **options
+    end
+
+    ##
+    # Renders a modal dialog. The CSS id is provided by +id+. The fade effect
+    # will be enabled by default, but it will be disabled if +fade+ is falsey.
+    #
+    # The contents of the dialog are passed in as a block. An instance of
+    # Booties::Modal will be yielded as a parameter to the block (similar to
+    # the way a FormBuilder works in Rails).
+    #
+    #   <%= modal 'foo' do |m| %>
+    #     <%= m.header do %>
+    #       Nesciunt qui iste vel a.
+    #     <% end %>
+    #     <%= m.body do %>
+    #       <p>
+    #         Autem atque perferendis veritatis. Molestiae aliquid nam
+    #         reiciendis recusandae facere. Aut non nemo dicta.
+    #       </p>
+    #     <% end %>
+    #     <%= m.footer do %>
+    #       <%= m.dismiss class: 'btn btn-default' do %>
+    #         Dismiss
+    #       <% end %>
+    #       <%= link_to @widget, class: 'btn btn-danger', method: :delete do %>
+    #         Really Delete
+    #       <% end %>
+    #     <% end %>
+    #   <% end %>
+    def modal(id, fade: true, with: Modal, &block)
+      with.new(self, id: id, fade: fade).render &block
+    end
+
+    ##
+    # Renders a panel. The defult panel context is +:default+ but can be
+    # specified through +options+. The contents of the panel should be passed
+    # in as a block. An instance of the Booties::Panel will be yielded as a
+    # parameter to the block (similar to the way a FormBuilder works in Rails).
+    #
+    #   <%= panel do |p| %>
+    #     <%= p.heading do %>
+    #       <%= p.title 'Consequatur quibusdam quia vel et sed in.' %>
+    #     <% end %>
+    #     <%= p.body do %>
+    #       <p>
+    #         Est fuga iste reiciendis laudantium dicta. Perspiciatis vero ut
+    #         autem quod vel modi. Ea error omnis aliquam aut est.
+    #       </p>
+    #     <% end %>
+    #     <%= p.footer do %>
+    #       Voluptatibus rerum et est quo dicta perspiciatis.
+    #     <% end %>
+    #   <% end %>
+    def panel(with: Panel, **options, &block)
+      with.new(self, **options).render &block
+    end
   end
 end

data/lib/booties.rb

@@ -1,4 +1,9 @@
-require "booties/engine"
+require 'booties/engine'
+require 'booties/modal'
+require 'booties/panel'
 
 module Booties
+  def self.merge_classes(a, b)
+    Array(a).flat_map(&:split) | Array(b).flat_map(&:split)
+  end
 end

data/lib/booties/modal.rb

@@ -0,0 +1,104 @@
+require 'forwardable'
+
+module Booties
+  class Modal
+    extend Forwardable
+
+    ##
+    # Instantiates a new Modal. Several helper methods like #content_tag will
+    # be delegated to +view_context+. The required keyword +id+ will be used as
+    # the DOM ID of the modal element. By default, the modal will exhibit
+    # fading behavior, but this can be disabled by setting +fade+ to a falsey
+    # value.
+    #
+    # TODO: Pass additional arguments as attributes to top-level div.
+    def initialize(view_context, id:, fade: true)
+      @view_context = view_context
+      @id           = id
+      @fade         = fade ? 'fade' : nil
+    end
+
+    def_delegators :@view_context, :button_tag, :capture, :content_tag,
+      :raw, :t, :translate
+
+    ##
+    # Renders the top-level div for the modal dialog. +block+ is passed to
+    # #dialog to fill in the content of the modal. +@id+ is used as the DOM ID
+    # of the modal. +@fade+ is used to include or exclude fading behavior.
+    def render(&block)
+      content_tag :div, class: ['modal', @fade], id: @id do
+        dialog &block
+      end
+    end
+
+    ##
+    # Renders the dialog section of the modal. +block+ is passed to #content to
+    # fill in the content of the dialog.
+    def dialog(&block)
+      content_tag :div, class: 'modal-dialog' do
+        content &block
+      end
+    end
+
+    ##
+    # Renders the content section of the modal. The content of the dialog is
+    # captured from +block+. The Modal object will be passed as a paramter to
+    # +block+.
+    def content(&block)
+      content_tag :div, class: 'modal-content' do
+        capture self, &block
+      end
+    end
+
+    ##
+    # Renders the header section of a modal. +block+ is passed to #title to
+    # render the title. In addition to the title, a dismissal button will be
+    # rendered. The content of the dismissal button is localized. It will look
+    # for +booties.modal.dismiss_html+. If that translation does not exist it
+    # will look for +booties.modal.dismiss+. If that does not exist either, it
+    # will default to the HTML times entity +×+.
+    def header(&block)
+      dismissal = t :'booties.modal.dismiss_html',
+        default: [:'booties.modal.dismiss', raw('×')]
+      content_tag :div, class: 'modal-header' do
+        dismiss(dismissal) << title(&block)
+      end
+    end
+
+    ##
+    # Renders the main body of the modal. The content of the section is
+    # captured from +block+.
+    def body(&block)
+      content_tag :div, capture(&block), class: 'modal-body'
+    end
+
+    ##
+    # Renders the footer of the modal. The content of the section is captured
+    # from +block+.
+    def footer(&block)
+      content_tag :div, capture(&block), class: 'modal-footer'
+    end
+
+    ##
+    # Renders the title of the modal. The content can be passed through the
+    # +content+ parameter. Otherwise it will be captured from +block+.
+    #
+    # #title is called automatically from #header.
+    def title(content = nil, &block)
+      content ||= capture &block
+      content_tag :h4, content, class: 'modal-title'
+    end
+
+    ##
+    # Renders a button for dismissing the modal. The label can be passed in
+    # through the +content+ parameter. Otherwise, it will be captured from
+    # +block+. Additional HTML attributes for the button can be passed in
+    # through +options+.
+    def dismiss(content = nil, **options, &block)
+      content ||= capture &block
+      options[:class] ||= 'close'
+      options.update data: { dismiss: 'modal' }, type: 'button'
+      button_tag content, options
+    end
+  end
+end

data/lib/booties/panel.rb

@@ -0,0 +1,66 @@
+require 'forwardable'
+
+module Booties
+  class Panel
+    extend Forwardable
+
+    ##
+    # Instantiates a new Panel. Several helper methods like #content_tag will
+    # be delegated to +view_context+. The optional +context+ argument can be
+    # passed in to specify the panel context. +context+ defaults to +:default+.
+    # Any additional options will be included as attributes on the top-level
+    # panel div.
+    def initialize(view_context, context: :default, **options)
+      @view_context = view_context
+      @context      = context
+      @options      = options
+    end
+
+    def_delegators :@view_context, :capture, :content_tag
+
+    ##
+    # Renders the top-level div for the panel. +@context+ is used to specify
+    # the panel's context. The content is captured from +block+. The Panel
+    # object will be passed as a parameter to +block+.
+    def render(&block)
+      options = @options.dup
+      classes = Booties.merge_classes %W[panel panel-#@context],
+        options.delete(:class)
+      content_tag :div, class: classes, **options do
+        capture self, &block
+      end
+    end
+
+    ##
+    # Renders the panel heading. The content of the heading can be passed in
+    # through the +content+ parameter or as a block.
+    def heading(content = nil, &block)
+      content ||= capture &block
+      content_tag :div, content, class: 'panel-heading'
+    end
+
+    ##
+    # Renders the panel title. The content of the title can be passed in
+    # through the +content+ paramter or as a block.
+    def title(content = nil, &block)
+      content ||= capture &block
+      content_tag :h3, content, class: 'panel-title'
+    end
+
+    ##
+    # Renders the panel body. The content of the body can be passed in through
+    # the +content+ parameter or as a block.
+    def body(content = nil, &block)
+      content ||= capture &block
+      content_tag :div, content, class: 'panel-body'
+    end
+
+    ##
+    # Renders the panel footer. The content of the footer can be passed in
+    # through the +content+ parameter or as a block.
+    def footer(content = nil, &block)
+      content ||= capture &block
+      content_tag :div, content, class: 'panel-footer'
+    end
+  end
+end

data/lib/booties/version.rb

@@ -1,3 +1,3 @@
 module Booties
-  VERSION = "0.0.1"
+  VERSION = "0.0.2"
 end

data/lib/booties_test.rb

@@ -0,0 +1,11 @@
+require 'test_helper'
+
+class TestBooties < Minitest::Test
+  def test_merge_classes_removes_duplicates
+    assert_equal %w[a b c], Booties.merge_classes(%w[a b], %w[b c])
+  end
+
+  def test_merge_classes_converts_string_arguments_to_arrays
+    assert_equal %w[a b c], Booties.merge_classes('a b', 'b c')
+  end
+end

data/test/booties/modal_test.rb

@@ -0,0 +1,136 @@
+require 'test_helper'
+require 'stub_view'
+
+module Booties
+  class ModalTest < Minitest::Test
+    def setup
+      @view_context = StubView.new
+      @backend      = I18n.backend
+      I18n.backend  = I18n::Backend::KeyValue.new({})
+      I18n.enforce_available_locales = false
+    end
+
+    def teardown
+      I18n.backend  = @backend
+    end
+
+    def test_render_renders_a_fading_modal_with_an_id_and_a_dialog
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<div class="modal fade" id="foo"><div class="modal-dialog">' \
+        '<div class="modal-content"></div></div></div>'
+      assert_equal expected, modal.render {}
+    end
+
+    def test_render_renders_a_non_fading_modal_when_fade_is_falsey
+      modal = Modal.new @view_context, id: 'foo', fade: false
+      expected = '<div class="modal" id="foo"><div class="modal-dialog">' \
+        '<div class="modal-content"></div></div></div>'
+      assert_equal expected, modal.render {}
+    end
+
+    def test_dialog_renders_a_modal_dialog_with_a_modal_content
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<div class="modal-dialog"><div class="modal-content">' \
+        '</div></div>'
+      assert_equal expected, modal.dialog {}
+    end
+
+    def test_content_renders_a_modal_content
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<div class="modal-content"></div>'
+      assert_equal expected, modal.content {}
+    end
+
+    def test_content_yields_modal_to_block
+      modal = Modal.new @view_context, id: 'foo'
+      yielded_modal = nil
+      modal.content do |m|
+        yielded_modal = m
+      end
+      assert_same modal, yielded_modal
+    end
+
+    def test_header_renders_a_modal_header_with_a_title_and_a_dismissal
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<div class="modal-header">' \
+        '<button class="close" data-dismiss="modal" type="button">&times;' \
+        '</button><h4 class="modal-title">content</h4></div>'
+      assert_equal expected, modal.header { 'content' }
+    end
+
+    def test_header_translates_html_dismissals
+      icon = '<span class="glyphicon glyphicon-remove" aria-label="Dismiss"></span>'
+      translations = {}
+      I18n.backend = I18n::Backend::KeyValue.new translations
+      I18n.backend.store_translations I18n.locale,
+        { booties: { modal: { dismiss_html: icon } } }
+
+      modal = Modal.new @view_context, id: 'foo'
+      expected = %r{<button class="close" data-dismiss="modal" type="button">#{icon}</button>}
+      assert_match expected, modal.header { 'content' }
+    end
+
+    def test_header_translates_non_html_dismissals
+      translations = {}
+      I18n.backend = I18n::Backend::KeyValue.new translations
+      I18n.backend.store_translations I18n.locale,
+        { booties: { modal: { dismiss: 'close' } } }
+
+      modal = Modal.new @view_context, id: 'foo'
+      expected = %r{<button class="close" data-dismiss="modal" type="button">close</button>}
+      assert_match expected, modal.header { 'content' }
+    end
+
+    def test_body_renders_a_modal_body
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<div class="modal-body">content</div>'
+      assert_equal expected, modal.body { 'content' }
+    end
+
+    def test_footer_renders_a_modal_footer
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<div class="modal-footer">content</div>'
+      assert_equal expected, modal.footer { 'content' }
+    end
+
+    def test_title_renders_a_modal_title
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<h4 class="modal-title">content</h4>'
+      assert_equal expected, modal.title('content')
+    end
+
+    def test_title_accepts_content_as_a_block
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<h4 class="modal-title">content</h4>'
+      assert_equal expected, modal.title { 'content' }
+    end
+
+    def test_dismiss_renders_a_dismiss_button
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<button class="close" data-dismiss="modal" type="button">' \
+        'content</button>'
+      assert_equal expected, modal.dismiss('content')
+    end
+
+    def test_dismiss_accepts_content_as_a_block
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<button class="close" data-dismiss="modal" type="button">' \
+        'content</button>'
+      assert_equal expected, modal.dismiss { 'content' }
+    end
+
+    def test_dismiss_accepts_custom_class
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<button class="btn btn-default" data-dismiss="modal"' \
+       ' type="button">content</button>'
+      assert_equal expected, modal.dismiss('content', class: 'btn btn-default')
+    end
+
+    def test_dismiss_accepts_custom_class_and_block
+      modal = Modal.new @view_context, id: 'foo'
+      expected = '<button class="btn btn-default" data-dismiss="modal"' \
+       ' type="button">content</button>'
+      assert_equal expected, modal.dismiss(class: 'btn btn-default') { 'content' }
+    end
+  end
+end