Embedding Javascript into R Shiny Conductor Tour

2 hours ago 1
ARTICLE AD BOX

This posting is intended to give other users an example of how to use javascript within a Conductor tour within a Shiny app. At the time of writing, the vignette for the Conductor package only says the arguments within new() of onComplete, onCancel, onShow, onHide, onStart, onActive, can contain 'A Javascript code to run' but there are no examples anywhere on what this code might look like. And if you know little to no javascript (as I did) then you end up being stuck for a long time!

The code shown below gives one example of what the javascript would look like, and it simply updates an input$ variable of your choice with a value of your choice, that can then be detected by an observeEvent() in the ui.R script/function.

In the example, it simply updates input$my_tour_state with either 'true' or 'false', but it could contain either numbers or characters as well.

I hope this posting saves others many hours (as I spent) trying to figure out what the javascript would look that would help enable the step that a conductor tour is at to control some of the input widgets.

library(shiny) library(conductor) ui <- fluidPage( use_conductor(), # create button to start the tour actionButton(inputId = "ui_start_tour", label = "Start Tour"), # output status of tour verbatimTextOutput(outputId = "tour_status") ) server <- function(input, output, session) { # Create a Conductor tour conductor <- Conductor$ new()$ step( id = "step1", title = "Welcome", text = "This is the first step.", # javascript to update reactiveVal called 'tour_state' onShow = "Shiny.setInputValue('my_tour_state', true, {priority: 'event'})" )$ step( id = "step2", title = "Second Step", text = "This is the second step.", onShow = "Shiny.setInputValue('my_tour_state', false, {priority: 'event'})" ) # Start the tour when action button pressed observeEvent(eventExpr = input$ui_start_tour, handlerExpr = { conductor$init()$start() }) # Display tour state reactively output$tour_status <- renderText({ paste("Tour status:", input$my_tour_state) }) } shinyApp(ui, server)
Read Entire Article