YouTube Autoplay No branding etc. Countdown Timers V7

YouTube has really added some features to their hosting so that you can control how the content looks, autoplay, etc. that Brian posted about in the other forum. the iframe API allows playback on iOS devices without any hoops as far as I can tell. Works fine on iPad, iphone does funky stuff though. Beats anything else I've tried though.

It is almost there for video hosting as a sole source solution. Only downside I can see is that you can still pause or enlarge by clicking and the file name, uploader, and youtube logo are there during pauses. Here is a small example of one that combines an countdown to forward and a countdown submit button. Soon as I get some time, I want to have an event listener fire off the submit button as soon as the player ends.

This is essentially built on some of the posts of Bahadir, Paul Moon, Justin Luster, and Brian of Sawtooth and their provided stuff, but you can see it all in one place and some of the nice stuff that youtube allows you to do. Ideally the submit button would be clicked after the video ends so you can't see the replay, embedd, or link tags.

Hopefully someone looking for a demo file can use this.


https://www.sawtoothsoftware.com/forum.php?cmd=show&thread=1682&posts=7
https://www.sawtoothsoftware.com/forum.php?cmd=show&thread=1262&posts=1


Explanation of the YouTube iframe embed API

http://code.google.com/apis/youtube/iframe_api_reference.html

Demo:

jbresearchllc.com/surveys/video/videologin.html

ssi example file:

jbresearchllc.com/surveys/video/video.zip


Youtube code:

<center><I>Please watch the film below carefully.</i><P>
<iframe width="560" height="315" src="http://www.youtube.com/embed/THpMbN3cD2c?rel=0&autoplay=1&controls=0&modestbranding=1&fs=0" frameborder="0" allowfullscreen="false"></iframe></center>


Header for submit after x time (DELETE THIS IF YOU DON'T WANT THE PAGE TO GO FORWARD AFTER 16 SECONDS)

<script type="text/javascript">
document.body.onLoad=WaitSubmit();
</script>


Code for HTML head
<script language="javascript">

function ClickSubmit()
{
document.mainform.submit();
}

function WaitSubmit()
{
window.setTimeout("ClickSubmit()",16000);
}
</script>

<script type="text/javascript">

function disableNext ( )
{
originalValue = document.mainform.sys_next_button.value;
document.mainform.sys_next_button.disabled = true;
document.mainform.sys_next_button.value = "Please wait (" + timeOutRemaining-- + " seconds)";
setTimeout ( "countDown()", 1000 );
}

function countDown() {
document.mainform.sys_next_button.value = "Please wait (" + timeOutRemaining + " seconds)";
if(timeOutRemaining > 0) {
timeOutRemaining--;
setTimeout("countDown();", 1000);
} else {
enableNextButton();
}
}

function enableNextButton ()
{
document.mainform.sys_next_button.disabled = false;
document.mainform.sys_next_button.value = originalValue;

}

window.onload = disableNext;
var originalValue;
var timeOutRemaining = 11; //3 Seconds


</script>

Resolved
1 reply