"Calculation In Process..." busy indictor

server.R

shinyServer(function(input, output) {
  output$obs <- renderUI({
    sliderInput("obs", "Number of observations:", 
                min = 10000, max = 90000, 
                value = 50000, step = 10000)
  })
  output$distPlot <- renderPlot({
    if (!is.null(input$obs)) {
      dist <- NULL
      for (i in 1:input$obs) {
        dist <- c(dist, rnorm(1))
      }
      hist(dist, breaks = 100)
    }
  })
})

ui.R

shinyUI(bootstrapPage(
  # Add custom CSS & Javascript;
  tagList(
    tags$head(
      tags$link(rel="stylesheet", type="text/css",href="style.css"),
      tags$script(type="text/javascript", src = "busy.js")
    )
  ),
  div(class = "busy",  
      p("Calculation in progress.."), 
      img(src="http://imageshack.us/a/img827/4092/ajaxloaderq.gif")
  ),
  div(class = "span4", uiOutput("obs")),
  div(class = "span8", plotOutput("distPlot"))
))

www\busy.js

setInterval(function(){
  if ($('html').attr('class')=='shiny-busy') {
    setTimeout(function() {
      if ($('html').attr('class')=='shiny-busy') {
        $('div.busy').show()
      }
    }, 1000)
  } else {
    $('div.busy').hide()
  }
}, 100)

www\style.css

div.busy { 
  position:absolute;
  top: 40%;
  left: 50%;
  margin-top: -100px;
  margin-left: -50px;
  display:none;
  background: rgba(230, 230, 230, .8);
  text-align: center;
  padding-top: 20px;
  padding-left: 30px;
  padding-bottom: 40px;
  padding-right: 30px;
  border-radius: 5px;
}