Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Play video fully: set a timer starting from video launch

evhenii_access
Topic Author
Offline
New Member

More

1 year 11 months ago #267281 by evhenii_access

Play video fully: set a timer starting from video launch was created by evhenii_access

Please help us help you and fill where relevant:
Your LimeSurvey version: LimeSurvey Cloud Version 6.6.5
Own server or LimeSurvey hosting: LimeSurvey hosting
Survey theme/template: Bootswatch
==================
I’d like to show a 30-sec video to participants and make sure they played it fully before proceeding to the next question. I’m using ‘Insert HTML5 video’ button, the video is stored in Resource folder. As I see it, there could be two options:Option 1. Use the LimeSurvey built-in timer for question, and start video automatically. However, based on other discussions on this forum, most likely browsers will not allow autoplay. Is it possible to use any other way to embed video that would allow this? Option 2. Have respondents launch the video with Play button, find the way to capture this action and set the 30-second timer starting from this moment. Would it be possible to include some JS code doing this?

Please Log in to join the conversation.

Joffm
Offline
LimeSurvey Community Team

More

1 year 11 months ago - 1 year 11 months ago #267282 by Joffm

Replied by Joffm on topic Play video fully: set a timer starting from video launch

Hi,
you may use this

Code:

<div class="embed-responsive embed-responsive-16by9">
  <video controls id="myvideo">
    <source src="https://www.myServer.de/userfiles/happypeanuts.mp4" type="video/mp4" /> browser unterstützt dieses Format nicht.
  </video>
</div>

<script type="text/javascript" charset="utf-8">
  $(document).ready(function() {
    // Hide the buttons
    $('#ls-button-submit').hide();
    $('#ls-button-previous').hide();

    var vid = document.getElementById("myvideo");
    vid.volume = 0.3;
    vid.onended = function() {
       // Show the  buttons
       $('#ls-button-previous').show();
       $('#ls-button-submit').show();
       // If you want to proceed to the next qiestion automatically
       $('#ls-button-submit').show().trigger('click');
    }
  });
</script>

Of course, "autoplay" may be the crucial point.
If the respondent has to start the video (the controls are visible) he also can drag the progress bar to the end.