Shiny tabPanel and Google Analytics

Question

I've read myself through the great tutorial here. However, my knowledge of jQuery equals to zero. I use several tabPanels in my ShinyApp to display my data. The tutorial explains how to track link-clicking events (which works fine, I included a .js as explained in the tutorial). Is there a way to track if users click on a specific tabPanel (for example Panel1 and Panel2)? I've tried to do the same with a link referring to external sources, but that does not work.

tabsetPanel(
tabPanel("Panel1", showOutput("PlotPanel1", 'dimple')),
tabPanel("Panel2", showOutput("PlotPanel2", 'dimple')))

Edit:

I guess I have to include some code in my analytics.js file. Therefore I tried several things, but frankly without knowledge of jQuery, this is just wrong. Can anyone help here?

$( ".selector" ).tabs({
  on('option', 'click', function(l) {
  ga('send', 'event', 'tabPanel', 'tabPanel', $(l.currentTarget).val());
  }
});

Thanks.

Answer 1

If I get it correctly what you would need as an output, you could do something like this (I don't use javascript):

ui <- fluidPage(

  #give an id to your tab in order to monitor it in the server
  tabsetPanel(id = 'tab123',
    tabPanel("Panel1", textOutput("PlotPanel1")),
    tabPanel("Panel2", textOutput("PlotPanel2"))
  )

)

server <- function(input, output) {

  #now server can monitor the tabPanel through the id.
  #make the observer do whatever you want, e.g. print to a file
  observeEvent(input$tab123, {
    print(input$tab123)

    if (input$tab123 == 'Panel1') {
      sink(file = 'c:/Users/TB/Documents/panel1.txt', append = TRUE)
      cat(1)
      sink()
    } else {
      sink(file = 'c:/Users/TB/Documents/panel2.txt', append = TRUE)
      cat(1)
      sink()
    }

  })

}

shinyApp(ui, server) 

Firstly, you give an id to your tabsetPanel. Now that server can access the tab data, you can create an event to observe using observeEvent. Every time a user clicks on each of the tabs, print will print the tab name on the console (this is for you to see what the variable input$tab123 contains). Then you could do whatever you want with that information. Potentially, store it in a data base with a time stamp. In my example above, it creates two files in my documents, writing value 1 every time someone clicks on the tab. Then you just read the file in and sum the ones.