Audio replay only once

[project.travel]

Hello,

I’d like to build a trial where the participants play an audio by clicking the button, see the images (which appear right after the audio is played), optionally play the audio once more (but only one additional time, not more) and choose one of the two images. In the current version of our experiment, the audio is played when I click the play button but it seems that hitting the space bar after that replays the audio however many times I’d like to play. I’ve tried using disable() but was not able to get the right design of the trial. How do I block unlimited replays, and allow replaying just once?

Here is the link to the experiment (You can look at “target_A” trial, although all trials use the same format):

https://farm.pcibex.net/r/wMBIZT/

Thank you very much for your help.

-Jinyoung

[Jeremy]

Hello Jinyoung,

As you found out, the problem with the command disable is that it doesn’t prevent the participant from playing the audio again by simply pressing the spacebar (which is something I should fix). Another problem is there’s no callback command on the Audio element that you could use after wait to execute some commands after later playbacks

So one solution is to use another element’s callback command to execute some code that will run in parallel to the main script, which still needs to be running wait on the Selector element:

newAudio("audio", variable.audio).center().print().wait(),
newTimer("callback",1).callback( getAudio("audio").wait().remove() ).start()

This way, if the participant plays the Audio element again, it will simply disappear from the page

Now, another problem with your script is you print a Canvas element at the center of the page that you scale to fit the page’s dimensions, which results in that Canvas element covering the other elements already on the page, notably the Audio element, which you can no longer click because clicks now target the Canvas element on top of it instead. You should probably rethink the way you display the different elements (eg. by printing everything, including the texts and the Audio element inside the Canvas element) but if you want to keep things how they currently are, a straightforward solution is to make the clicks on the Canvas element “transparent”:

newCanvas("canvas", 1800, 1000)
    .add(200, 380, getImage("nrc") )
    .add(1000, 380, getImage("rrc") )
    .scaling("page")
    .print("center at 50vw", "middle at 50vh")
    .cssContainer("pointer-events", "none")

Jeremy

[project.travel]

Hi Jeremy,

With your codes, it works perfectly as intended. Thank you so much!

-Jinyoung

[nianpo]

Hi Jeremy,

Thank you for your detailed reply all the time!

I am wondering how to make audio replay only twice. That is, participants can replay the audio once or twice, based on their own needs. Do you know how should I modify the codes? Many thanks!

Best wishes,
Nianpo

[Jeremy]

Hi Nianpo,

Just add a second .wait:

newAudio("audio", variable.audio).center().print().wait(),
newTimer("callback",1).callback( getAudio("audio").wait().wait().remove() ).start()

Jeremy

[project.travel]

Hi again,

I have a similar question as before in my experiment https://farm.pcibex.net/r/wMBIZT/.

I’d like a text (defined as “replay”) to appear after the audio is played for the first time, and make it disappear after the replay. (The text means ‘you can play it once more.’) As you can see in my demo link, I tried the following and a few others (in the “practice” trial):

newTimer(“callback”,1)
.callback(getAudio(“audio”).wait().remove())
.callback(getText(“replay”).wait().remove())
.start()

The text doesn’t disappear afther the second audio play, though. Maybe I’m not understanding how the newTimer and the callback works here.

Thank you for your help!

[Jeremy]

Hi,

Remove the Text element in the same callback, and don’t wait for it (you cannot wait for Text elements):

newTimer("callback",1)
  .callback( getText("replay").remove() , getAudio("audio").wait().remove() )
  .start()

Jeremy

[project.travel]

Thanks for the response!

Just to follow up on your suggestion, I tried the new code, but the text now no longer appears on the page. Is there a way to make the text (“You can play it once more”) show up but disappears *after* the participant has replayed the audio?

Thank you in advance for your help!

[Jeremy]

Hi,

My bad, the code should have been

newTimer("callback",1)
  .callback( getAudio("audio").wait().remove() , getText("replay").remove() )
  .start()

Jeremy

• This reply was modified 1 year, 2 months ago by Jeremy. Reason: fix order

[project.travel]

Hi Jeremy,

Sorry, I think this is the same code as the previous one you posted. Is there a missing component in this line?

Thanks again!

[Jeremy]

Oops, I copied and pasted the code from my previous message but completely forgot to edit it!

I’ve updated my message, the commands are now in the appropriate order

Apologies
Jeremy

[project.travel]

Hi Jeremy,

This works perfectly, thanks so much!!

Best,
Sanghee

[Author]

Posts