Come si monitorano i video youtube mediante DTM?

    <p>Sample YouTube in OBJECT embed tag</p>
     <object id="myytplayer" width="425" height="344" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
        <param name="movie" value="http://www.youtube.com/v/AhgtoQIfuQ4?fs=1&rel=0&enablejsapi=1&playerapiid=myytplayer"></param>
        <param name="allowFullScreen" value="true"></param>
        <param name="allowscriptaccess" value="always"></param>
        <embed id="myytplayer2" src="http://www.youtube.com/v/AhgtoQIfuQ4?fs=1&rel=0wcv8zQo9HyU&enablejsapi=1&playerapiid=myytplayer2" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed>
    </object>

<p>YouTube  video in iframe embed tag</p>
<iframe id="player1" frameborder="0" width="425" height="344" allowfullscreen="1" title="YouTube video player" src="https://www.youtube.com/embed/wcv8zQo9HyU?enablejsapi=1">

    <script type="text/javascript" src="https://www.youtube.com/iframe_api"></script>
     
    <script type="text/javascript">
        var video_obj=null;
        var video_length=0;
        var video_name='Movie name ' + new Date().getTime();
     
     
        // 3. This function creates an <iframe> (and YouTube player)
        //    after the API code downloads.
        var player;
        function onYouTubeIframeAPIReady() {
            console.log('*** iFrame embed onYouTubeIframeAPIReady');
     
            player = new YT.Player("player1", {
              
              events: {
              
                'onReady': onPlayerReady,
                'onStateChange': onPlayerStateChange
              }
            });
        }
     
        // 4. The API will call this function when the video player is ready.
        function onPlayerReady(event) {
            // event.target.playVideo();
            console.log('*** iFrame embed onPlayerReady ', player);
        }
     
        // 5. The API calls this function when the player's state changes.
        //    The function indicates that when playing a video (state=1),
        //    the player should play for six seconds and then stop.
        var done = false;
        function onPlayerStateChange(event) {
            console.log('*** iFrame embed onPlayerStateChange ' + event.data + ' --- YT Player state ' + YT.PlayerState.PLAYING, player.getCurrentTime(), player);
            /*
            if (event.data == YT.PlayerState.PLAYING && !done) {
                setTimeout(stopVideo, 6000);
                done = true;
            }
            */
            video_name = player.getVideoData();
            video_name = video_name.title;
            video_length = player.getDuration();
     
            // if(event.data === YT.PlayerState.PLAYING && (event.data === 1 || event.data < 0)){
            if((event.data === 1 || event.data < 0) && YT.PlayerState.PLAYING === 1){
                    //*-* PLAY
                    console.log("*-* Player is on play mode " + event.data + ' ' + player.getCurrentTime(), s);
                    if(player.getCurrentTime() === 0) {
                        s.Media.open(video_name, video_length, 'Youtube Object Embed');
                        s.Media.play(video_name, player.getCurrentTime());
                    } else {
                        s.Media.play(video_name, player.getCurrentTime());
                    }
                }else if(event.data === 2){
                    //*-* PAUSE --- CAN USE THIS FOR ENDING TOO =-- check on time -5 sec!!
                    console.log("*-* Player is on pause mode " + event.data+' '+player.getCurrentTime());
                    s.Media.stop(video_name, player.getCurrentTime());//this will cause the monitor to have media.event='STOP'
                }else if(event.data === 3){
                    //*-* SKIPPING
                    console.log("*-* Player is on skipping mode " + event.data);
                    s.Media.stop(video_name, player.getCurrentTime());//this will cause the monitor to have media.event='STOP'
                }else if(event.data === 0){
                    //*-* Completed
                    console.log("*-* Player has been completed " + event.data);
                    s.Media.stop(video_name, player.getCurrentTime());
                    s.Media.close(video_name);
                }
        }
      
            function onYouTubePlayerReady(playerId) {
                video_obj=document.getElementById(playerId);//playerId
     
                video_obj.addEventListener("onStateChange", "onytplayerStateChange");
     
                video_length= video_obj.getDuration();
     
                console.log('*-* Youtube Video Ready - in call back function --- ' + playerId, 'video duration= ' + video_obj.getDuration(), 'video current time= ' + video_obj.getCurrentTime());
            }
     
     
            function onytplayerStateChange(newState) {
                console.log("*-* Player's new state: " + newState);
                //-1 --> <0 is not started
                if(newState===1){
                    //*-* PLAY
                    console.log("*-* Player is on play mode " + newState + ' ' + video_obj.getCurrentTime(), s);
                    if(video_obj.getCurrentTime() === 0) {
                        s.Media.open(video_name, video_length, 'Youtube Object Embed');
                        s.Media.play(video_name, video_obj.getCurrentTime());
     
                        // s.Media.play(video_name, video_obj.getCurrentTime(),5,'a segment name', 30);
                    } else {
                        s.Media.play(video_name, video_obj.getCurrentTime());
                    }
                }else if(newState===2){
                    //*-* PAUSE --- CAN USE THIS FOR ENDING TOO =-- check on time -5 sec!!
                    console.log("*-* Player is on pause mode " + newState+' '+video_obj.getCurrentTime());
                    s.Media.stop(video_name, video_obj.getCurrentTime());//this will cause the monitor to have media.event='STOP'
     
                    // s.Media.stop(video_name, video_obj.getCurrentTime());//this will cause the monitor to have media.event='STOP'
                    //*-*if not used (ie. not pausing) then CLOSE will kick in when the video completes otherwise video completes will also send 'STOP'
                }else if(newState===3){
                    //*-* SKIPPING
                    console.log("*-* Player is on skipping mode " + newState);
                    s.Media.stop(video_name, video_obj.getCurrentTime());//this will cause the monitor to have media.event='STOP'
                }else if(newState===0){
                    //*-* Completed
                    console.log("*-* Player has been completed " + newState);
                    s.Media.stop(video_name, video_obj.getCurrentTime());
                    s.Media.close(video_name);
                }
            }
     
        </script>

    s.loadModule("Media");
     
    s.Media.onLoad = function() {
        console.log('**** MEDIA module loaded');
     /*Configure Media Module Functions */
     
     s.Media.autoTrack= false;
     s.Media.trackWhilePlaying=false;
     // s.Media.trackSecond=0; // set to 30 if milestone in seconds
      console.log('**** MEDIA module loaded1');
     s.Media.completeByCloseOffset = true; //*** Enabled if you want to allow the video to be completed a few seconds before the actual end of the video
     s.Media.completeCloseOffsetThreshold = 10; 
     
     s.Media.trackVars="events,eVar16,eVar17"; //**NOTE: Add additional data which will be pushed either in the plugin or on the page
     s.Media.trackEvents="event16,event17,event18,event19,event20,event21"; //**NOTE: Add additional data which will be pushed either in the plugin or on the page
     s.Media.trackMilestones="25,50,75";
     s.Media.playerName="My TEst You tube video tracking";
     s.Media.segmentByMilestones = false;
     s.Media.trackUsingContextData = true;
       console.log('**** MEDIA module loaded2');
     s.Media.contextDataMapping = {
      "a.media.name":"eVar16",
      "a.media.segment":"",
      "a.contentType":"eVar17",
      "a.media.timePlayed":"event18",
      "a.media.view":"event16",
      "a.media.segmentView":"",
      "a.media.complete":"event17",
      "a.media.milestones": {
       25:"event19",
       50:"event20",
       75:"event21"
      }
     }
       console.log('**** MEDIA module loaded3');
     /*
     * can use the below IF wanna pass additional data --- Need to update s.Media.trackVars --- BUT we could potential set it on above var and avoid using the below
     */
     s.Media.monitor =function(s, media){
      console.log('**** MEDIA module loaded4');
        console.log(media);
      //https://marketing.adobe.com/resources/help/en_US/sc/appmeasurement/video/video_mediamonitor.html
      console.log('in the video monitor, can help add additional evar, prop or events', media);
      if(media.event == "OPEN") {
       s.contextData = s.Media.contextDataMapping
       s.Media.track(media.name);
      } else if(media.event == "MILESTONE") {
       s.contextData = s.Media.contextDataMapping
       s.Media.track(media.name);
      } else if(media.event == "CLOSE") {
       s.contextData = s.Media.contextDataMapping
       s.Media.track(media.name);
      }
     }
     
     
    }