HI @wakecarter
thank you so much for this! since i dont know much about JS i found it hard to change you youtube html file to my own.
would some help solving that.
my youtube link is Headspace | Mini meditation | Find your focus - YouTube
i have used your link and it works (online only not on the builder)
i would like to make some changes to the code so that instead of a continue button in the youtube.html file, the movie will automatically close once the movie ends.
I guess i need to make changes in the iframe code and add a time condition before continue_routine = false?,( i removed the continue button from the html file)
my video’s length is exactly 1:16 min.
I know how use the timer in python but no sure how to work with your JS script.
let src = 'youtube.html';
params = {}; // Results added here after form is submitted
continue_routine = true; // Routines can't be ended from within Begin Routine
$(document).ready(function() {
// Add custom contents from html file using an iframe:
$('body').append('<div id="iframe-o" style="visibility: hidden; position: relative; display: table; margin: auto;"><div id="iframe-m" style="display: table-cell; vertical-align: middle;"><div id="iframe-i" style="display: inline-block; width:100%; overflow-y: auto; overflow-x: hidden;"><iframe id="iframe" src="'+src+'" frameborder=0 style="width: 100%"></iframe></div></div></div>');
$('#iframe').on('load',function(iframe){
// Auto-adjust iframe size:
$(this).contents().find('html').css({ 'display': 'table', 'width': '100%', 'overflow-x': 'hidden' });
$('#iframe-o').height($(window).height()-20, true);
$('#iframe-m').width($(this).contents().find('html').width()+20);
$('#iframe-i').height ( Math.min ( $(this).contents().find('html').height()+20, $(window).height()-20 ), true );
$(this).height($(this).contents().find('html').height());
$('#iframe-o').css('visibility','visible');
// If iframe contains a form, then capture its output:
$(this).contents().find('form').on('submit',function(e){
e.preventDefault();
$.each($(this).serializeArray(),function(i, param){
params[param.name] = param.value;
psychoJS.experiment.addData(param.name, param.value);
});
console.log ( 'DEBUG:FRM', params );
// Remove iframe and continue to next routine when done:
$('#iframe-o').remove();
continue_routine = false;
});
});
});
//$('#iframe').attr( 'src', function(i,val){ return val;} );
Also is there a way to make the video size a full screen and not a specific size?
hope i am not bothering you with my endless questions.
hi thank you for the fast reply
for some reason the routine continues in the background but the video is not closing unless i add the continue button and click on it
Regarding the screen size, the screen actually got smaller when i changed to 100%
Hi @wakecarter, I have a set of 30 youtube links and I want to play those videos randomly for the user of my experiment, So I want to play the video link and it should be embedded within my experiment. However, the order is randomly generated and a particular video link should be played.
Can you please assist me with the following task.
Have you managed to set up your experiment so it plays one video link and an Excel file with the YouTube codes of the 30 videos? I think it should be fairly easy to edit it to take the selected video from the Excel file?
I do have an excel in which I have youtube links of the 30 videos, however I was unable to set up the experiment can you please assist. Also I want to present a questionnaire once the video ends instead of the continue button
@wakecarter I am unable to run your experiment Pavlovia locally , it is not working and giving errors in the version2020.2 of the PsychoPy . Can you please assist
I’m having some difficulty doing this. I can hard code a video url into the html file and it plays, but I’m not sure how to dynamically change it. I have a separate csv that has all of the links (with a loop that adds each url to a list at the start of the experiment), but I’m not sure how to pass it the variable into the html file.
Hi @wakecarter,
Thank you so much for your demos, they have been really helpful!
I am having some difficulty implementing this. Originally, I was getting a " * ReferenceError: showVideo is not defined" I fixed this by editing the code to what you see in the picture below. I also added the specific identifier for the video I want to use. However, I am getting a “404 not found” error. I am not sure how to resolve this, I assume there is some issue with the code finding and presenting the correct video from youtube but I do not know how to resolve the issue. I would appreciate any suggestions you have.
