<script>
if (!window['YT']) {
var YT = { loading: 0, loaded: 0 };
}
if (!window['YTConfig']) {
var YTConfig = { 'host': 'http://www.youtube.com' };
}
if (!YT.loading) {
YT.loading = 1; (function () {
var l = [];
YT.ready = function (f) {
if (YT.loaded) {
f();
} else {
l.push(f);
}
};
window.onYTReady = function () {
YT.loaded = 1;
for (var i = 0; i < l.length; i++) {
try {
l[i]();
} catch (e) { }
}
};
YT.setConfig = function (c) {
for (var k in c) {
if (c.hasOwnProperty(k)) {
YTConfig[k] = c[k];
}
}
};
var a = document.createElement('script');
a.type = 'text/javascript';
a.id = 'www-widgetapi-script';
a.src = 'https://s.ytimg.com/yts/jsbin/www-widgetapi-vflnjBBxk/www-widgetapi.js';
a.async = true;
var c = document.currentScript;
if (c) {
var n = c.nonce || c.getAttribute('nonce');
if (n) {
a.setAttribute('nonce', n);
}
}
var b = document.getElementsByTagName('script')[0];
b.parentNode.insertBefore(a, b);
})();
}
</script>
<div style="width:100px;height:100px">
<iframe width="100%"
height="100"
src="https://www.youtube.com/embed/UPRHN_OfLok"
frameborder="0"
allow="autoplay;
encrypted-media"
allowfullscreen></iframe>
</div>
<div id="xplayer"></div>
<script>
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('xplayer', {
height: '360',
width: '640',
videoId: 'UPRHN_OfLok',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
setTimeout(stopVideo, 6000);
done = true;
}
}
function stopVideo() {
player.stopVideo();
}
</script>