From 413c7c6c33c1b9d98ecce9e6ebb687e04cac0835 Mon Sep 17 00:00:00 2001 From: Ian Lyttle Date: Sun, 5 Feb 2017 12:12:54 -0600 Subject: [PATCH 1/4] adds vignette --- vignettes/general_accordion_sidebar.Rmd | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 vignettes/general_accordion_sidebar.Rmd diff --git a/vignettes/general_accordion_sidebar.Rmd b/vignettes/general_accordion_sidebar.Rmd new file mode 100644 index 0000000..f6eacef --- /dev/null +++ b/vignettes/general_accordion_sidebar.Rmd @@ -0,0 +1,7 @@ +--- +title: "Generalized Accordion Sidebar" +author: "Vignette Author" +date: "`r Sys.Date()`" +output: rmarkdown::html_vignette +--- + From 24be00a4c108595c062b43867371e3466872e357 Mon Sep 17 00:00:00 2001 From: Ian Lyttle Date: Sun, 5 Feb 2017 12:14:30 -0600 Subject: [PATCH 2/4] adds vignette to pkgdown index --- _pkgdown.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/_pkgdown.yml b/_pkgdown.yml index cdba3b3..21243f3 100644 --- a/_pkgdown.yml +++ b/_pkgdown.yml @@ -116,6 +116,7 @@ articles: - collapse - accordion - accordion_sidebar + - general_accordion_sidebar - tooltip_popover - modal - carousel From 43929ca520b02f6fed085f3ad67597b534a9582f Mon Sep 17 00:00:00 2001 From: Ian Lyttle Date: Sun, 5 Feb 2017 13:02:05 -0600 Subject: [PATCH 3/4] reconstitutes pkgdown site with new article --- DESCRIPTION | 2 +- NAMESPACE | 38 --- docs/articles/accordion.html | 56 ++-- docs/articles/accordion_sidebar.html | 68 ++--- docs/articles/carousel.html | 48 ++-- docs/articles/collapse.html | 14 +- docs/articles/general_accordion_sidebar.html | 259 +++++++++++++++++++ docs/articles/index.html | 3 +- docs/articles/modal.html | 22 +- docs/articles/overview.html | 132 +++++----- docs/articles/shiny_help_links.html | 16 +- docs/articles/tooltip_popover.html | 14 +- docs/index.html | 34 +-- docs/news/index.html | 14 +- docs/reference/index.html | 68 +---- man/bs_accordion.Rd | 74 ------ man/bs_accordion_sidebar.Rd | 104 -------- man/bs_append.Rd | 31 --- man/bs_attr.Rd | 35 --- man/bs_carousel.Rd | 69 ----- man/bs_carousel_caption.Rd | 23 -- man/bs_carousel_image.Rd | 26 -- man/bs_collapse.Rd | 73 ------ man/bs_embed_popover.Rd | 50 ---- man/bs_embed_tooltip.Rd | 45 ---- man/bs_modal.Rd | 90 ------- man/bs_set_data.Rd | 62 ----- man/bs_set_opts.Rd | 30 --- man/pipe.Rd | 13 - man/render_html_fragment.Rd | 36 --- man/shinyInput_label_embed.Rd | 42 --- man/shiny_iconlink.Rd | 35 --- vignettes/general_accordion_sidebar.Rmd | 66 ++++- 33 files changed, 542 insertions(+), 1150 deletions(-) create mode 100644 docs/articles/general_accordion_sidebar.html delete mode 100644 man/bs_accordion.Rd delete mode 100644 man/bs_accordion_sidebar.Rd delete mode 100644 man/bs_append.Rd delete mode 100644 man/bs_attr.Rd delete mode 100644 man/bs_carousel.Rd delete mode 100644 man/bs_carousel_caption.Rd delete mode 100644 man/bs_carousel_image.Rd delete mode 100644 man/bs_collapse.Rd delete mode 100644 man/bs_embed_popover.Rd delete mode 100644 man/bs_embed_tooltip.Rd delete mode 100644 man/bs_modal.Rd delete mode 100644 man/bs_set_data.Rd delete mode 100644 man/bs_set_opts.Rd delete mode 100644 man/pipe.Rd delete mode 100644 man/render_html_fragment.Rd delete mode 100644 man/shinyInput_label_embed.Rd delete mode 100644 man/shiny_iconlink.Rd diff --git a/DESCRIPTION b/DESCRIPTION index 5636635..44402e2 100644 --- a/DESCRIPTION +++ b/DESCRIPTION @@ -31,7 +31,7 @@ Imports: methods URL: https://github.com/ijlyttle/bsplus BugReports: https://github.com/ijlyttle/bsplus/issues -RoxygenNote: 5.0.1 +RoxygenNote: 6.0.0 Suggests: testthat, shiny, covr, diff --git a/NAMESPACE b/NAMESPACE index 85c8998..6ae9268 100644 --- a/NAMESPACE +++ b/NAMESPACE @@ -1,40 +1,2 @@ # Generated by roxygen2: do not edit by hand -S3method(bs_append,bsplus_accordion) -S3method(bs_append,bsplus_accordion_sidebar) -S3method(bs_append,bsplus_carousel) -S3method(bs_append,default) -S3method(bs_append,shiny.tag) -S3method(bs_set_opts,bsplus_accordion) -S3method(bs_set_opts,bsplus_accordion_sidebar) -S3method(bs_set_opts,default) -S3method(bs_set_opts,shiny.tag) -export("%>%") -export(bs_accordion) -export(bs_accordion_sidebar) -export(bs_append) -export(bs_attach_collapse) -export(bs_attach_modal) -export(bs_attr) -export(bs_attr.default) -export(bs_attr.logical) -export(bs_carousel) -export(bs_carousel_caption) -export(bs_carousel_image) -export(bs_collapse) -export(bs_embed_popover) -export(bs_embed_tooltip) -export(bs_modal) -export(bs_modal_closebutton) -export(bs_set_aria) -export(bs_set_data) -export(bs_set_opts) -export(render_html_fragment) -export(shinyInput_label_embed) -export(shiny_iconlink) -export(use_bs_accordion_sidebar) -export(use_bs_popover) -export(use_bs_tooltip) -exportMethods(bs_attr) -importClassesFrom(lubridate,Duration) -importFrom(magrittr,"%>%") diff --git a/docs/articles/accordion.html b/docs/articles/accordion.html index 96b3487..6de949e 100644 --- a/docs/articles/accordion.html +++ b/docs/articles/accordion.html @@ -41,7 +41,7 @@

Accordion

Ian Lyttle

-

2017-01-26

+

2017-02-05

@@ -49,23 +49,23 @@

2017-01-26

library("htmltools")
 library("bsplus")
-

The bs_accordion() family is an extension of the bs_collapse() family. An accordion is a set of collapsible panels constructed such that one panel, at most, is open at a time.

+

The bs_accordion() family is an extension of the bs_collapse() family. An accordion is a set of collapsible panels constructed such that one panel, at most, is open at a time.

There are three functions in this family:

-
  • bs_accordion(), used to establish the accordion framework
    • -
  • bs_append(), used to add a panel (title and content) to the accordion
    • -
  • bs_set_opts(), used to set options for the panels to follow
    • -

The bs_accordion() function takes a single argument, a unique id for the accordion frameowrk.

-

To add a panel to an accordion, use the bs_append() function. Its arguments are the tag of the accordion, the title of the panel, which will generally be text, and the content of the panel, which can be HTML.

-

The appearance of panels can be modified using the bs_set_opts() function. Its first argument is the accordion tag, its other arguments are panel_type, which controls the appearance of following panels, and use_heading_link, which, if TRUE, makes the entire headings of following panels of into links, rather than just the title.

+
  • bs_accordion(), used to establish the accordion framework
    • +
  • bs_append(), used to add a panel (title and content) to the accordion
    • +
  • bs_set_opts(), used to set options for the panels to follow
    • +

The bs_accordion() function takes a single argument, a unique id for the accordion frameowrk.

+

To add a panel to an accordion, use the bs_append() function. Its arguments are the tag of the accordion, the title of the panel, which will generally be text, and the content of the panel, which can be HTML.

+

The appearance of panels can be modified using the bs_set_opts() function. Its first argument is the accordion tag, its other arguments are panel_type, which controls the appearance of following panels, and use_heading_link, which, if TRUE, makes the entire headings of following panels of into links, rather than just the title.

The default panel_type is "default", the default for use_heading_link is FALSE.

All of these functions return an accordion tag; thus, you can build an accordion using a pipe.

-
bs_accordion(id = "beatles") %>%
-  bs_set_opts(panel_type = "success", use_heading_link = TRUE) %>%
-  bs_append(title = "John Lennon", content = "Rhythm guitar, vocals") %>%
-  bs_append(title = "Paul McCartney", content = "Bass guitar, vocals") %>%
-  bs_append(title = "George Harrison", content = "Lead guitar, vocals") %>%
-  bs_set_opts(panel_type = "info") %>%
-  bs_append(title = "Ringo Starr", content = "Drums, vocals")
+
bs_accordion(id = "beatles") %>%
+  bs_set_opts(panel_type = "success", use_heading_link = TRUE) %>%
+  bs_append(title = "John Lennon", content = "Rhythm guitar, vocals") %>%
+  bs_append(title = "Paul McCartney", content = "Bass guitar, vocals") %>%
+  bs_append(title = "George Harrison", content = "Lead guitar, vocals") %>%
+  bs_set_opts(panel_type = "info") %>%
+  bs_append(title = "Ringo Starr", content = "Drums, vocals")

The panel_type has to be one of the standard Bootstrap types: c("default", "primary", "success", "info", "warning", "danger").

-
bs_accordion(id = "bootstrap_types") %>%
-  bs_set_opts(panel_type = "default") %>%
-  bs_append(title = "Default", content = NULL) %>%
-  bs_set_opts(panel_type = "primary") %>%
-  bs_append(title = "Primary", content = NULL) %>%
-  bs_set_opts(panel_type = "success") %>%
-  bs_append(title = "Success", content = NULL) %>%
-  bs_set_opts(panel_type = "info") %>%
-  bs_append(title = "Info", content = NULL) %>%
-  bs_set_opts(panel_type = "warning") %>%
-  bs_append(title = "Warning", content = NULL) %>%
-  bs_set_opts(panel_type = "danger") %>%
-  bs_append(title = "Danger", content = NULL)
+
bs_accordion(id = "bootstrap_types") %>%
+  bs_set_opts(panel_type = "default") %>%
+  bs_append(title = "Default", content = NULL) %>%
+  bs_set_opts(panel_type = "primary") %>%
+  bs_append(title = "Primary", content = NULL) %>%
+  bs_set_opts(panel_type = "success") %>%
+  bs_append(title = "Success", content = NULL) %>%
+  bs_set_opts(panel_type = "info") %>%
+  bs_append(title = "Info", content = NULL) %>%
+  bs_set_opts(panel_type = "warning") %>%
+  bs_append(title = "Warning", content = NULL) %>%
+  bs_set_opts(panel_type = "danger") %>%
+  bs_append(title = "Danger", content = NULL)
@@ -49,33 +49,33 @@

