<!DOCTYPE html>
<html>
<style type="text/css">
    html, body {
    height:100%;
    width:100%;
    margin: 0;
    padding: 0;
    background:[BG_COLOR];
    overflow:hidden;
    position:relative;
    }

</style>

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <script src="https://www.youtube.com/iframe_api" onerror="window.location.href='ytplayer://onYouTubeIframeAPIFailedToLoad'"></script></head>
<body>
<div id="player"></div>
</body>

<script type="text/javascript">
      var player;
      function onYouTubeIframeAPIReady() {
		  player = new YT.Player('player', {
		  height: '100%',
		  width: '100%',
		  events: {
			'onReady': onPlayerReady,
			'onStateChange': onPlayerStateChange,
			'onPlaybackQualityChange':onPlayerPlaybackQualityChange,
			'onError': onPlayerError
		  },

		  playerVars: {
			'autoplay':[AUTO_PLAY],
			'autohide':[AUTO_HIDE],
			'rel': [REL],
			'showinfo': [SHOW_INFO],
			'enablejsapi': [ENABLE_JS_API],
			'disablekb': [DISABLE_KB],
            'iv_load_policy': [IV_LOAD_POLICY],
            'controls': [CONTROLS],
            'origin': '[ORIGIN]',
            'fs': [FS]
		  }
		});
	  }

    function onPlayerReady(event) {
        onReady('player is ready');
    }

    var timerId = 0;
    function onPlayerStateChange(event) {
        clearTimeout(timerId);
        switch (event.data) {
          case YT.PlayerState.UNSTARTED:
            onStateChange("UNSTARTED");
            break;
          case YT.PlayerState.ENDED:
            onStateChange("ENDED");
            break;
          case YT.PlayerState.PLAYING:
            sendDuration();
            onStateChange("PLAYING");
            timerId = setInterval(function() {
              setCurrentSeconds();
            }, 200);
            break;
          case YT.PlayerState.PAUSED:
            onStateChange("PAUSED");
            break;
          case YT.PlayerState.BUFFERING:
            onStateChange("BUFFERING");
            setCurrentSeconds();
            break;
          case YT.PlayerState.CUED:
            onStateChange("CUED");
            break;
        }
    }

    function onPlayerPlaybackQualityChange(playbackQuality) {
        onPlaybackQualityChange('playback quality changed to ' + playbackQuality.data);
    }

    function onPlayerError(e) {
        onError(e.data);
    }

    function onPlayerApiChange() {
        onApiChange('The player API changed');
    }

    function onReady(e){
       prompt("onReady", e);
    }

    function onStateChange(e){
        prompt("onStateChange", e);
    }

    function onPlaybackQualityChange(e){
        prompt("onPlaybackQualityChange", e);
    }

    function onError(e){
        prompt("onError", e);
    }

    function onApiChange(e){
        prompt("onApiChange", e);
    }

    function setCurrentSeconds(){
        prompt("currentSeconds", player.getCurrentTime());
    }

    function sendDuration(){
        prompt("duration", player.getDuration());
    }

    function setLog(msg){
        prompt("logs", msg);
    }

    function onSeekTo(startSeconds){
        setLog("onSeekTo:" + startSeconds);
        player.seekTo(startSeconds, true)
    }

    function onVideoPause(){
        setLog("onVideoPause()");
        player.pauseVideo();
    }

    function onVideoPlay(){
        setLog("onVideoPlay()");
        player.playVideo();
    }

    function onVideoStop() {
        setLog("onVideoStop()");
        player.stopVideo();
    }

    function onHideControls(){
        setLog("onHideControls()");
    }

    function loadVideo(videoId, startSeconds){
        setLog("loadVideo:" + videoId + "_" + startSeconds);
        player.loadVideoById(videoId, startSeconds);
    }

    function cueVideo(videoId, startSeconds){
        setLog("cueVideo:"+videoId);
        player.cueVideoById(videoId, startSeconds);
        player.playVideo();
    }

</script>
</html>