Consider using rintrojs

[carlganz]

Hello,

Thanks for the wonderful, and informative tutorials. This is sort of a shameless plug, but I think you could greatly simplify the intro.js code in the 4th tutorial, using the rintrojs package.

For example, you can do a multi-tab introduction, similar to what you have in the advanced example, with substantially less javascript:

library(shiny)
devtools::install_github("carlganz/rintrojs")
library(rintrojs)

ui <- shinyUI(fluidPage(
  introjsUI(),
  navbarPage("Test",id="nav",
             tabPanel("one",
                      actionButton("btn","Press me for intro")),
             tabPanel("two",
                      p("Here is some text",id="someText")
             )
  )
)
)

server <- shinyServer(function(input, output, session) {

  steps <- reactive({
    req(input$nav)
    if (input$nav=='one') {
      data.frame(element=c(NA,"#btn"),
                 intro=c("Welcome","This is a button"))
    } else {
      data.frame(element=c(NA,"#someText"),
                 intro=c("Welcome to second tab",
                         "This is some text"))
    }

  })

  options <- reactive({
    req(input$nav)
    if (input$nav=='one') {
      list(doneLabel="Next page",steps=steps())      
    } else {
      list(steps=steps())
    }
  })

  events <- reactive({
    req(input$nav)
    if (input$nav=='one') {
      list(oncomplete=paste0(
        "$('[data-value=' + ","\"two\""," + ']').tab('show');
           Shiny.onInputChange('btn',Math.random())"
      ))      
    } else {
      list()
    }
  })

  observeEvent(input$btn,{

    introjs(session, options=options(), events=events())

  })

})

# Run the application 
shinyApp(ui = ui, server = server)

Would you consider a pull request that reworked the examples from the 4th tutorial using rintrojs?

Kind Regards,
Carl

[FrissAnalytics]

Hi Carl,

Thanks for your kind words! Me and my colleague (who is co writer of the series) were as you probably guested totally unaware of your package!

I'm writing this from my phone so I can't really view anything correctly now, but tomorrow I'll take a closer look at your package and suggestions.

As the tutorial states, are goal was not to make a full fledged package for introjs, but more to show readers a different take on what you can do with JavaScript, compared to yet make another fancy chart binding.

Obviously at least a reference to your package makes a lot of sense. I'll look into your thoughts tomorrow for sure and come back to you, does that sound ok to you?

Kind regards, Herman

---

Van: Carl Ganz notifications@github.com
Verzonden: dinsdag 11 oktober 2016 18:33:49
Aan: FrissAnalytics/shinyJsTutorials
Onderwerp: [FrissAnalytics/shinyJsTutorials] Consider using rintrojs (#8)

Hello,

Thanks for the wonderful, and informative tutorials. This is sort of a shameless plug, but I think you could greatly simplify the intro.js code in the 4th tutorial, using the rintrojshttps://github.com/carlganz/rintrojs package.

For example, you can do a multi-tab introduction, similar to what you have in the advanced example, with substantially less javascript:

library(shiny)
devtools::install_github("carlganz/rintrojs")
library(rintrojs)

ui <- shinyUI(fluidPage(
introjsUI(),
navbarPage("Test",id="nav",
tabPanel("one",
actionButton("btn","Press me for intro")),
tabPanel("two",
p("Here is some text",id="someText")
)
)
)
)

server <- shinyServer(function(input, output, session) {

steps <- reactive({
req(input$nav)
if (input$nav=='one') {
data.frame(element=c(NA,"#btn"),
intro=c("Welcome","This is a button"))
} else {
data.frame(element=c(NA,"#someText"),
intro=c("Welcome to second tab",
"This is some text"))
}

})

options <- reactive({
req(input$nav)
if (input$nav=='one') {
list(doneLabel="Next page",steps=steps())
} else {
list(steps=steps())
}
})

events <- reactive({
req(input$nav)
if (input$nav=='one') {
list(oncomplete=paste0(
"$('[data-value=' + ",""two""," + ']').tab('show');
Shiny.onInputChange('btn',Math.random())"
))
} else {
list()
}
})

observeEvent(input$btn,{

introjs(session, options=options(), events=events())

})

})

Run the application

shinyApp(ui = ui, server = server)

Would you consider a pull request that reworked the examples from the 4th tutorial using rintrojs?

Kind Regards,
Carl

You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHubhttps://github.com//issues/8, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ALCLnoZpyD_v8Zdbuqrtva9yLuTcLFRmks5qy7ptgaJpZM4KT1tf.

[carlganz]

That works perfectly fine for me. Thanks again for the excellent tutorials.

Regards

[carlganz]

Any update?

[FrissAnalytics]

Hi,

sorry for the long wait!

I broke my leg and was out for quite a while. After some surgery I'm better now :- ) We'll put in a ref to your package and we're about to complete the series this week and present it at the user! 2017 conference in early juli.

Thanks for your suggestions!