2017-01-26

library("htmltools")
 library("bsplus")
-

An accordion-sidebar can be useful to provide another dimension for your shiny apps. For example, you can use shiny navbarPage() for major groupings, then bs_accordion_sidebar() panels for minor groupings within each major grouping.

+

An accordion-sidebar can be useful to provide another dimension for your shiny apps. For example, you can use shiny navbarPage() for major groupings, then bs_accordion_sidebar() panels for minor groupings within each major grouping.

There are three functions in this family:

-
  • bs_accordion_sidebar(), used to establish the accordion-sidebar framework
    • -
  • bs_append(), used to add a side panel (title_side and content_side) and a main panel (content_main) to the accordion sidebar
    • -
  • bs_set_opts(), used to set options for the panel-sets to follow
    • -

The bs_accordion_sidebar() function is used to instantiate the accordion sidebar. Its argument, are a unique id, Boostrap column-specifications spec_side and spec_main, and an indication of the relative position of the side panel to the main panel.

-

To add a panel set to an accordion sidebar, use the bs_append() function. Its arguments are the tag of the accordion sidebar, the title_side of the side panel, which will generally be text, the content_side of the side panel, which can be HTML (might be shiny inputs), and the content_main of the main panel, which can also be HTML (might be shiny outputs).

-

The appearance of panel sets can be modified using the bs_set_opts() function. Its first argument is the accordion sidebar tag, its other arguments are panel_type_active and panel_type_inactive, which control the appearance of following panels, and use_main_enclosure, which, if TRUE, encloses the content of the main panel in an HTML <panel/>.

+
  • bs_accordion_sidebar(), used to establish the accordion-sidebar framework
    • +
  • bs_append(), used to add a side panel (title_side and content_side) and a main panel (content_main) to the accordion sidebar
    • +
  • bs_set_opts(), used to set options for the panel-sets to follow
    • +

The bs_accordion_sidebar() function is used to instantiate the accordion sidebar. Its argument, are a unique id, Boostrap column-specifications spec_side and spec_main, and an indication of the relative position of the side panel to the main panel.

+

To add a panel set to an accordion sidebar, use the bs_append() function. Its arguments are the tag of the accordion sidebar, the title_side of the side panel, which will generally be text, the content_side of the side panel, which can be HTML (might be shiny inputs), and the content_main of the main panel, which can also be HTML (might be shiny outputs).

+

The appearance of panel sets can be modified using the bs_set_opts() function. Its first argument is the accordion sidebar tag, its other arguments are panel_type_active and panel_type_inactive, which control the appearance of following panels, and use_main_enclosure, which, if TRUE, encloses the content of the main panel in an HTML <panel/>.

The default panel_type_active is "success", for panel_type_inactive it is "primary", the default for use_main_enclosure is TRUE.

All of these functions return an accordion tag; thus, you can build an accordion sidebar using a pipe.

