I working on a shiny project where the app plays sounds at particular time point or when a certain code is run.
The code below is a short example, when I run it on laptop in chrome browser, I can hear the audio as designed.
but not from phone (iphone, safari browser).
Looks like this has to do with the autoplay policy for most mobile browsers.
Any thoughts on how to overcome that?
thank you
library(shiny)
library(shinyjs)
ui <- fluidPage(
useShinyjs(),
h2(textOutput("currentTime")),
br(),
br(),
h2(textOutput("target1")),
h2(textOutput("till1")),
uiOutput('my_audio1')
)
server <- function(input, output, session) {
output$currentTime <- renderText({
invalidateLater(1000, session)
paste("The current time is", format(Sys.time(), "%H:%M"))
})
t1 <- isolate({
Sys.time() + 5
})
output$target1 <- renderText({
paste("Target", t1)
})
output$till1 <- renderText({
invalidateLater(1000, session)
paste("Seconds till target:", round (t1-Sys.time()))
})
sys1 = isolate({
Sys.time()
})
observe({
print(sys1)
print(t1)
print(t1-sys1)
print(as.numeric(t1-sys1, units = "secs")*1000)
})
observe ({
delay (as.numeric(t1-sys1, units = "secs")*1000,
showModal(modalDialog(
title = "",
"Audio should play now"))
)
})
observe({
delay (as.numeric(t1-sys1, units = "secs")*1000,
output$my_audio1 <-renderUI({
tags$audio(src = "https://www.soundhelix.com/examples/mp3/SoundHelix-Song-3.mp3",
type = "audio/mp3", autoplay = NA, controls = NA, style="display:none;")
})
)
})
}
# Create Shiny app ----
shinyApp(ui, server)