From f5635d4620fe309e68503bd8f388de6d2d736dfb Mon Sep 17 00:00:00 2001 From: Dean Attali Date: Sun, 24 Apr 2016 16:09:55 -0700 Subject: [PATCH] add documentation for how to use shinyjs with the new html templates feature; fixes #55 --- DESCRIPTION | 2 +- NEWS.md | 5 +++-- README.md | 33 ++++++++++++++++------------- inst/srcjs/shinyjs-default-funcs.js | 2 +- vignettes/overview.Rmd | 12 +++++------ 5 files changed, 29 insertions(+), 25 deletions(-) diff --git a/DESCRIPTION b/DESCRIPTION index 91f3d60..e413227 100644 --- a/DESCRIPTION +++ b/DESCRIPTION @@ -1,6 +1,6 @@ Package: shinyjs Title: Perform Common JavaScript Operations in Shiny Apps using Plain R Code -Version: 0.5.4 +Version: 0.6 Authors@R: person("Dean", "Attali", email = "daattali@gmail.com", role = c("aut", "cre")) Description: Perform common JavaScript operations in Shiny applications without diff --git a/NEWS.md b/NEWS.md index ecdd819..fadef3a 100644 --- a/NEWS.md +++ b/NEWS.md @@ -1,8 +1,9 @@ -# shinyjs 0.5.4 +# shinyjs 0.6 -2016-04-21 +2016-04-24 - `info()` fuction: don't include surrounding quotations if not necessary (#59) +- added documentation for how to use `shinyjs` in HTML templates # shinyjs 0.5.3 diff --git a/README.md b/README.md index 2f70237..755d8fe 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,3 @@ -NOTE: During March/April 2016 I will be extremely busy trying to write my thesis, so please do not send me private emails asking for personal help. If you need help, I recommend you ask on StackOverflow. Help me graduate :) -================================================================================================================================================================================================================================== - shinyjs - Perform common JavaScript operations in Shiny apps using plain R code =============================================================================== @@ -162,15 +159,14 @@ that uses `shinyjs`: shinyApp(ui, server) -This is how most Shiny apps should initialize `shinyjs`, but there are -four common scenarios that should be treated a little differently: using -`shinyjs` in Shiny dashboards, in Shiny apps that use a `navbarPage` -layout, in interactive documents, or in Shiny apps that manually build -the user interface with an HTML file instead of using Shiny's UI -functions. If your Shiny app doesn't fall into any of these categories -(most Shiny apps don't), then you can skip the next 4 sections that -describe how to tackle these cases, and scroll down to the [Basic use -case](#usecase) section. +This is how most Shiny apps should initialize `shinyjs`, but there a few +scenarios that should be treated a little differently: using `shinyjs` +in Shiny dashboards, in Shiny apps that use a `navbarPage` layout, in +interactive Rmd documents, or in Shiny apps that manually build the user +interface with an HTML file or template instead of using Shiny's UI +functions. If your Shiny app doesn't fall into any of these categories, +then you can skip the next 4 sub-sections that describe how to tackle +these cases, and scroll down to the [Basic use case](#usecase) section.

Using shinyjs in Shiny Dashboards @@ -263,11 +259,18 @@ Shiny document as the link above describes): })

-Using shinyjs when the user interface is built using an HTML file +Using shinyjs when the user interface is built using an HTML +file/template

