display shiny app source code within app

[Patrick Toche]

I set up a basic app equipped with a checkboxInput that can be toggled to display the source code (both ui.R and server.R). It works locally, but I'm having problems setting it up on the server:

http://spark.rstudio.com/toche/demoCounter/

The main problem is that the app does not "source" the ui.R and server.R. It gives me:

Error: cannot open the connection

I have saved the ui.R and server.R inside a /www/ subfolder, where they can be found at this time, although with some delay and not at every attempt.

Any suggestions? 

Another problem I encountered was that I had to rename the app from "demo-counter" to "demoCounter" because it wouldn't accept a hyphen. Other apps I have with hyphens in their name work, e.g. http://spark.rstudio.com/toche/demo-dynamic-matrix 

Thanks!

Code copied below.

# https://groups.google.com/forum/#!topic/shiny-discuss/IWBghVCcMnI

# ui.R

library("shiny")

shinyUI(

  basicPage(

    h4("Shiny App Demo: Reactive Counter")

    ,

    tags$hr()

    ,

    uiOutput("buttons")

    ,

    uiOutput("count")

    ,

    tags$hr()

    ,

    helpText("Description: A counter starting at 0 and with maximum value 10")

    ,

    tags$br()

    ,

    checkboxInput("showCode", label="Show shiny source code?", value=FALSE)

    ,

    uiOutput("source")

  )

)

# server.R

library("shiny")

library("shinyAce")

shinyServer(

  function(input, output) {

    sourceFilePath <- "http://spark.rstudio.com/toche/demoCounter/"

    

    # A reactiveValues object holds the value of the counter

    values <- reactiveValues(i = 0)

    

    # Print the value of the counter stored in values$i

    output$count <- renderUI({

      h5(paste0("counter = ", values$i))

    })

    

    # Show the source code

    output$source <- renderUI({

      if (input$showCode) {

        list(

          aceEditor("ui"

          , value = paste(readLines(paste0(sourceFilePath,"ui.R")), collapse="\n")

          , mode = "r"

          , theme = "cobalt"

          , height = "260px"

          , readOnly = TRUE

          ),

          aceEditor("server"

          , value = paste(readLines(paste0(sourceFilePath,"server.R")), collapse="\n")

          , mode = "r"

          , theme = "cobalt"

          , height = "260px"

          , readOnly = TRUE)

        )

      } else {

        return(invisible())

      }

    })

    

    # Display buttons in the mainPanel

    output$buttons <- renderUI({

      if (values$i == 0) { 

        list(actionButton("increment", "Next"))

      } else {

        if (values$i == 10) {# bugs: if you click too fast it will jump to 11, 12, etc.

          list(actionButton("decrement", "Back"))

        } else { 

          list(actionButton("decrement", "Back"), actionButton("increment", "Next"))

        } 

      } 

    })

  

    # The observers re-run the code whenever the button is clicked

    # Use isolate to avoid getting stuck in an infinite loop

    observe({ 

      if(is.null(input$increment) || input$increment == 0){return()} 

      values$i <- isolate(values$i) + 1 

    }) 

    

    observe({ 

      if(is.null(input$decrement) || input$decrement == 0){return()} 

      values$i <- isolate(values$i) - 1 

    }) 

       

  }

)

[Vincent Nijs]

Why do you need a URL here? If you use the file path addResourcePath will be useful

http://www.inside-r.org/packages/cran/shiny/docs/addResourcePath

[Patrick Toche]

Thanks for your reply Vincent. I'm afraid I don't understand how this works.

I have looked at 

http://www.inside-r.org/packages/cran/shiny/docs/addResourcePath 

but am none the wiser.

How do you suggest I replace the following:

sourceFilePath <- "http://spark.rstudio.com/toche/demoCounter/"

readLines(paste0(sourceFilePath,"ui.R"))

Something like this?

readLines(addResourcePath('prefix' = "ui.R", 'directoryPath' = sourceFilePath))

or maybe?

readLines(addResourcePath('prefix' = 'ui', 'directoryPath' = sourceFilePath))

stackoverflow has one question with zero answer on the topic of addResourcePath. Thanks for your help.

[Vincent Nijs]

Actually I think you don't think you even need it. readLines('ui.R') should work since the working directory in a Shiny app is set to where ui.R and server.R are located.

[Joe Cheng]

That's right. Also, rather than doing it in a uiOutput, just do it directly in ui.R and put it in a conditionalPanel whose condition is "input.showCode".

We're working on a very fancy version of this (showing source code next to the app) for the next version of Shiny. The pull request is here:

https://github.com/rstudio/shiny/pull/352

--
You received this message because you are subscribed to the Google Groups "Shiny - Web Framework for R" group.
To unsubscribe from this group and stop receiving emails from it, send an email to shiny-discus...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

[Stéphane Laurent]

Vincent is right. Below is the way I use, e.g. for this app: http://glimmer.rstudio.com/stla/reactive1/

1) Define the following showfiles list in global.R :

showfiles <-  list(
    aceEditor("server",
              value = paste(readLines("server.R"), collapse="\n"),
              mode="r", theme="cobalt", height="380px",
              readOnly=TRUE),
    aceEditor("ui",
              value = paste(readLines("ui.R"), collapse="\n"),
              mode="r", theme="cobalt", height="270px",
              readOnly=TRUE)

    )

2) Type showfiles where you want in ui.R. 

[Stéphane Laurent]