-
bs_accordion_sidebar(id = "beatles") %>%
-  bs_append(
+
bs_accordion_sidebar(id = "beatles") %>%
+  bs_append(
     title_side = "John Lennon", 
     content_side = "Rhythm guitar, vocals",
     content_main = "Dear Prudence"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Paul McCartney", 
     content_side = "Bass guitar, vocals",
     content_main = "Blackbird"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "George Harrison", 
     content_side = "Lead guitar, vocals",
     content_main = "While My Guitar Gently Weeps"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Ringo Starr", 
     content_side = "Drums, vocals",
     content_main = "Don't Pass Me By"
@@ -140,70 +140,70 @@
-

As you can see, the sidebar acts like a bs_accordion(), but there are a couple of important differences. First, a sidebar panel’s class changes according to its being open or not. Second, the state (show-hide) of each component’s main panel is determined by the state of its side panel.

+

As you can see, the sidebar acts like a bs_accordion(), but there are a couple of important differences. First, a sidebar panel’s class changes according to its being open or not. Second, the state (show-hide) of each component’s main panel is determined by the state of its side panel.

When showing him a preview of this work, Carson Sievert asked a crazy question, “can you nest those things?” Well, apparently you can.

Note that the outer accordion-sidebar has use_main_enclosure set to FALSE, while each inner accordion-sidebar has it set to TRUE.

-
bs_accordion_sidebar(id = "the_beatles") %>%
-  bs_set_opts(use_main_enclosure = FALSE) %>%
-  bs_append(
+
bs_accordion_sidebar(id = "the_beatles") %>%
+  bs_set_opts(use_main_enclosure = FALSE) %>%
+  bs_append(
     title_side = "John Lennon", 
     content_side = NULL,
     content_main = 
-      bs_accordion_sidebar(id = "john") %>%
-      bs_append(
+      bs_accordion_sidebar(id = "john") %>%
+      bs_append(
         title_side = "Beatles",
         content_side = "1960-1969",
         content_main = "Help!"
       ) %>%
-      bs_append(
+      bs_append(
         title_side = "Solo",
         content_side = "1968-1980",
         content_main = "Love"
       )
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Paul McCartney", 
     content_side = NULL,
     content_main =
-      bs_accordion_sidebar(id = "paul") %>%
-      bs_append(
+      bs_accordion_sidebar(id = "paul") %>%
+      bs_append(
         title_side = "Beatles",
         content_side = "1960-1970",
         content_main = "Yesterday"
       ) %>%
-      bs_append(
+      bs_append(
         title_side = "Solo",
         content_side = "1970-",
         content_main = "Maybe I'm Amazed"
       )
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "George Harrison", 
     content_side = NULL,
     content_main = 
-      bs_accordion_sidebar(id = "george") %>%
-      bs_append(
+      bs_accordion_sidebar(id = "george") %>%
+      bs_append(
         title_side = "Beatles",
         content_side = "1960-1970",
         content_main = "Here Comes the Sun"
       ) %>%
-      bs_append(
+      bs_append(
         title_side = "Solo",
         content_side = "1968-2001",
         content_main = "My Sweet Lord"
       )
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Ringo Starr", 
     content_side = NULL,
     content_main = 
-      bs_accordion_sidebar(id = "ringo") %>%
-      bs_append(
+      bs_accordion_sidebar(id = "ringo") %>%
+      bs_append(
         title_side = "Beatles",
         content_side = "1962-1970",
         content_main = "Octopus' Garden"
       ) %>%
-      bs_append(
+      bs_append(
         title_side = "Solo",
         content_side = "1970-",
         content_main = "Photograph"
@@ -393,8 +393,8 @@
-

To use an accordion sidebar, you will need to insert some JavaScript code into your page using the use_bs_accordion_sidebar() function. You will have to do this only once per page; I have found that it works best to include after all of the accordion-sidebars are defined, perhaps as one of the last elements in a shiny UI.

-
use_bs_accordion_sidebar()
+

To use an accordion sidebar, you will need to insert some JavaScript code into your page using the use_bs_accordion_sidebar() function. You will have to do this only once per page; I have found that it works best to include after all of the accordion-sidebars are defined, perhaps as one of the last elements in a shiny UI.

+
use_bs_accordion_sidebar()
+
+
+ + +
+
+
+

Generalized Accordion Sidebar

+

Ian Lyttle

+ +

2017-02-05

+
+ + + +
+
library("bsplus")
+

Our first task is to see if we can nest accordions. Imagine that this will be what we would see as the sidebar.

+
bs_accordion(id = "beatles") %>%
+  bs_append(
+    title = "John Lennon",
+    content = 
+      bs_accordion(id = "john") %>%
+      bs_append(
+        title = "Beatles",
+        content = "1960-1969"
+      ) %>%
+      bs_append(
+        title = "Solo",
+        content = "1968-1980"
+      ) 
+  ) %>%
+  bs_append(
+    title = "Paul McCartney",
+    content = 
+      bs_accordion(id = "paul") %>%
+      bs_append(
+        title = "Beatles",
+        content = "1960-1970"
+      ) %>%
+      bs_append(
+        title = "Solo",
+        content = "1970-"
+      ) 
+  ) %>%  
+  bs_append(
+    title = "George Harrison",
+    content = 
+      bs_accordion(id = "george") %>%
+      bs_append(
+        title = "Beatles",
+        content = "1960-1970"
+      ) %>%
+      bs_append(
+        title = "Solo",
+        content = "1968-2001"
+      ) 
+  ) %>%
+  bs_append(
+    title = "Ringo Starr",
+    content =
+      bs_accordion(id = "ringo") %>%
+      bs_append(
+        title = "Beatles",
+        content = "1962-1970"
+      ) %>%
+      bs_append(
+        title = "Solo",
+        content = "1970-"
+      ) 
+  )
+
+
+ +
+
+
+
+ +
+
1960-1969
+
+
+
+ +
+
1968-1980
+
+
+
+
+
+
+
+ +
+
+
+
+ +
+
1960-1970
+
+
+
+ +
+
1970-
+
+
+
+
+
+
+
+ +
+
+
+
+ +
+
1960-1970
+
+
+
+ +
+
1968-2001
+
+
+
+
+
+
+
+ +
+
+
+
+ +
+
1962-1970
+
+
+
+ +
+
1970-
+
+
+
+
+
+
+
+

It appears that we can nest accordions!

+
+
+ + + +
+ + +
+

Developed by Ian Lyttle.

+
+ +
+

Site built with pkgdown.

+
+ +
+ + diff --git a/docs/articles/index.html b/docs/articles/index.html index 35c1da5..4e2840a 100644 --- a/docs/articles/index.html +++ b/docs/articles/index.html @@ -75,7 +75,7 @@
-

Vignette reference version 0.1.0

+

Vignette reference version 0.1.0.9000

@@ -97,6 +97,7 @@

Function families

  • Accordion
  • Carousel
  • Collapse
    • +
  • Generalized Accordion Sidebar
  • Modals
  • Shiny-input help links
  • Tooltips and popovers
    • diff --git a/docs/articles/modal.html b/docs/articles/modal.html index 06ac79a..a6237fe 100644 --- a/docs/articles/modal.html +++ b/docs/articles/modal.html @@ -41,7 +41,7 @@

    Modals

    Ian Lyttle

    -

    2017-01-26

    +

    2017-02-05

    @@ -50,7 +50,7 @@

    2017-01-26

    library("htmltools")
 library("bsplus")

    Modal windows are a great way to deliver help-documentation, although they certainly have other uses. The first step is to define a modal widow, giving it an id.

    -
    bs_modal(id = "modal", title = "I'm a modal", body = "Yes, I am.")
    +
    bs_modal(id = "modal", title = "I'm a modal", body = "Yes, I am.")

    To allow activation of the modal window, attach its id to a button (or link).

    tags$button(type = "button", class = "btn btn-default", "Click for modal") %>%
-  bs_attach_modal(id_modal = "modal")
    + bs_attach_modal(id_modal = "modal")

    The verb attach implies that you can attach an id to as many link tags you like. Thus:

    tags$button(type = "button", class = "btn btn-default", "New button, same modal") %>%
-  bs_attach_modal(id_modal = "modal")
    + bs_attach_modal(id_modal = "modal")
    -

    Let’s look at a more-involved example using all of the arguments for bs_modal().

    +

    Let’s look at a more-involved example using all of the arguments for bs_modal().

    In the example above, body is text; usually, you will want the body to HTML. One way to compose the HTML for the body is to write it as a Markdown file, then use the helper function shiny::includeMarkdown() to render it into into HTML.

    -

    The default footer is simply a “Close” button, which is made using the helper function bs_modal_closebutton(). You can compose your own footer, using this function to customize your close-button.

    +

    The default footer is simply a “Close” button, which is made using the helper function bs_modal_closebutton(). You can compose your own footer, using this function to customize your close-button.

    Finally, the size can be "small", "medium", or "large" - the defualt is "medium".

    -
    bs_modal(
+
    bs_modal(
   id = "modal_markdown", 
   title = "Using Markdown",
   body = includeMarkdown(system.file("markdown", "modal.md", package = "bsplus")),
   footer = tags$span(
     tags$span(class = "well", "Hello!"),
-    bs_modal_closebutton("Goodbye!")
+    bs_modal_closebutton("Goodbye!")
   ),
   size = "large"
 )
    
@@ -108,14 +108,14 @@ 
 
    
 
 Hello!
-
+
 
 
    
 
    tags$button(type = "button", class = "btn btn-default", "Large modal") %>%
-  bs_attach_modal(id_modal = "modal_markdown")
    + bs_attach_modal(id_modal = "modal_markdown")

    Reference

    diff --git a/docs/articles/overview.html b/docs/articles/overview.html index 89999ed..2979a17 100644 --- a/docs/articles/overview.html +++ b/docs/articles/overview.html @@ -41,7 +41,7 @@

    Overview

    Ian Lyttle

    -

    2017-01-26

    +

    2017-02-05

    @@ -55,14 +55,14 @@

    2017-01-26

  • popover

  • carousel

    • Another goal is to provide some tools to help build shiny apps.

    - + + + + + +
    @@ -49,33 +68,38 @@

    2017-02-05

    library("htmltools")
 library("bsplus")
    -

    An accordion-sidebar can be useful to provide another dimension for your shiny apps. For example, you can use shiny navbarPage() for major groupings, then bs_accordion_sidebar() panels for minor groupings within each major grouping.

    +

    An accordion-sidebar can be useful to provide another dimension for your shiny apps. For example, you can use shiny navbarPage() for major groupings, then bs_accordion_sidebar() panels for minor groupings within each major grouping.

    There are three functions in this family:

    -
    • bs_accordion_sidebar(), used to establish the accordion-sidebar framework
      • -
    • bs_append(), used to add a side panel (title_side and content_side) and a main panel (content_main) to the accordion sidebar
      • -
    • bs_set_opts(), used to set options for the panel-sets to follow
      • -

    The bs_accordion_sidebar() function is used to instantiate the accordion sidebar. Its argument, are a unique id, Boostrap column-specifications spec_side and spec_main, and an indication of the relative position of the side panel to the main panel.

    -

    To add a panel set to an accordion sidebar, use the bs_append() function. Its arguments are the tag of the accordion sidebar, the title_side of the side panel, which will generally be text, the content_side of the side panel, which can be HTML (might be shiny inputs), and the content_main of the main panel, which can also be HTML (might be shiny outputs).

    -

    The appearance of panel sets can be modified using the bs_set_opts() function. Its first argument is the accordion sidebar tag, its other arguments are panel_type_active and panel_type_inactive, which control the appearance of following panels, and use_main_enclosure, which, if TRUE, encloses the content of the main panel in an HTML <panel/>.

    +
      +
    • +bs_accordion_sidebar(), used to establish the accordion-sidebar framework
      • +
    • +bs_append(), used to add a side panel (title_side and content_side) and a main panel (content_main) to the accordion sidebar
      • +
    • +bs_set_opts(), used to set options for the panel-sets to follow
      • +
    +

    The bs_accordion_sidebar() function is used to instantiate the accordion sidebar. Its argument, are a unique id, Boostrap column-specifications spec_side and spec_main, and an indication of the relative position of the side panel to the main panel.

    +

    To add a panel set to an accordion sidebar, use the bs_append() function. Its arguments are the tag of the accordion sidebar, the title_side of the side panel, which will generally be text, the content_side of the side panel, which can be HTML (might be shiny inputs), and the content_main of the main panel, which can also be HTML (might be shiny outputs).

    +

    The appearance of panel sets can be modified using the bs_set_opts() function. Its first argument is the accordion sidebar tag, its other arguments are panel_type_active and panel_type_inactive, which control the appearance of following panels, and use_main_enclosure, which, if TRUE, encloses the content of the main panel in an HTML <panel/>.

    The default panel_type_active is "success", for panel_type_inactive it is "primary", the default for use_main_enclosure is TRUE.

    All of these functions return an accordion tag; thus, you can build an accordion sidebar using a pipe.

    -
    bs_accordion_sidebar(id = "beatles") %>%
-  bs_append(
+
    bs_accordion_sidebar(id = "beatles") %>%
+  bs_append(
     title_side = "John Lennon", 
     content_side = "Rhythm guitar, vocals",
     content_main = "Dear Prudence"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Paul McCartney", 
     content_side = "Bass guitar, vocals",
     content_main = "Blackbird"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "George Harrison", 
     content_side = "Lead guitar, vocals",
     content_main = "While My Guitar Gently Weeps"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Ringo Starr", 
     content_side = "Drums, vocals",
     content_main = "Don't Pass Me By"
@@ -85,7 +109,8 @@ 
    2017-02-05
    
 
    
 
    
 
 
    
 
    Rhythm guitar, vocals
    
@@ -93,7 +118,8 @@ 
    
 
    
 
 
    
 
    Bass guitar, vocals
    
@@ -101,7 +127,8 @@ 
    
 
    
 
 
    
 
    Lead guitar, vocals
    
@@ -109,7 +136,8 @@ 
    
 
    
 
 
    
 
    Drums, vocals
    
@@ -140,70 +168,70 @@ 
    
 
    
 
    
-
    As you can see, the sidebar acts like a bs_accordion(), but there are a couple of important differences. First, a sidebar panel’s class changes according to its being open or not. Second, the state (show-hide) of each component’s main panel is determined by the state of its side panel.
    
-
    When showing him a preview of this work, Carson Sievert asked a crazy question, “can you nest those things?” Well, apparently you can.
    
+
    As you can see, the sidebar acts like a bs_accordion(), but there are a couple of important differences. First, a sidebar panel’s class changes according to its being open or not. Second, the state (show-hide) of each component’s main panel is determined by the state of its side panel.
    
+
    When showing him a preview of this work, Carson Sievert asked a crazy question, “can you nest those things?” Well, apparently you can.
    
 
    Note that the outer accordion-sidebar has use_main_enclosure set to FALSE, while each inner accordion-sidebar has it set to TRUE.
    
-
    bs_accordion_sidebar(id = "the_beatles") %>%
-  bs_set_opts(use_main_enclosure = FALSE) %>%
-  bs_append(
+
    bs_accordion_sidebar(id = "the_beatles") %>%
+  bs_set_opts(use_main_enclosure = FALSE) %>%
+  bs_append(
     title_side = "John Lennon", 
     content_side = NULL,
     content_main = 
-      bs_accordion_sidebar(id = "john") %>%
-      bs_append(
+      bs_accordion_sidebar(id = "john") %>%
+      bs_append(
         title_side = "Beatles",
         content_side = "1960-1969",
         content_main = "Help!"
       ) %>%
-      bs_append(
+      bs_append(
         title_side = "Solo",
         content_side = "1968-1980",
         content_main = "Love"
       )
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Paul McCartney", 
     content_side = NULL,
     content_main =
-      bs_accordion_sidebar(id = "paul") %>%
-      bs_append(
+      bs_accordion_sidebar(id = "paul") %>%
+      bs_append(
         title_side = "Beatles",
         content_side = "1960-1970",
         content_main = "Yesterday"
       ) %>%
-      bs_append(
+      bs_append(
         title_side = "Solo",
         content_side = "1970-",
         content_main = "Maybe I'm Amazed"
       )
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "George Harrison", 
     content_side = NULL,
     content_main = 
-      bs_accordion_sidebar(id = "george") %>%
-      bs_append(
+      bs_accordion_sidebar(id = "george") %>%
+      bs_append(
         title_side = "Beatles",
         content_side = "1960-1970",
         content_main = "Here Comes the Sun"
       ) %>%
-      bs_append(
+      bs_append(
         title_side = "Solo",
         content_side = "1968-2001",
         content_main = "My Sweet Lord"
       )
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Ringo Starr", 
     content_side = NULL,
     content_main = 
-      bs_accordion_sidebar(id = "ringo") %>%
-      bs_append(
+      bs_accordion_sidebar(id = "ringo") %>%
+      bs_append(
         title_side = "Beatles",
         content_side = "1962-1970",
         content_main = "Octopus' Garden"
       ) %>%
-      bs_append(
+      bs_append(
         title_side = "Solo",
         content_side = "1970-",
         content_main = "Photograph"
@@ -214,7 +242,8 @@ 
    
 
    
 
 
    
 
    
@@ -222,7 +251,8 @@ 
    
 
 
    
 
    
@@ -230,7 +260,8 @@ 
    
 
 
    
 
    
@@ -238,7 +269,8 @@ 
    
 
 
    
 
    
@@ -253,7 +285,8 @@ 
    
 
    
 
 
    
 
    1960-1969
    
@@ -261,7 +294,8 @@ 
    
 
    
 
 
    
 
    1968-1980
    
@@ -289,7 +323,8 @@ 
    
 
    
 
 
    
 
    1960-1970
    
@@ -297,7 +332,8 @@ 
    
 
    
 
 
    
 
    1970-
    
@@ -325,7 +361,8 @@ 
    
 
    
 
 
    
 
    1960-1970
    
@@ -333,7 +370,8 @@ 
    
 
    
 
 
    
 
    1968-2001
    
@@ -361,7 +399,8 @@ 
    
 
    
 
 
    
 
    1962-1970
    
@@ -369,7 +408,8 @@ 
    
 
    
 
 
    
 
    1970-
    
@@ -393,8 +433,8 @@ 
    
 
    
 
    
-
    To use an accordion sidebar, you will need to insert some JavaScript code into your page using the use_bs_accordion_sidebar() function. You will have to do this only once per page; I have found that it works best to include after all of the accordion-sidebars are defined, perhaps as one of the last elements in a shiny UI.
    
-
    use_bs_accordion_sidebar()
    
+
    To use an accordion sidebar, you will need to insert some JavaScript code into your page using the use_bs_accordion_sidebar() function. You will have to do this only once per page; I have found that it works best to include after all of the accordion-sidebars are defined, perhaps as one of the last elements in a shiny UI.
    
+
    use_bs_accordion_sidebar()
    
 
    
+
+
    
   
    
 
   
 
-      
    
+      
+
    
 
-  
+  
+
diff --git a/docs/articles/carousel.html b/docs/articles/carousel.html
index 2306a19..ce529a3 100644
--- a/docs/articles/carousel.html
+++ b/docs/articles/carousel.html
@@ -1,8 +1,20 @@
 
-Carousel • bsplus
+
+
+
+
+
+Carousel • bsplus
+
+
+
+
+
+
+
     
    
       
    
-
    
+      
+
    
+
+  
    
+
+
    
+
 
       
       
    
@@ -50,32 +69,38 @@ 
    2017-02-05
    
 
    library("htmltools")
 library("bsplus")
    
 
    A carousel can be useful to cycle through slides with related content. There like the accordion, there are two main functions:
    
-
    • bs_carousel(), used to establish the carousel framework, with arguments id, use_indicators, for the “dots” indicating the slide, and use_controls, for the directional controls at either side.
      • 
-
    • bs_append(), used to add a slide containing content, which is HTML, and an optional caption.
      • 
-
    The content and caption arguments can be composed using the helper functions bs_carousel_image(), which returs a centered-image tag, and bs_carousel_caption() with text arguments title and body.
    
-
    bs_carousel(id = "the_beatles", use_indicators = TRUE) %>%
-  bs_append(
-    content = bs_carousel_image(src = "img/john.jpg"),
-    caption = bs_carousel_caption("John Lennon", "Rhythm guitar, vocals")
+
      
+
    • 
+bs_carousel(), used to establish the carousel framework, with arguments id, use_indicators, for the “dots” indicating the slide, and use_controls, for the directional controls at either side.
      • 
+
    • 
+bs_append(), used to add a slide containing content, which is HTML, and an optional caption.
      • 
+
    
+
    The content and caption arguments can be composed using the helper functions bs_carousel_image(), which returs a centered-image tag, and bs_carousel_caption() with text arguments title and body.
    
+
    bs_carousel(id = "the_beatles", use_indicators = TRUE) %>%
+  bs_append(
+    content = bs_carousel_image(src = "img/john.jpg"),
+    caption = bs_carousel_caption("John Lennon", "Rhythm guitar, vocals")
   ) %>%
-  bs_append(
-    content = bs_carousel_image(src = "img/paul.jpg"),
-    caption = bs_carousel_caption("Paul McCartney", "Bass guitar, vocals")
+  bs_append(
+    content = bs_carousel_image(src = "img/paul.jpg"),
+    caption = bs_carousel_caption("Paul McCartney", "Bass guitar, vocals")
   ) %>%
-  bs_append(
-    content = bs_carousel_image(src = "img/george.jpg"),
-    caption = bs_carousel_caption("George Harrison", "Lead guitar, vocals")
+  bs_append(
+    content = bs_carousel_image(src = "img/george.jpg"),
+    caption = bs_carousel_caption("George Harrison", "Lead guitar, vocals")
   ) %>%
-  bs_append(
-    content = bs_carousel_image(src = "img/ringo.jpg"),
-    caption = bs_carousel_caption("Ringo Starr", "Drums, vocals")
+  bs_append(
+    content = bs_carousel_image(src = "img/ringo.jpg"),
+    caption = bs_carousel_caption("Ringo Starr", "Drums, vocals")
   ) 
    
 
 
 
@@ -141,7 +172,8 @@ 
    Ringo Starr
    
     
 
    
 
    
-
     Reference
    
+
    
+ Reference
    
 
    For more information, please see the Bootstrap JavaScript page.
    
 
    
 
    
@@ -150,8 +182,10 @@ 
     
         
    
       
    Contents
    
-      
    
+      
+
    
       
    
 
 
    
@@ -165,6 +199,8 @@ 
    Contents
    
   
    Site built with pkgdown.
    
 
    
 
-      
    
+      
+
    
 
-  
+  
+
diff --git a/docs/articles/collapse.html b/docs/articles/collapse.html
index f8fe3c9..0891d80 100644
--- a/docs/articles/collapse.html
+++ b/docs/articles/collapse.html
@@ -1,8 +1,20 @@
 
-Collapse • bsplus
+
+
+
+
+
+Collapse • bsplus
+
+
+
+
+
+
+
     
    
       
    
-
    
+      
+
    
+
+  
    
+
+
    
+
 
       
       
    
@@ -49,25 +68,26 @@ 
    2017-02-05
    
 
    
 
    library("htmltools")
 library("bsplus")
    
-
    The bs_collapse() family of functions may not be the most useful, but it gives us a place to start.
    
-
    The first step is to create (and publish to the page) a collapsible element, using the bs_collapse() function, supplying a unique id and some HTML content.
    
-
    bs_collapse(
+
    The bs_collapse() family of functions may not be the most useful, but it gives us a place to start.
    
+
    The first step is to create (and publish to the page) a collapsible element, using the bs_collapse() function, supplying a unique id and some HTML content.
    
+
    bs_collapse(
   id = "yeah", 
   content = tags$div(class = "well", "Yeah Yeah Yeah")
 )
    
 
    
 
    Yeah Yeah Yeah
    
 
    
-
    Next, attach the id of the collapsible element to a button or link tag, using the bs_attach_collapse() function. This returns a modified copy of the tag sent to it.
    
+
    Next, attach the id of the collapsible element to a button or link tag, using the bs_attach_collapse() function. This returns a modified copy of the tag sent to it.
    
 
    tags$button("She Loves You", class = "btn btn-primary") %>%
-  bs_attach_collapse("yeah")
    
+  bs_attach_collapse("yeah")
    
 
 
    You can attach the id of a collapsible element to as many buttons or links as you like:
    
 
    tags$button("Sie Liebt Dich", class = "btn btn-primary") %>%
-  bs_attach_collapse("yeah")
    
+  bs_attach_collapse("yeah")
    
 
 
    
-
     Reference
    
+
    
+ Reference
    
 
    For more information, please see the Bootstrap JavaScript page.
    
 
    
 
    
@@ -76,8 +96,10 @@ 
     
         
    
       
    Contents
    
-      
    
+      
+
    
       
    
 
 
    
@@ -91,6 +113,8 @@ 
    Contents
    
   
    Site built with pkgdown.
    
 
    
 
-      
    
+      
+
    
 
-  
+  
+
diff --git a/docs/articles/general_accordion_sidebar.html b/docs/articles/general_accordion_sidebar.html
index 9781e21..c088211 100644
--- a/docs/articles/general_accordion_sidebar.html
+++ b/docs/articles/general_accordion_sidebar.html
@@ -1,8 +1,20 @@
 
-Generalized Accordion Sidebar • bsplus
+
+
+
+
+
+Generalized Accordion Sidebar • bsplus
+
+
+
+
+
+
+
     
    
       
    
-
    
+      
+
    
+
+  
    
+
+
    +
    @@ -49,55 +68,55 @@

    2017-02-05

    library("bsplus")

    Our first task is to see if we can nest accordions. Imagine that this will be what we would see as the sidebar.

    -
    bs_accordion(id = "beatles") %>%
-  bs_append(
+
    bs_accordion(id = "beatles") %>%
+  bs_append(
     title = "John Lennon",
     content = 
-      bs_accordion(id = "john") %>%
-      bs_append(
+      bs_accordion(id = "john") %>%
+      bs_append(
         title = "Beatles",
         content = "1960-1969"
       ) %>%
-      bs_append(
+      bs_append(
         title = "Solo",
         content = "1968-1980"
       ) 
   ) %>%
-  bs_append(
+  bs_append(
     title = "Paul McCartney",
     content = 
-      bs_accordion(id = "paul") %>%
-      bs_append(
+      bs_accordion(id = "paul") %>%
+      bs_append(
         title = "Beatles",
         content = "1960-1970"
       ) %>%
-      bs_append(
+      bs_append(
         title = "Solo",
         content = "1970-"
       ) 
   ) %>%  
-  bs_append(
+  bs_append(
     title = "George Harrison",
     content = 
-      bs_accordion(id = "george") %>%
-      bs_append(
+      bs_accordion(id = "george") %>%
+      bs_append(
         title = "Beatles",
         content = "1960-1970"
       ) %>%
-      bs_append(
+      bs_append(
         title = "Solo",
         content = "1968-2001"
       ) 
   ) %>%
-  bs_append(
+  bs_append(
     title = "Ringo Starr",
     content =
-      bs_accordion(id = "ringo") %>%
-      bs_append(
+      bs_accordion(id = "ringo") %>%
+      bs_append(
         title = "Beatles",
         content = "1962-1970"
       ) %>%
-      bs_append(
+      bs_append(
         title = "Solo",
         content = "1970-"
       ) 
@@ -105,7 +124,8 @@ 
    2017-02-05
    
 
    
 
    
 
@@ -114,7 +134,8 @@ 
     <
 
    
 
    
 
@@ -124,7 +145,8 @@ 
     
 
    
 
    
 
@@ -138,7 +160,8 @@ 
     
 
    
 
    
 
@@ -147,7 +170,8 @@ 
     <
 
    
 
    
 
@@ -157,7 +181,8 @@ 
     
 
    
 
    
 
@@ -171,7 +196,8 @@ 
     
 
    
 
    
 
@@ -180,7 +206,8 @@ 
     <
 
    
 
    
 
@@ -190,7 +217,8 @@ 
     
 
    
 
@@ -204,7 +232,8 @@ 
     
 
    
 
@@ -213,7 +242,8 @@ 
     <
 
    
 
    
 
@@ -223,7 +253,8 @@ 
     
 
    
 
@@ -254,6 +285,8 @@ 
     Site built with pkgdown.
    
 
    
 
-      
    
+      
+
    
 
-  
+  
+
diff --git a/docs/articles/modal.html b/docs/articles/modal.html
index a6237fe..13af3ee 100644
--- a/docs/articles/modal.html
+++ b/docs/articles/modal.html
@@ -1,8 +1,20 @@
 
-Modals • bsplus
+
+
+
+
+
+Modals • bsplus
+
+
+
+
+
+
+
     
    
       
    
-
    
+      
+
    
+
+  
    
+
+
    
+
 
       
       
    
@@ -50,42 +69,42 @@ 
    2017-02-05
    
 
    library("htmltools")
 library("bsplus")
    
 
    Modal windows are a great way to deliver help-documentation, although they certainly have other uses. The first step is to define a modal widow, giving it an id.
    
-
    bs_modal(id = "modal", title = "I'm a modal", body = "Yes, I am.")
    
+
    bs_modal(id = "modal", title = "I'm a modal", body = "Yes, I am.")
    
 
 
    To allow activation of the modal window, attach its id to a button (or link).
    
 
    tags$button(type = "button", class = "btn btn-default", "Click for modal") %>%
-  bs_attach_modal(id_modal = "modal")
    
+  bs_attach_modal(id_modal = "modal")
    
 
 
    The verb attach implies that you can attach an id to as many link tags you like. Thus:
    
 
    tags$button(type = "button", class = "btn btn-default", "New button, same modal") %>%
-  bs_attach_modal(id_modal = "modal")
    
+  bs_attach_modal(id_modal = "modal")
    -

    Let’s look at a more-involved example using all of the arguments for bs_modal().

    +

    Let’s look at a more-involved example using all of the arguments for bs_modal().

    In the example above, body is text; usually, you will want the body to HTML. One way to compose the HTML for the body is to write it as a Markdown file, then use the helper function shiny::includeMarkdown() to render it into into HTML.

    -

    The default footer is simply a “Close” button, which is made using the helper function bs_modal_closebutton(). You can compose your own footer, using this function to customize your close-button.

    +

    The default footer is simply a “Close” button, which is made using the helper function bs_modal_closebutton(). You can compose your own footer, using this function to customize your close-button.

    Finally, the size can be "small", "medium", or "large" - the defualt is "medium".

    -
    bs_modal(
+
    bs_modal(
   id = "modal_markdown", 
   title = "Using Markdown",
   body = includeMarkdown(system.file("markdown", "modal.md", package = "bsplus")),
   footer = tags$span(
     tags$span(class = "well", "Hello!"),
-    bs_modal_closebutton("Goodbye!")
+    bs_modal_closebutton("Goodbye!")
   ),
   size = "large"
 )
    
@@ -94,31 +113,35 @@ 
 
    
 
    
 
 
 
    
-
    4th-level headers work well
    
+
    
+
    4th-level headers work well
    
 
 
    We can do our regular Markdown stuff in modal windows.
    
 
-
    • \(F = ma\)
      • 
+
        
+
      • \(F = ma\)
        • 
 
      • \(E = mc^2\)
        • 
-
    
+
+
    
 
    
 
 Hello!
-
+
 
 
    
 
    
 
    tags$button(type = "button", class = "btn btn-default", "Large modal") %>%
-  bs_attach_modal(id_modal = "modal_markdown")
    + bs_attach_modal(id_modal = "modal_markdown")
    -

    Reference

    +

    + Reference

    For more information, please see the Bootstrap JavaScript page.

    @@ -127,8 +150,10 @@

    Contents

    -
    + +

    @@ -142,6 +167,8 @@

    Contents

    Site built with pkgdown.

    - + + - + + diff --git a/docs/articles/overview.html b/docs/articles/overview.html index 2979a17..123f532 100644 --- a/docs/articles/overview.html +++ b/docs/articles/overview.html @@ -1,8 +1,20 @@ -Overview • bsplus + + + + + +Overview • bsplus + + + + + + +
    -
    + + + + + + +
    @@ -48,21 +67,26 @@

    2017-02-05

    One of the goals of bsplus is to provide access to some useful Bootstrap components for rmarkdown html-documents and shiny apps:

    -

    • collapse

      • +

      Another goal is to provide some tools to help build shiny apps.

      -

      • bs_accordion_sidebar(): a framework, much like shiny::navbarPage(), to organize the UI of your shiny apps. For example, please see its article, or this shiny app.

        • -

      • shinyInput_label_embed(), shiny_iconlink(): functions to make it easier to embed help (tooltip, popover, or modal) into a shiny input. For example, please see this shiny app.

        • -

      The philosophy of this package is to allow you to work with Bootstrap JavaScript components using HTML, while smoothing some of the rough edges. Even though some of the functions here are useful only in shiny apps, please note that none of the functions in this package depend on the server side of shiny - only the UI side.

      +
    +

    Another goal is to provide some tools to help build shiny apps.

    + +

    The philosophy of this package is to allow you to work with Bootstrap JavaScript components using HTML, while smoothing some of the rough edges. Even though some of the functions here are useful only in shiny apps, please note that none of the functions in this package depend on the server side of shiny - only the UI side.

    -

    Collapse

    +

    + Collapse

    A collapsible element is attached to a button or link, which is used to show (or hide) the element.

    -

    The first step is to create the collapsible element, using bs_collapse() with an id. By default, this element is initially hidden.

    -
    bs_collapse(
+
    The first step is to create the collapsible element, using bs_collapse() with an id. By default, this element is initially hidden.
    
+
    bs_collapse(
   id = "ex_collapse", 
   content = tags$div(class = "well", "Yeah Yeah Yeah")
 ) 
    
@@ -71,26 +95,32 @@ 
     
 
    Next, you create a tag, like a button, a then attach the id of the collapsible element to it.
    
 
    tags$button(class = "btn btn-primary", "She Loves You") %>%
-  bs_attach_collapse("ex_collapse")
    
+  bs_attach_collapse("ex_collapse")

    To see more of the collapse function-family, please see its article.

    -

    Accordion

    +

    + Accordion

    An accordion is a set of collapsible panels constructed such that one panel, at most, is open at a time.

    There are two main functions:

    -
    • bs_accordion(), used to establish the accordion framework
      • -
    • bs_append(), used to add a panel (title and content) to the accordion.
      • -

    Generally, title will be text, and content can be HTML.

    -
    bs_accordion(id = "meet_the_beatles") %>%
-  bs_append(title = "John", content = "Rhythm guitar, vocals") %>%
-  bs_append(title = "Paul", content = "Bass guitar, vocals") %>%
-  bs_append(title = "George", content = "Lead guitar, vocals") %>%
-  bs_append(title = "Ringo", content = "Drums, vocals")
    +
      +
    • +bs_accordion(), used to establish the accordion framework
      • +
    • +bs_append(), used to add a panel (title and content) to the accordion.
      • +
    +

    Generally, title will be text, and content can be HTML.

    +
    bs_accordion(id = "meet_the_beatles") %>%
+  bs_append(title = "John", content = "Rhythm guitar, vocals") %>%
+  bs_append(title = "Paul", content = "Bass guitar, vocals") %>%
+  bs_append(title = "George", content = "Lead guitar, vocals") %>%
+  bs_append(title = "Ringo", content = "Drums, vocals")
    @@ -100,7 +130,8 @@

    @@ -110,7 +141,8 @@

    @@ -120,7 +152,8 @@

    @@ -129,32 +162,37 @@

    .

    +

    To see more of the bs_accordion() function-family, including how to make the entire banner “clickable” and how to change the class of the panels, please see its article.

    -

    Accordion sidebar

    -

    An accordion-sidebar can be useful to provide another dimension for your shiny apps. For example, you can use shiny navbarPage() for major groupings, then bs_accordion_sidebar() panels for minor groupings within each major grouping.

    +

    + Accordion sidebar

    +

    An accordion-sidebar can be useful to provide another dimension for your shiny apps. For example, you can use shiny navbarPage() for major groupings, then bs_accordion_sidebar() panels for minor groupings within each major grouping.

    There like the accordion, there are two main functions:

    -
    • bs_accordion_sidebar(), used to establish the accordion-sidebar framework
      • -
    • bs_append(), used to add a side panel (title_side and content_side) and a main panel (content_main) to the accordion sidebar
      • -

    Generally, title_side will be text, content_side can be HTML (shiny inputs), as well as content_main (shiny outputs).

    -
    bs_accordion_sidebar(id = "beatles") %>%
-  bs_append(
+
      
+
    • 
+bs_accordion_sidebar(), used to establish the accordion-sidebar framework
      • 
+
    • 
+bs_append(), used to add a side panel (title_side and content_side) and a main panel (content_main) to the accordion sidebar
      • 
+
    
+
    Generally, title_side will be text, content_side can be HTML (shiny inputs), as well as content_main (shiny outputs).
    
+
    bs_accordion_sidebar(id = "beatles") %>%
+  bs_append(
     title_side = "John Lennon", 
     content_side = "Rhythm guitar, vocals",
     content_main = "Dear Prudence"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Paul McCartney", 
     content_side = "Bass guitar, vocals",
     content_main = "Blackbird"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "George Harrison", 
     content_side = "Lead guitar, vocals",
     content_main = "While My Guitar Gently Weeps"
   ) %>%
-  bs_append(
+  bs_append(
     title_side = "Ringo Starr", 
     content_side = "Drums, vocals",
     content_main = "Don't Pass Me By"
@@ -164,7 +202,8 @@ 
     <
 
    
 
    
 
 
    
 
    Rhythm guitar, vocals
    
@@ -172,7 +211,8 @@ 
    
 
    
 
 
    
 
    Bass guitar, vocals
    
@@ -180,7 +220,8 @@ 
    
 
    
 
 
    
 
    Lead guitar, vocals
    
@@ -188,7 +229,8 @@ 
    
 
    
 
 
    
 
    Drums, vocals
    
@@ -219,9 +261,9 @@ 
    
 
    
 
    
-
    As you can see, the sidebar acts like a bs_accordion(), but there are a couple of important differences. First, a sidebar panel’s class changes according to its being open or not. Second, the state (show-hide) of each component’s main panel is determined by the state of its side panel.
    
-
    This extra functionality is implemented using some JavaScript code inserted into your page using the use_bs_accordion_sidebar() function. You will have to do this only once per page; I have found that it works best to include after all of the accordion-sidebars are defined, perhaps as one of the last elements in a shiny UI.
    
-
    use_bs_accordion_sidebar()
    
+
    As you can see, the sidebar acts like a bs_accordion(), but there are a couple of important differences. First, a sidebar panel’s class changes according to its being open or not. Second, the state (show-hide) of each component’s main panel is determined by the state of its side panel.
    
+
    This extra functionality is implemented using some JavaScript code inserted into your page using the use_bs_accordion_sidebar() function. You will have to do this only once per page; I have found that it works best to include after all of the accordion-sidebars are defined, perhaps as one of the last elements in a shiny UI.
    
+
    use_bs_accordion_sidebar()
    
 
    To see more of the bs_accordion_sidebar() function-family, including how to change the active/inactive classes, size and placement of the sidebar and main panels, and formatting of the main panel, please see its article. You can also see this in action in a shiny app.
    
+
    To see more of the bs_accordion_sidebar() function-family, including how to change the active/inactive classes, size and placement of the sidebar and main panels, and formatting of the main panel, please see its article. You can also see this in action in a shiny app.
    
 
    
 
 
    To allow activation of the modal window, attach its id to a button (or link).
    
 
    tags$button(type = "button", class = "btn btn-primary", "Click for modal") %>%
-  bs_attach_modal("modal_markdown")
    
+  bs_attach_modal("modal_markdown")
    
 
 
    The verb attach implies that you can attach an id to as many links you like. Thus:
    
 
    tags$button(type = "button", class = "btn btn-primary", "New button, same modal") %>%
-  bs_attach_modal("modal_markdown")
    
+  bs_attach_modal("modal_markdown")
    -

    To see more of the bs_modal() function-family, including how to specify the size of the modal, please see its article.

    +

    To see more of the bs_modal() function-family, including how to specify the size of the modal, please see its article.

    -

    Tooltip

    +

    + Tooltip

    A tooltip can be used to embed a short note into a tag; by default they are activated by hovering over the tag.

    tags$button(type = "button", class = "btn btn-default", "John Lennon") %>%
-  bs_embed_tooltip(title = "Rhythm Guitar, vocals")
    + bs_embed_tooltip(title = "Rhythm Guitar, vocals")
    -

    According to the Bootstrap site, tooltips are not activated automatically; to activate them you can call use_bs_tooltip() once on your page.

    -
    use_bs_tooltip()
    +

    According to the Bootstrap site, tooltips are not activated automatically; to activate them you can call use_bs_tooltip() once on your page.

    +
    use_bs_tooltip()

    To see more of the bs_embed_tooltip() function, including how to specify the placement of the tooltip, please see its article.

    +});

    To see more of the bs_embed_tooltip() function, including how to specify the placement of the tooltip, please see its article.

    -

    Popover

    +

    + Popover

    A popover can be used to embed a longer note into a tag; by default they are activated by clicking on the tag. A popover has a title, which is generally text, and content, which can be HTML.

    tags$button(type = "button", class = "btn btn-primary", "John Lennon") %>%
-  bs_embed_popover(
+  bs_embed_popover(
     title = "More information",
     content = "Although he wrote \"I Am the Walrus\", 
                he later insisted that the Walrus was Paul."
@@ -369,39 +417,47 @@ 
     
 
 
    According to the Bootstrap site, popovers are not activated automatically; to activate them you can call use_bs_popovers() once on your page.
    
-
    use_bs_popover()
    
+
    use_bs_popover()
    
 
    To see more of the bs_embed_popover() function, including how to specify the placement of the popover, please see its article.
    
+});
    To see more of the bs_embed_popover() function, including how to specify the placement of the popover, please see its article.
    @@ -509,6 +572,8 @@

    Contents

    Site built with pkgdown.

    -
    + + - + + diff --git a/docs/articles/shiny_help_links.html b/docs/articles/shiny_help_links.html index f8c76f6..169afff 100644 --- a/docs/articles/shiny_help_links.html +++ b/docs/articles/shiny_help_links.html @@ -1,8 +1,20 @@ -Shiny-input help links • bsplus + + + + + +Shiny-input help links • bsplus + + + + + + +
    -
    + + + + + + +
    @@ -49,30 +68,35 @@

    2017-02-05

    library("htmltools")
 library("bsplus")
    -

    Let’s consider a shiny input. One way to put unobtrusive help into a shiny input is to embed a help icon into its label, having associated the help icon with the help documentation. This suggests three steps:

    -
    1. Create a help icon. You can use shiny::icon() or shiny_iconlink() (which simply wraps the icon in an HTML link).
      2. -
    2. Associate the help icon with your help documentation. Here, you can use bs_embed_tooltip(), bs_embed_popover() or bs_attach_modal().
      3. -
    3. Embed your help icon into the shiny input. You can use shinyInput_label_embed().
      4. -

    Here’s an example of everything put together:

    +

    Let’s consider a shiny input. One way to put unobtrusive help into a shiny input is to embed a help icon into its label, having associated the help icon with the help documentation. This suggests three steps:

    +
      +
    1. Create a help icon. You can use shiny::icon() or shiny_iconlink() (which simply wraps the icon in an HTML link).
      2. +
    2. Associate the help icon with your help documentation. Here, you can use bs_embed_tooltip(), bs_embed_popover() or bs_attach_modal().
      3. +
    3. Embed your help icon into the shiny input. You can use shinyInput_label_embed().
      4. +
    +

    Here’s an example of everything put together:

    selectInput(
   inputId = "letter",
   label = "Label with popover help",
   choices = c("a", "b", "c")
 ) %>%
-shinyInput_label_embed(
-  shiny_iconlink() %>%
-  bs_embed_popover(
+shinyInput_label_embed(
+  shiny_iconlink() %>%
+  bs_embed_popover(
     title = "Letter", content = "Choose a favorite", placement = "left"
   )
 )
    -

    As of writing, I don’t know how to include operable shiny inputs in an html document, outside of the shiny runtime. To see these functions in action, you can refer to this shiny app, which you can also run locally using:

    +

    As of writing, I don’t know how to include operable shiny inputs in an html document, outside of the shiny runtime. To see these functions in action, you can refer to this shiny app, which you can also run locally using:

    shiny::runApp(system.file("shiny", "tooltip_popover_modal", package = "bsplus"))
    -
    + +

    To promote consistency, the following convention is proposed:

    -
    • For links (activated by clicking), embed a shiny::icon("info-circle"), the default for shiny_iconlink().
      • +
        +
      • For links (activated by clicking), embed a shiny::icon("info-circle"), the default for shiny_iconlink().
      • For elements activated by hovering, embed a shiny::icon("info").
        • -
    + + - + + - + + diff --git a/docs/articles/tooltip_popover.html b/docs/articles/tooltip_popover.html index 8eafa1a..e913198 100644 --- a/docs/articles/tooltip_popover.html +++ b/docs/articles/tooltip_popover.html @@ -1,8 +1,20 @@ -Tooltips and popovers • bsplus + + + + + +Tooltips and popovers • bsplus + + + + + + +
    -
    + + + + + + +
    @@ -51,24 +70,25 @@

    2017-02-05

    library("bsplus")

    Tooltips and popovers are used to add additional content, like short notes. They can be useful for short help-documentation. A tooltip is used to embed a short note into a tag; by default they are activated by hovering over the tag. A popover is used to embed a longer note into a tag; by default they are activated by clicking on the tag. A tooltip has only a text title; a popover has a title, which is generally text, and content, which can be HTML.

    tags$button(type = "button", class = "btn btn-default", "Hover for tooltip") %>%
-  bs_embed_tooltip(title = "I'm a tooltip")
    + bs_embed_tooltip(title = "I'm a tooltip")     
    tags$button(type = "button", class = "btn btn-default", "Click for popover") %>%
-  bs_embed_popover(title = "I'm a popover", content = "Really!")
    + bs_embed_popover(title = "I'm a popover", content = "Really!")

    Both of these functions have an additional argument, placement, which defaults to "top", following the Bootstrap default. The possible values are c("top", "bottom", "left", "right", "auto").

    tags$button(type = "button", class = "btn btn-default", "Another tooltip") %>%
-  bs_embed_tooltip(title = "I'm on the right", placement = "right")
    + bs_embed_tooltip(title = "I'm on the right", placement = "right") -

    Tooltips and popovers are not activted by default in Bootstrap. For either of them to work properly, you will have to activate them on your page, using the use_bs_tooltip() or use_bs_popover() functions. For each page you write, you will need to call each function once, at most.

    -
    use_bs_tooltip()
    +

    Tooltips and popovers are not activted by default in Bootstrap. For either of them to work properly, you will have to activate them on your page, using the use_bs_tooltip() or use_bs_popover() functions. For each page you write, you will need to call each function once, at most.

    +
    use_bs_tooltip()
    use_bs_popover()
    +});
    use_bs_popover()
    -

    Reference

    +

    + Reference

    For more information, please see the Bootstrap JavaScript page on tooltips or popovers.

    @@ -77,8 +97,10 @@

    Contents

    -
    + + @@ -92,6 +114,8 @@

    Contents

    Site built with pkgdown.

    - + + - + + diff --git a/docs/index.html b/docs/index.html index 8645ab0..8358e73 100644 --- a/docs/index.html +++ b/docs/index.html @@ -1,8 +1,20 @@ -Adds Functionality to the R Markdown + Shiny Bootstrap Framework • bsplus + + + + + +Adds Functionality to the R Markdown + Shiny Bootstrap Framework • bsplus + + + + + + +
    -
    + + + + + + +
    -

    bsplus

    +

    + bsplus

    @@ -53,13 +73,15 @@

    Introduction

    -

    To see all of this in action, you are referred to the overview article at this package’s pkgdown site.

    +

    To see all of this in action, you are referred to the overview article at this package’s pkgdown site.

    The goals of this package are:

    -
    • to provide a framework to use Bootstrap’s JavaScript-markup API: http://getbootstrap.com/javascript/ +
        +
      • to provide a framework to use Bootstrap’s JavaScript-markup API: http://getbootstrap.com/javascript/
      • to provide functions that work for both rmarkdown HTML documents and for shiny apps - the only exceptions are some functions that work with only the UI side of shiny.
      • to promote composition of HTML using pipes.
        • -
      +
    +

    Highlights

    @@ -75,44 +97,50 @@

    Function families

    In this package, there are function families for:

    -
    + +

    Grammar and vocabulary

    One of the goals of this package is to implement consistent grammar and vocabulary. To keep the namespace clean(er), many of the functions have the prefix bs_.

    -

    Let’s start with the conventions used to name the functions:

    -

    • bs_noun(), used to create a tag. For example, use bs_accordion() to create an accordion panel-set.

      • -

    • bs_verb(tag, ...), used to take an action on a tag. For example, use bs_append() to append a panel to an accordion panel-set.

      • -

    • bs_verb_noun(tag, ...) used to take an action on a tag using a thing. For example, use bs_embed_tooltip() to embed a tooltip into a tag.

      • -

    • use_bs_noun() used to add a bit of Javascript to your HTML, just like the shinyjs function useShinyJS(). This is necessary for bs_accordion_sidebar(), bs_embed_tooltip(), or bs_embed_popover() to work properly.

      • -
    +

    Let’s start with the conventions used to name the functions:

    +
      +

    • bs_noun(), used to create a tag. For example, use bs_accordion() to create an accordion panel-set.

      • +

    • bs_verb(tag, ...), used to take an action on a tag. For example, use bs_append() to append a panel to an accordion panel-set.

      • +

    • bs_verb_noun(tag, ...) used to take an action on a tag using a thing. For example, use bs_embed_tooltip() to embed a tooltip into a tag.

      • +

    • use_bs_noun() used to add a bit of Javascript to your HTML, just like the shinyjs function useShinyJS(). This is necessary for bs_accordion_sidebar(), bs_embed_tooltip(), or bs_embed_popover() to work properly.

      • +
    +

    Nouns

    Often we use the words element and tag interchangeably - we are talking about HTML elements. In the grammar of this documentation (and package), it can be useful to think about direct objects and indirect objects, so the word tag is used to denote direct objects, and the words element or thing are used to denote indirect objects.

    @@ -121,21 +149,25 @@

    Verbs

    -
    • -bs_append(tag, ...) used to append something to a tag, perhaps a panel into an accordion-group.
      • +
        +
      • +bs_append(tag, ...) used to append something to a tag, perhaps a panel into an accordion-group.
      • -bs_attach_foo(tag, ...) used to attach the id of an element (foo) to another tag, for example, you could create a modal window using bs_modal(), then you could attach the id of the modal window to the tag using bs_attach_modal() +bs_attach_foo(tag, ...) used to attach the id of an element (foo) to another tag, for example, you could create a modal window using bs_modal(), then you could attach the id of the modal window to the tag using bs_attach_modal()
      • -bs_emded_foo(tag, ...) used to embed something (a foo) into a tag, for example, bs_embed_tooltip() +bs_emded_foo(tag, ...) used to embed something (a foo) into a tag, for example, bs_embed_tooltip()
      • -bs_set_opts(tag, ...) used to set some options for the items yet to be appended to a tag.
        • -

      Let’s consider the differences between append, attach, and embed:

      -
      • You can append more than one element to a tag, i.e., you could append multiple panels to an accordion-group.
        • +bs_set_opts(tag, ...) used to set some options for the items yet to be appended to a tag. +
      +

      Let’s consider the differences between append, attach, and embed:

      +
        +
      • You can append more than one element to a tag, i.e., you could append multiple panels to an accordion-group.
      • You can attach only one id of a thing to a tag. When we are attaching, we attach the id of an element, not the element itself. However, we can attach an id of an element to more than one tag.
        • -
      • You can embed only one thing into a tag. i.e., into a given tag, you can embed a tooltip or a popover, modifying the tag’s attributes and setting a child element in the tag.
        • -
    +
  • You can embed only one thing into a tag. i.e., into a given tag, you can embed a tooltip or a popover, modifying the tag’s attributes and setting a child element in the tag.
    • + +

    @@ -151,20 +183,31 @@

    + + +

    Dev status

    +
      +
    • Travis-CI Build Status
      • +
    • Coverage Status
      • +
    • CRAN_Status_Badge
      • +
    + +

    @@ -176,6 +219,8 @@

    Developers

    • Ian Lyttle
      pkgdown.

    -
    + +
    - + + diff --git a/docs/news/index.html b/docs/news/index.html index 135ea7d..f24e83e 100644 --- a/docs/news/index.html +++ b/docs/news/index.html @@ -85,19 +85,23 @@

    Change log All releases

    bsplus 0.1.0.9000

    -
    • version bump for development
      • -
    +
      +
    • version bump for development
      • +
    +

    bsplus 0.1.0

    -

    • deprecates render_html_fragment() (#24, solution proposed by @jpmarindiaz)

      • -

    • adds carousel: bs_carousel()

      • -

    • adds function to embed help links into labels of shiny inputs, shinyInput_label_embed()

      • +
    + + diff --git a/docs/reference/bs_set_data.html b/docs/reference/bs_set_data.html index cfffb09..b56325e 100644 --- a/docs/reference/bs_set_data.html +++ b/docs/reference/bs_set_data.html @@ -133,10 +133,8 @@

    See a

    Examples

    library("htmltools")
-library("lubridate")
    #> 
-#> Attaching package: ‘lubridate’
    #> The following object is masked from ‘package:base’:
-#> 
-#>     date
    
+library("lubridate")
+
 tags$div() %>%
   bs_set_data(
     target = "#foobar",
diff --git a/docs/reference/index.html b/docs/reference/index.html
index 306d694..abef1d0 100644
--- a/docs/reference/index.html
+++ b/docs/reference/index.html
@@ -105,9 +105,24 @@ 
    
 
 
-
    The verb attach is used with collapse elements; you create a collapse element, then attach its id to a link or button tag. For accordions and accordion sidebars, you create the framework tag, then append elements using the pipe. Also, accordion-sidebars require activation, which you can do by calling use_bs_accordion_sidebar() once on your page.
    
+
    The verb attach is used with collapse elements; you create a collapse element, then attach its id to a link or button tag. For accordions and accordion sidebars, you create the framework tag, then append elements using the pipe. Also, accordion-sidebars require activation, which you can do by calling use_bs_accordion_sidebar() once on your page.
    
 
    
 
+      
+      
    Accordion-sidebar panel-group
    
+      
+      
+      
    Accordion panel-group
    
+      
+      
+      
    Collapsible element
    
+      
           
    Tooltip, popover, and modal window
    
       
    
 
    Tooltips, popovers, and modals can be useful for including extra information in your rmarkdown document or your shiny app.
    
@@ -131,24 +146,69 @@ 
    shiny app. Different verbs are associated with these elements: you embed tooltips and popovers into tags; whereas you create a modal element, then attach its id to a tag. Also, tooltips and popovers require activation, which you can do calling use_bs_tooltip() or use_bs_popover() once on your page.
    
+
    You can see tooltips, popovers, and modal windows in this shiny app. Different verbs are associated with these elements: you embed tooltips and popovers into tags; whereas you create a modal element, then attach its id to a tag. Also, tooltips and popovers require activation, which you can do calling use_bs_tooltip() or use_bs_popover() once on your page.
    
 
    
 
+      
+      
    Popover
    
+      
+      
+      
    Tooltip
    
+      
+      
+      
    Modal window
    
+      
           
    
       
    
-
    Carousels are used to contain sets of “content”, while showing one element of the set at a time. Generally, the content are images, but it can be any HTML. One way that a this could be a more-useful tool if an “easy” way can be found to populate a carousel with images produced by gganimate.
    
+
    Carousels are used to contain sets of “content”, while showing one element of the set at a time. Generally, the content are images, but it can be any HTML. One way that a this could be a more-useful tool if an “easy” way can be found to populate a carousel with images produced by gganimate.
    
 
 
    
 
+      
+      
    Carousel caption
    
+      
+      
+      
    Carousel image
    
+      
+      
+      
    Carousel
    
+      
           
    Shiny UI extensions
    
       
    One of the more-specific goals of this package is to make it easier to incorporate help-documentation into your shiny apps. Some helper functions are provided to create help-links, then embed them into labels of shiny inputs. You can see these helper functions in action in this shiny app.
    
 
+      
+      
    Create link containing Shiny icon
    
+      
+      
+      
    Embed an element into the label of a Shiny-input tag
    
+      
           
    Helpers
    
-      
    The function bs_set_data() makes things a little easier for you by prepending "data-" to each name and serializing values to the format specified by the Bootstrap API. The function bs_set_aria() works similarly to prepend "aria-" to each name.
    
+      
    The function bs_set_data() makes things a little easier for you by prepending "data-" to each name and serializing values to the format specified by the Bootstrap API. The function bs_set_aria() works similarly to prepend "aria-" to each name.
    
 
+      
+      
    Sets Bootstrap data- and aria- attributes.
    
+      
     
     
    
   
diff --git a/man/bs_accordion.Rd b/man/bs_accordion.Rd
new file mode 100644
index 0000000..290685b
--- /dev/null
+++ b/man/bs_accordion.Rd
@@ -0,0 +1,73 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/accordion.R, R/append.R, R/set_opts.R
+\name{bs_accordion}
+\alias{bs_accordion}
+\alias{bs_append.bsplus_accordion}
+\alias{bs_set_opts.bsplus_accordion}
+\title{Accordion panel-group}
+\usage{
+bs_accordion(id)
+
+\method{bs_append}{bsplus_accordion}(tag, title, content, ...)
+
+\method{bs_set_opts}{bsplus_accordion}(tag, panel_type = "primary",
+  use_heading_link = TRUE, ...)
+}
+\arguments{
+\item{id}{character, unique id for accordion \code{
    },
+also serves as root id for panels appended using \code{bs_append()}}
+
+\item{tag}{\code{htmltools::\link[htmltools]{tag}},
+accordion \code{
    } to which to append a panel}
+
+\item{title}{character (HTML) or \code{htmltools::\link[htmltools]{tagList}},
+title for the panel heading}
+
+\item{content}{character (HTML) or \code{htmltools::\link[htmltools]{tagList}},
+content for the panel body}
+
+\item{...}{other args (not used)}
+
+\item{panel_type}{character, one of the standard Bootstrap types
+\code{c("default", "primary", "success", "info", "warning", "danger")}}
+
+\item{use_heading_link}{logical, indicates whether to make the entire panel heading
+clickable.}
+}
+\value{
+\code{bsplus_accordion} object (\code{htmltools::\link[htmltools]{tag}},
+  \code{
    })
+}
+\description{
+An accordion is a set of collapsible panels where, at most, one panel-body is visible.
+}
+\details{
+All of these functions return a \code{bsplus_accordion} object
+(which is also an \code{htmltools::\link[htmltools]{tag}}, \code{
    }), so you can
+compose an accordion by piping. There are three parts to this system:
+
+\enumerate{
+  \item{A constructor function for the accordion, \code{bs_accordion()}}
+  \item{A function to set options for subsequent panels, \code{bs_set_opts()}}
+  \item{A function to append a panel to the group, \code{bs_append()}}
+}
+
+The verb \emph{append} is used to signify that you can append an arbitrary
+number of panels to an accordion.
+
+For the constructor, \code{bs_accordion()},
+it is your responsibility to ensure that \code{id} is unique
+among HTML elements in your page. If you have non-unique \code{id}'s, strange things may
+happen to your page.
+}
+\examples{
+bs_accordion(id = "meet_the_beatles") \%>\%
+  bs_set_opts(panel_type = "success", use_heading_link = TRUE) \%>\%
+  bs_append(title = "John Lennon", content = "Rhythm guitar, vocals") \%>\%
+  bs_set_opts(panel_type = "info") \%>\%
+  bs_append(title = "Paul McCartney", content = "Bass guitar, vocals")
+
+}
+\seealso{
+\url{http://getbootstrap.com/javascript/#collapse-example-accordion}
+}
diff --git a/man/bs_accordion_sidebar.Rd b/man/bs_accordion_sidebar.Rd
new file mode 100644
index 0000000..f6b626a
--- /dev/null
+++ b/man/bs_accordion_sidebar.Rd
@@ -0,0 +1,103 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/accordion_sidebar.R, R/append.R, R/set_opts.R
+\name{bs_accordion_sidebar}
+\alias{bs_accordion_sidebar}
+\alias{use_bs_accordion_sidebar}
+\alias{bs_append.bsplus_accordion_sidebar}
+\alias{bs_set_opts.bsplus_accordion_sidebar}
+\title{Accordion-sidebar panel-group}
+\usage{
+bs_accordion_sidebar(id, spec_side = c(width = 4, offset = 0),
+  spec_main = c(width = 8, offset = 0), position = c("left", "right"))
+
+use_bs_accordion_sidebar()
+
+\method{bs_append}{bsplus_accordion_sidebar}(tag, title_side, content_side,
+  content_main, ...)
+
+\method{bs_set_opts}{bsplus_accordion_sidebar}(tag,
+  panel_type_active = "success", panel_type_inactive = "primary",
+  use_main_enclosure = TRUE, ...)
+}
+\arguments{
+\item{id}{character, unique id for accordion-sidebar \code{
    },
+also serves as root id for panels appended using \code{bs_append()}}
+
+\item{spec_side}{numeric, column specification for sidebar panels}
+
+\item{spec_main}{numeric, column specification for main panels}
+
+\item{position}{character, indicates where to put the sidebar panels with
+repspect to the main panels}
+
+\item{tag}{\code{htmltools::\link[htmltools]{tag}},
+accordion-sidebar \code{
    } to which to append a panel}
+
+\item{title_side}{character (HTML) or \code{htmltools::\link[htmltools]{tagList}},
+title for the sidebar panel}
+
+\item{content_side}{character (HTML) or \code{htmltools::\link[htmltools]{tagList}},
+content for the sidebar panel}
+
+\item{content_main}{character (HTML) or \code{htmltools::\link[htmltools]{tagList}},
+content for the main panel}
+
+\item{...}{other args (not used)}
+
+\item{panel_type_active}{character, indicated bootstrap type for active-panel header,
+one of \code{c("default", "primary", "success", "info", "warning", "danger")}}
+
+\item{panel_type_inactive}{character, indicated bootstrap type for inactive-panel header,
+one of \code{c("default", "primary", "success", "info", "warning", "danger")}}
+
+\item{use_main_enclosure}{logical, indicates if main content is to be wrapped in a
+Bootstrap panel}
+}
+\value{
+\code{bsplus_accsidebar} object (\code{htmltools::\link[htmltools]{tag}},
+  \code{
    })
+}
+\description{
+Combines Bootstrap accordion with
+the functionality of \code{shiny::\link[shiny]{sidebarLayout}},
+allowing you to add another dimension to your \strong{shiny} apps.
+}
+\details{
+If you use a \code{bs_accordion_sidebar()}, you will have to call the function
+\code{use_bs_accordion_sidebar()} somewhere in your UI. This attaches some
+JavaScript needed for your accordion sidebar to work properly.
+
+All of these functions return a \code{bsplus_accsidebar} object,
+(which is also an \code{htmltools::\link[htmltools]{tag}}, \code{
    }), so you can
+compose an accordion sidebar by piping. There are three parts to this system:
+
+\enumerate{
+  \item{A constructor function for the accordion-sidebar, \code{bs_accordion_sidebar()}}
+  \item{A function to set options for subsequent panels, \code{bs_set_opts()}}
+  \item{A function to append a panel-set to an accordion-sidebar, \code{bs_append()}}
+}
+
+The verb \emph{append} is used to signify that you can append an arbitrary
+number of panels-sets to an accordion-sidebar.
+
+For the constructor, \code{bs_accordion_sidebar()},
+it is your responsibility to ensure that \code{id} is unique
+among HTML elements in your page. If you have non-unique \code{id}'s, strange things may
+happen to your page.
+}
+\examples{
+bs_accordion_sidebar(id = "meet_the_beatles") \%>\%
+  bs_append(
+    title_side = "John Lennon",
+    content_side = "Rhythm guitar, vocals",
+    content_main = "Dear Prudence"
+  ) \%>\%
+  bs_append(
+    title_side = "Paul McCartney",
+    content_side = "Bass guitar, vocals",
+    content_main = "Blackbird"
+  )
+\dontrun{
+use_bs_accordion_sidebar()
+}
+}
diff --git a/man/bs_append.Rd b/man/bs_append.Rd
new file mode 100644
index 0000000..2fcc52f
--- /dev/null
+++ b/man/bs_append.Rd
@@ -0,0 +1,30 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/append.R
+\name{bs_append}
+\alias{bs_append}
+\alias{bs_append.default}
+\alias{bs_append.shiny.tag}
+\title{Append to a bsplus html element}
+\usage{
+bs_append(tag, ...)
+
+\method{bs_append}{default}(tag, ...)
+
+\method{bs_append}{shiny.tag}(tag, ...)
+}
+\arguments{
+\item{tag}{\code{htmltools::\link[htmltools]{tag}}}
+
+\item{...}{additional arguments}
+}
+\value{
+\code{htmltools::\link[htmltools]{tag}}, modified copy of \code{tag}
+}
+\description{
+This would be used when we want to add items to a collection
+}
+\seealso{
+\code{\link{bs_accordion}}, \code{\link{bs_accordion_sidebar}},
+  \code{\link{bs_carousel}}
+}
+\keyword{internal}
diff --git a/man/bs_attr.Rd b/man/bs_attr.Rd
new file mode 100644
index 0000000..fcc43e1
--- /dev/null
+++ b/man/bs_attr.Rd
@@ -0,0 +1,35 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/set_attr.R
+\docType{methods}
+\name{bs_attr}
+\alias{bs_attr}
+\alias{bs_attr.default}
+\alias{bs_attr.logical}
+\alias{bs_attr}
+\alias{bs_attr,Duration-method}
+\title{Convert a value to be used as an html attribute}
+\usage{
+bs_attr(x)
+
+bs_attr.default(x)
+
+bs_attr.logical(x)
+
+bs_attr(x)
+
+\S4method{bs_attr}{Duration}(x)
+}
+\arguments{
+\item{x}{value to be converted}
+}
+\value{
+character
+}
+\description{
+\itemize{
+  \item character vectors collapsed to a space-delimited character string
+  \item logicals are converted to "true" or "false"
+  \item lubridate durations are converted to numeric (milliseconds)
+}
+}
+\keyword{internal}
diff --git a/man/bs_carousel.Rd b/man/bs_carousel.Rd
new file mode 100644
index 0000000..e3e8459
--- /dev/null
+++ b/man/bs_carousel.Rd
@@ -0,0 +1,68 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/append.R, R/carousel.R
+\name{bs_append.bsplus_carousel}
+\alias{bs_append.bsplus_carousel}
+\alias{bs_carousel}
+\title{Carousel}
+\usage{
+\method{bs_append}{bsplus_carousel}(tag, content, caption = NULL, ...)
+
+bs_carousel(id, use_indicators = FALSE, use_controls = TRUE)
+}
+\arguments{
+\item{tag}{\code{htmltools::\link[htmltools]{tag}},
+carousel \code{
    } to which to append a panel}
+
+\item{content}{character (HTML) or \code{htmltools::\link[htmltools]{tagList}},
+content for the slide}
+
+\item{caption}{character (HTML) or \code{htmltools::\link[htmltools]{tagList}},
+caption for the slide}
+
+\item{...}{other args (not used)}
+
+\item{id}{character, unique id for accordion \code{
    },
+also serves as root id for slides appended using \code{bs_append()}}
+
+\item{use_indicators}{logical, denotes use of slide-position indicators (dots)}
+
+\item{use_controls}{logical, denotes use of controls (chevrons at sides)}
+}
+\value{
+\code{bsplus_carousel} object (\code{htmltools::\link[htmltools]{tag}},
+  \code{
    })
+}
+\description{
+A carousel is used to enclose a set of (typically) images,
+providing controls to move slides back-and-forth.
+}
+\details{
+All of these functions return a \code{bsplus_carousel} object
+(which is also an \code{htmltools::\link[htmltools]{tag}}, \code{
    }), so you can
+compose a carousel by piping. There are two parts to this system:
+
+\enumerate{
+  \item{A constructor function for the carousel, \code{bs_carousel()}}
+  \item{A function to append a slide to the carousel, \code{bs_append()}}
+}
+
+The verb \emph{append} is used to signify that you can append an arbitrary
+number of slides to a carousel.
+
+For the constructor, \code{bs_carousel()},
+it is your responsibility to ensure that \code{id} is unique
+among HTML elements in your page. If you have non-unique \code{id}'s, strange things may
+happen to your page.
+}
+\examples{
+bs_carousel(id = "with_the_beatles") \%>\%
+  bs_append(content = bs_carousel_image(src = "img/john.jpg")) \%>\%
+  bs_append(content = bs_carousel_image(src = "img/paul.jpg")) \%>\%
+  bs_append(content = bs_carousel_image(src = "img/george.jpg")) \%>\%
+  bs_append(content = bs_carousel_image(src = "img/ringo.jpg"))
+
+}
+\seealso{
+\url{http://getbootstrap.com/javascript/#carousel},
+  \code{\link{bs_carousel_image}}, \code{\link{bs_carousel_caption}}
+}
diff --git a/man/bs_carousel_caption.Rd b/man/bs_carousel_caption.Rd
new file mode 100644
index 0000000..ba9ca51
--- /dev/null
+++ b/man/bs_carousel_caption.Rd
@@ -0,0 +1,22 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/carousel.R
+\name{bs_carousel_caption}
+\alias{bs_carousel_caption}
+\title{Carousel caption}
+\usage{
+bs_carousel_caption(title = NULL, body = NULL)
+}
+\arguments{
+\item{title}{character, caption title}
+
+\item{body}{character, caption body}
+}
+\value{
+\code{htmltools::\link[htmltools]{tag}} \code{
    } for carousel caption
+}
+\description{
+Helper function to generate HTML for a carousel caption.
+}
+\seealso{
+\code{\link{bs_carousel}}
+}
diff --git a/man/bs_carousel_image.Rd b/man/bs_carousel_image.Rd
new file mode 100644
index 0000000..456c790
--- /dev/null
+++ b/man/bs_carousel_image.Rd
@@ -0,0 +1,25 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/carousel.R
+\name{bs_carousel_image}
+\alias{bs_carousel_image}
+\title{Carousel image}
+\usage{
+bs_carousel_image(...)
+}
+\arguments{
+\item{...}{additional arguments passed to
+\code{htmltools::\link[htmltools]{tag}$img}, typically includes \code{src}}
+}
+\value{
+\code{htmltools::\link[htmltools]{tag}$img}
+}
+\description{
+Helper function to generate HTML for a carousel image.
+}
+\details{
+This function wraps \code{htmltools::\link[htmltools]{tag}$img},
+but adding a class to center the image in the carousel.
+}
+\seealso{
+\code{\link{bs_carousel}}
+}
diff --git a/man/bs_collapse.Rd b/man/bs_collapse.Rd
new file mode 100644
index 0000000..74fef0e
--- /dev/null
+++ b/man/bs_collapse.Rd
@@ -0,0 +1,72 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/collapse.R
+\name{bs_collapse}
+\alias{bs_collapse}
+\alias{bs_attach_collapse}
+\title{Collapsible element}
+\usage{
+bs_collapse(id, content = NULL, show = FALSE)
+
+bs_attach_collapse(tag, id_collapse)
+}
+\arguments{
+\item{id}{character, unique id for the collapsible \code{
    }}
+
+\item{content}{character (HTML) or
+\code{htmltools::\link[htmltools]{tagList}},
+content for the collapsible \code{
    }}
+
+\item{show}{logical, indicates if collapsible \code{
    }
+is shown when page is initialized}
+
+\item{tag}{\code{htmltools::\link[htmltools]{tag}},
+button or link to which to attach a collapsible \code{
    }}
+
+\item{id_collapse}{character, \code{id} of
+the collapsible \code{
    } to attach}
+}
+\value{
+\describe{
+  \item{\code{bs_collapse()}}{\code{htmltools::\link[htmltools]{tag}},
+  \code{
    }}
+  \item{\code{bs_attach_collapse()}}{\code{htmltools::\link[htmltools]{tag}},
+    modified copy of \code{tag} (button or link)}
+}
+}
+\description{
+This is useful for content that you may wish to be hidden when the page is
+initialized, but that can be revealed (and subsequently hidden)
+by clicking a button or a link.
+}
+\details{
+There are two parts to this system:
+
+\enumerate{
+  \item{A collapsible \code{
    }, created using \code{bs_collapse()}}
+  \item{At least one button (\code{