While most Shiny apps use Shiny's functions to build a user interface to -the app, it is possible to build the entire UI with custom HTML, [as +the app, it is possible to build the UI with an HTML template, [as RStudio shows in this +article](http://shiny.rstudio.com/articles/templates.html). In this +case, you simply need to add `{{ useShinyjs() }}` somewhere in the +template, preferably inside the `...` tags. + +A similar way to create your app's UI with HTML is to write it entirely +in HTML (without templates), [as RStudio shows in this article](http://shiny.rstudio.com/articles/html-ui.html). Building Shiny apps like this is much more complicated and should only be used if you're very comfortable with HTML. Using `shinyjs` in these apps is @@ -290,7 +293,7 @@ to use `shinyjs` in these apps: call `useShinyjs(html = TRUE)` After adding these three lines to your code, you can use all `shinyjs` -functions as normal. +functions as usual.

Basic use case - complete working example diff --git a/inst/srcjs/shinyjs-default-funcs.js b/inst/srcjs/shinyjs-default-funcs.js index f6d8ac1..bc29ee5 100644 --- a/inst/srcjs/shinyjs-default-funcs.js +++ b/inst/srcjs/shinyjs-default-funcs.js @@ -1,4 +1,4 @@ -// shinyjs 0.5.4 by Dean Attali +// shinyjs 0.6 by Dean Attali // Perform common JavaScript operations in Shiny apps using plain R code shinyjs = function() { diff --git a/vignettes/overview.Rmd b/vignettes/overview.Rmd index 933185a..597ce37 100644 --- a/vignettes/overview.Rmd +++ b/vignettes/overview.Rmd @@ -13,8 +13,6 @@ vignette: > knitr::opts_chunk$set(tidy = FALSE, comment = "#>") ``` -# NOTE: During February/March 2016 I will be extremely busy trying to write my thesis, so please do not send me private emails asking for personal help. If you need help, I recommend you ask on StackOverflow. Help me graduate :) - # shinyjs - Perform common JavaScript operations in Shiny apps using plain R code [![Build Status](https://travis-ci.org/daattali/shinyjs.svg?branch=master)](https://travis-ci.org/daattali/shinyjs) @@ -156,7 +154,7 @@ server <- function(input, output) { shinyApp(ui, server) ``` -This is how most Shiny apps should initialize `shinyjs`, but there are four common scenarios that should be treated a little differently: using `shinyjs` in Shiny dashboards, in Shiny apps that use a `navbarPage` layout, in interactive documents, or in Shiny apps that manually build the user interface with an HTML file instead of using Shiny's UI functions. If your Shiny app doesn't fall into any of these categories (most Shiny apps don't), then you can skip the next 4 sections that describe how to tackle these cases, and scroll down to the [Basic use case](#usecase) section. +This is how most Shiny apps should initialize `shinyjs`, but there a few scenarios that should be treated a little differently: using `shinyjs` in Shiny dashboards, in Shiny apps that use a `navbarPage` layout, in interactive Rmd documents, or in Shiny apps that manually build the user interface with an HTML file or template instead of using Shiny's UI functions. If your Shiny app doesn't fall into any of these categories, then you can skip the next 4 sub-sections that describe how to tackle these cases, and scroll down to the [Basic use case](#usecase) section.

Using shinyjs in Shiny Dashboards

@@ -230,9 +228,11 @@ observeEvent(input$button, { }) ``` -

Using shinyjs when the user interface is built using an HTML file

+

Using shinyjs when the user interface is built using an HTML file/template

+ +While most Shiny apps use Shiny's functions to build a user interface to the app, it is possible to build the UI with an HTML template, [as RStudio shows in this article](http://shiny.rstudio.com/articles/templates.html). In this case, you simply need to add `{{ useShinyjs() }}` somewhere in the template, preferably inside the `...` tags. -While most Shiny apps use Shiny's functions to build a user interface to the app, it is possible to build the entire UI with custom HTML, [as RStudio shows in this article](http://shiny.rstudio.com/articles/html-ui.html). Building Shiny apps like this is much more complicated and should only be used if you're very comfortable with HTML. Using `shinyjs` in these apps is possible but it works a little differently since there is no `ui.R` to call `useShinyjs()` from. There are three simple steps to take in order to use `shinyjs` in these apps: +A similar way to create your app's UI with HTML is to write it entirely in HTML (without templates), [as RStudio shows in this article](http://shiny.rstudio.com/articles/html-ui.html). Building Shiny apps like this is much more complicated and should only be used if you're very comfortable with HTML. Using `shinyjs` in these apps is possible but it works a little differently since there is no `ui.R` to call `useShinyjs()` from. There are three simple steps to take in order to use `shinyjs` in these apps: - create a `global.R` file in the same directory as your `server.R`, and add the following line to the file: @@ -244,7 +244,7 @@ While most Shiny apps use Shiny's functions to build a user interface to the app - in your server function (the `shinyServer` function) you need to call `useShinyjs(html = TRUE)` -After adding these three lines to your code, you can use all `shinyjs` functions as normal. +After adding these three lines to your code, you can use all `shinyjs` functions as usual.

Basic use case - complete working example