By the way you will get some problems if you use the shiny ace editor through a renderUI(): https://github.com/trestletech/shinyAce/issues/6

[Patrick Toche]

[Patrick Toche]

Vincent, Joe, Stéphane: thanks a bunch.

I think I understand now. Fixed the code, uploaded, it works.

I discovered that my app wasn't actually working properly locally because it wasn't rendering the "cobalt" theme. Having discovered what the "cobalt" theme looked like, I opted instead for the more boring "ambience" theme. 

http://spark.rstudio.com/toche/demo-counter/

Code below:

# https://groups.google.com/forum/#!topic/shiny-discuss/IWBghVCcMnI

# ui.R

library("shiny")

library("shinyAce")

sourceCode <- list(

  aceEditor("ui"

  , value = paste(readLines("ui.R"), collapse="\n")

  , mode = "r"

  , theme = "ambience"

  , height = "400px"

  , readOnly = TRUE

  ), br(),

  aceEditor("server"

  , value = paste(readLines("server.R"), collapse="\n")

  , mode = "r"

  , theme = "ambience"

  , height = "400px"

  , readOnly = TRUE

  )

)

shinyUI(

  basicPage(

    h4("Shiny App Demo: Reactive Counter")

    ,

    tags$hr()

    ,

    uiOutput("buttons")

    ,

    uiOutput("count")

    ,

    tags$hr()

    ,

    helpText("Description: A counter starting at 0 and with maximum value 10")

    ,

    tags$br()

    ,

    checkboxInput("showSourceCode", label="Show shiny source code?", value=FALSE)

    ,

    conditionalPanel(

      condition='input["showSourceCode"]'

      ,

      sourceCode

    )

  )

)

# server.R

library("shiny")

library("shinyAce")

shinyServer(

  function(input, output) {

    

    # A reactiveValues object holds the value of the counter

    values <- reactiveValues(i = 0)

    

    # Print the value of the counter stored in values$i

    output$count <- renderUI({

      h5(paste0("counter = ", values$i))

    })

    

    # Display buttons in the mainPanel

    output$buttons <- renderUI({

      if (values$i == 0) { 

        list(actionButton("increment", "Next"))

      } else {

        if (values$i == 10) {

[Stéphane Laurent]

http://spark.rstudio.com/toche/demo-counter/

The code does not appear :(

[Stéphane Laurent]

 condition='input["showSourceCode"]'

Is it correct ?? Usually we do input.showSouceCode

[Patrick Toche]

Oh, strange.

I tested on Firefox: no problem.

I just checked on Chrome & Safari: you're right it doesn't show.

To be continued ...

[Patrick Toche]

Thanks Stéphane,

Is it correct ?? Usually we do input.showSouceCode

I get the same result with either of them:

      condition='input["showSourceCode"]'

      condition='input.showSourceCode' 

i.e. Firefox = works, Chrome/Safari = bugs

To be continued...

[Patrick Toche]

http://spark.rstudio.com/toche/demo-counter

The problem is related to the conditionalPanel,

If I set 'value' TRUE, it works in Chrome & Safari, as well as Firefox.

If I set 'value" FALSE, it bugs in Chrome & Safari, but still works in Firefox.

I tested this on a Mac OSX by the way. I can test it on Windows and Ubuntu if needed, let me know.

Maybe Joe, who suggested using a conditionalPanel, knows what went wrong here?

    checkboxInput("showSourceCode", 'label' = "Show shiny source code?", 'value' = TRUE)

    conditionalPanel(condition = 'input.showSourceCode', sourceCode)

[Vincent Nijs]

Try:

conditionalPanel(condition = "input.showSourceCode == true", sourceCode)

Works on Chrome

The condition is evaluated in javascript, hence the . rather than the $ used in R. Also in contrast to R it seems you need to make 'true' explicit.

[Patrick Toche]

conditionalPanel(condition = "input.showSourceCode == true", sourceCode)

Works on Chrome

Vincent, thanks for your help, but it's not working for me:

1. the above code is displayed properly in Firefox (as does the code without the explicit == true), but not at all in Chrome.

2. if I change true to TRUE, the code is displayed on both Firefox and Chrome but without toggling, in other words the conditionalPanel doesn't work. 

Do I have this right?

[Vincent Nijs]

it should be true not TRUE for javascript. This worked fine for me on Chrome/Mac. Can you post this on spark?

[Patrick Toche]

Thanks Vincent!

The app is here (just updated it):

http://spark.rstudio.com/toche/demo-counter/

the source code here:

http://spark.rstudio.com/toche/demo-counter/ui.R

http://spark.rstudio.com/toche/demo-counter/server.R

[Patrick Toche]

I just checked these browsers:

Windows 7x64: 

Firefox + Internet Explorer + Opera 12 = okay, 

Chrome + Opera 18 = bugs

Ubuntu 13.10: 

Firefox + rekonq = okay

Chromium = bugs

...

[Vincent Nijs]

Try:

checkboxInput("showSourceCode", label = "Show shiny source code?", value = FALSE)

It still doesn't always show up however. Not sure what is going on.

[Patrick Toche]

Thanks Vincent, but I haven't been able to make it work. 

A temporary workaround is simply to have 

value = TRUE

in checkboxInput: works in all the browsers I've tried. 

but of course it makes the source code a little intrusive.

[Patrick Toche]

FYI, I have asked a question about this on stackoverflow:

http://stackoverflow.com/questions/20948829/shiny-and-shinyace-conditionalpanel-initial-state-causing-problems