var tag = document.createElement('script');

​

tag.src = "https://www.youtube.com/iframe_api";

var firstScriptTag = document.getElementsByTagName('script')[0];

firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

​

// 3. This function creates an <iframe> (and YouTube player)

//    after the API code downloads.

var player;

​

function onYouTubeIframeAPIReady() {

    player = new YT.Player('player', {

        height: '390',

        width: '640',

        videoId: 'l-gQLqv9f4o',

        events: {

            'onReady': onPlayerReady,

            'onStateChange': onPlayerStateChange

        }

    });

}

​

// 4. The API will call this function when the video player is ready.

var seconds = 0;

var timer;

function onPlayerReady(event) {

    event.target.playVideo();

}

​

function onPlayerStateChange(event) {

    if (event.data == YT.PlayerState.PLAYING) {

        //player play

        timer = setInterval(

          function() {

            seconds++;

            console.log("you watch: "+ seconds +" seconds of the video");

          }, 1000

        );

    } else {

      //player pause

      clearInterval(timer);

    }

}

​

function stopVideo() {

    player.stopVideo();

}