Yesterday I posted a solution to my own problem regarding how to play and stop sounds in R Shiny using shinyjs. Rather annoyingly, today I decided to update R and also then had to reinstall all the packages. It now seems that shinyjs has changed, and my solution does not work anymore. The issue appears to be with how external js files are called, but I cannot work out what to do differently. Shinjy js now asks for both 'script' and 'functions' to be defined when using extendShinyjs(), but making this change does not seem to do anything. I also cannot simply include the js code directly as text in the R document, because the real files are prohibitively long (they are a plain text representation of sounds). I've also tried placing the functions in a www folder in the same directory as the app. Does anyone have any idea what is going wrong here?
'birds' is a function that plays a bird song, 'marbles' is a function that plays the sounds of rolling marbles, and 'stopper' stops and sounds from being played. When the app was working (literally yesterday!), you would click an action button, and it would stop the previous sound and play a new sound (marbles or birds), or simply stop any sounds that were playing (stop sounds button).
library(shiny)
library(shinyjs)
ui <- fluidPage(
useShinyjs(),
extendShinyjs(script = "marbles.js"),
extendShinyjs(script = "birds.js"),
extendShinyjs(script = "stopper.js"),
# I have also tried:
extendShinyjs(script = "marbles.js", functions = c('marbles')),
extendShinyjs(script = "birds.js", functions = c('birds')),
extendShinyjs(script = "stopper.js", functions = c('stopper')),
column(10, offset = 1,
align = "center",
fluidRow(column(4,
align = "center",
column(10,
align = "center",
offset = 1,
br(),
actionButton('sound1','Sound 1', width = '100%',
style="color: #ffffff; background-color: #35467b; border-color: #2e1911"))),
column(4,
align = "center",
column(10,
align = "center",
offset = 1,
br(),
actionButton('sound2','Sound 2', width = '100%',
style="color: #ffffff; background-color: #1dbd6b; border-color: #1dbd6b"))),
column(4,
align = "center",
column(10,
align = "center",
offset = 1,
br(),
actionButton('stopper','Stop sounds', width = '100%',
style="color: #ffffff; background-color: #b73838; border-color: #b73838")))
)),
)
server <- function(input, output) {
observeEvent(input$sound1, {
js$stopper()
js$birds()
})
observeEvent(input$sound2, {
js$stopper()
js$marbles()
})
observeEvent(input$stopper, {
js$stopper()
})
}
# Run the application
shinyApp(ui = ui, server = server)
The sound stopping function is simple:
shinyjs.stopper = function() {
snd.pause();
}
Then the two sound functions would be the following, but you insert your own base64 plain text in the 'new audio' part (to convert a wav to base64, see e.g.: WAV to Base64 | Audio | Base64 Encode | Base64 Converter | Base64). All the javascript functions should be saved as js files in the same folder as your app:
shinyjs.birds = function() {
snd = new Audio("data:audio/wav;base64,blablablabla");
snd.play();
}
shinyjs.marbles = function() {
snd = new Audio("data:audio/wav;base64,blablablabla");
snd.play();
}