Reproduce music after click an actionBttn shiny flexdashboard

[cruddy]

Hi all!
I'd like to reproduce a sound after click the actionbttn. I read that using the library shinyjs could work. But I don't know how to do it. Any recommendation? please.
I tried to follow what is mentioned in this post:

R Shiny Sounds Upon Selection

Hello, I would like to play an mp3 (or wav) file whenever a selection is changed on my Shiny app. https://flachboard84.shinyapps.io/stockmarketv2/ I've tried using the tags$audio functionality, but nothing seems to play. https://groups.google.com/g/shiny-discuss/c/zO8hEFCxa0c/m/9B5DlfuVVb8J Does anyone know if this is possible?

Here is the code:

---
title: "Music"
author: "Cruddy"
output:
  flexdashboard::flex_dashboard:
  orientation: rows
  social: menu
runtime: shiny
---

```{r}
library(shiny)
library(shinydashboard)
library(shinyWidgets)
library(shinyjs)

Pestaña

shiny::includeScript('www/howler.js')

Sidebar {.sidebar}

actionBttn("go","Save","pill"
   ,"warning", icon = icon("check-circle"))

observeEvent(input$go, ({
  shinyjs::runjs("var music = new Howl({src: ['www/tono.mp3'],autoplay: true});")
})
)

[ismirsehregal]

Please see my related answers here and here.

[cruddy]

@agus do you have any advice? thanks

[agus]

Hi! Nice to see that my previous answer somewhat helped :).

From the code you shared above it's not clear to me whether you have included useShinyjs() in your UI. or whether you have www/howler.js file in your app dir.

Have you tried running this example to test whether you can hear the coin sound?

---

This post was published by an Appsilon team member. Our company can help you get the most out of RShiny and Posit/RStudio products.

Check our open positions here.

Appsilon: Building impactful RShiny Dashboards and providing R coding services.

[cruddy]

Yes, I tried your example and worked!
Nevertheless, now I'm using flexdashboard, i.e. I'm running the app through a .rmd markdown file. So there is not a ui, nor server variable.

Here is a picture of the code:

And as far as I know, I'm correctly using the howler file.

Thanks for answering @agus !

[agus]

Ok, but it seems that you can add useShinyjs(rmd = TRUE) in your first chunk, as in these examples.

HTH

---

This post was published by an Appsilon team member. Our company can help you get the most out of RShiny and Posit/RStudio products.

Check our open positions here.

Appsilon: Building impactful RShiny Dashboards and providing R coding services.

[cruddy]

Now is working!! (using an internet file)

Just a little detail. Instead of an internet sound, I want to use a local .mp3 file. So I changed the line from:

observeEvent(input$go, ({
   shinyjs::runjs(
       "var music = new Howl({src:['http://www.sonidosmp3gratis.com/sounds/mario-coin.mp3'],
                               autoplay: true});")
})

to this new:

observeEvent(input$go, ({
         shinyjs::runjs(
      "var music = new Howl({src:['www/tono.mp3'],
                               autoplay: true});")
})

And in this case, it doesn't work. I don't know why
Here is the proof that the music file is in the correct folder.

[ismirsehregal]

Have you tried dropping the www folder:

src:['/tono.mp3']?

[cruddy]

Yes, doesn't work @ismirsehregal

[ismirsehregal]

Please see this related post:

Reading in local sound file with Howler in ReactJS

[cruddy]

Nop, is not working @ismirsehregal

[agus]

Progress!

Ok, there must be some issue with the relative path.

Have you tried with src:['tono.mp3'] (without the fwd slash)?

If this doesn't work, maybe you can also try adding the full (not relative) path of your file, like D:/path/to/your/file/tono.mp3 (this seems unlikely to work, but it's worth a try since it is really easy to test).

Last, if everything fails, one very lousy workaround would be to have your .mp3 file hosted somewhere (github?) and source it from there.

HTH

---

This post was published by an Appsilon team member. Our company can help you get the most out of RShiny and Posit/RStudio products.

Check our open positions here.

Appsilon: Building impactful RShiny Dashboards and providing R coding services.

[agus]

Hey @cruddy, did this work in the end?

---

This post was published by an Appsilon team member. Our company can help you get the most out of RShiny and Posit/RStudio products.

Check our open positions here.

Appsilon: Building impactful RShiny Dashboards and providing R coding services.

[cruddy]

@agus no
It works only using the complete link from internet.
But there is something else. When I open the app on the browser (microsoft edge), the sound doesn't play, but locally on R studio, does.

Thanks for the help!