Skip to content

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Audio snippet not working in Firefox #3263

Closed
Dazzid opened this issue Mar 29, 2024 · 3 comments
Closed

Audio snippet not working in Firefox #3263

Dazzid opened this issue Mar 29, 2024 · 3 comments

Comments

@Dazzid
Copy link

Dazzid commented Mar 29, 2024

I'm running this code, but we have seen that participants using Firefox can not play the audio samples.
How can I fix this issue?

The code I'm using is this one:

var all_audio_samples = [
                  "01_Rock_F_major_model_2.mp3",
                  "02_Rock_F_major_model_2.mp3",
                  "03_Pop_F7_model_2.mp3",
                  "04_Blues_F_major_model_2.mp3",
                  "05_Blues_E_7_model_1.mp3",
                  "06_Pop_E_model_1.mp3",
                  "07_Pop_Cm7_model_1.mp3",
                  "08_Rock_C_model_1.mp3",
                  "09_Jazz_A_major_model_2.mp3",
                  "10_Rock_D_minor_model_1.mp3"
];

var question_simple = [
  "01_I_IV_V_vi.mp3",
  "02_ii_V_I_vi.mp3",
  "03_vi_ii_V_I.mp3"
  ];

var preload = {
  type: jsPsychPreload,
  audio: all_audio_samples, question_simple
};
/* 2 Harmonic question */
// it's evaluated each time this script or function is run.
var randomQuestion = question_simple[Math.floor(Math.random() * question_simple.length)];

var harmonyQuestion = {
    type: jsPsychSurveyMultiChoice,
    stimulus: `harmony`,
    questions: [
        {
            prompt: "The correct functional progression of the previous audio is:",
            options: harmonicOptions,
            required: true,
            name: 'harmonyProgression'
        }
    ],
    preamble: `<div style="margin-bottom: 20px;">Listen to the recording below and then select the correct functional progression. <br>You must listen to the entire recording before you continue:</div>
             <div class="audio-container">
             <audio id="harmonyAudio" controls>
               <source src="${randomQuestion}" type="audio/mpeg">
               Your browser does not support the audio element.
             </audio> </div>`,
    on_load: function() {
        document.querySelector('#jspsych-survey-multi-choice-next').disabled = true;
        document.getElementById('harmonyAudio').addEventListener('ended', function() {
            document.querySelector('#jspsych-survey-multi-choice-next').disabled = false;
        });
    },
    // Include the played audio file in the data to be saved
    data: {
        questionAudio: randomQuestion
    }
};


timeline.push(harmonyQuestion);
@Dazzid Dazzid changed the title Audio sniped not working in Firefox Audio snippet not working in Firefox Mar 29, 2024
@jodeleeuw
Copy link
Member

Hi @Dazzid

This segment doesn't look quite right:

var preload = {
  type: jsPsychPreload,
  audio: all_audio_samples, question_simple
};

You've got two values going to the audio parameter. Try wrapping them in an array:

var preload = {
  type: jsPsychPreload,
  audio: [all_audio_samples, question_simple]
};

@Dazzid
Copy link
Author

Dazzid commented Mar 29, 2024

ooou! That was the error! Thank you

@Dazzid Dazzid closed this as completed Mar 29, 2024
@Dazzid
Copy link
Author

Dazzid commented Mar 29, 2024

I have another issue. The audio in Firefox stops playing in the middle without finishing the sample.
Have you seen this issue?

@Dazzid Dazzid reopened this Mar 29, 2024
@jspsych jspsych locked and limited conversation to collaborators Jun 4, 2024
@jodeleeuw jodeleeuw converted this issue into discussion #3306 Jun 4, 2024

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants