API tools faq
paste
verygoodplugins

Untitled

verygoodplugins
Oct 30th, 2020
258
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 10.65 KB | None | 0 0
raw download clone embed print report
  1. // Youtube API has to be in the global scope
  2. var YTdeferred = jQuery.Deferred();
  3. window.onYouTubeIframeAPIReady = function() {
  4.     YTdeferred.resolve(window.YT);
  5. };
  6.  
  7. jQuery(document).ready(function($){
  8.  
  9.     // Apply tags
  10.  
  11.     function applyTags(tags) {
  12.  
  13.         var data = {
  14.             'action'     : 'apply_tags',
  15.             'tags'       : tags,
  16.         };
  17.  
  18.         $.post(wpf_mt_ajax.ajaxurl, data);
  19.  
  20.     }
  21.  
  22.     function sortNumber(a,b) {
  23.         return a - b;
  24.     }
  25.  
  26.     // Get data attributes from player
  27.  
  28.     function getPlayerData(el) {
  29.  
  30.         var playerData = $(el).data();
  31.  
  32.         // Build object of registered timecodes and tags
  33.        
  34.         if( typeof playerData.wpf_tags_timecode !== 'undefined' && typeof playerData.wpf_timecode !== 'undefined' ) {
  35.  
  36.             playerData.timecodeTags = {};
  37.  
  38.             $.each(playerData, function(index, val) {
  39.  
  40.                  if(index.startsWith('wpf_timecode')) {
  41.  
  42.                     // Get index of timecode
  43.                     var i = index.replace('wpf_timecode', '');
  44.  
  45.                     // Convert mm:ss format to seconds
  46.                     var pieces = val.toString().split(":");
  47.  
  48.                     if(pieces.constructor === Array) {
  49.                         var seconds = pieces.pop();
  50.                         $.each(pieces, function(pieceIndex, pieceVal) {
  51.                             seconds = parseFloat(seconds) + (pieceVal * 60);
  52.                         });
  53.                     } else {
  54.                         var seconds = pieces;
  55.                     }
  56.  
  57.                     playerData.timecodeTags[seconds] = playerData['wpf_tags_timecode' + i];
  58.  
  59.                  }
  60.  
  61.             });
  62.  
  63.         }
  64.  
  65.         return playerData;
  66.  
  67.  
  68.     }
  69.  
  70.     // Mediaelement.js embeds
  71.  
  72.     $('video').each(function(index, el) {
  73.        
  74.         var playerData = getPlayerData(el);
  75.  
  76.         if ( typeof playerData.wpf_tags_start == 'undefined' && typeof playerData.wpf_tags_complete == 'undefined' && typeof playerData.timecodeTags == 'undefined' ) {
  77.             return;
  78.         }
  79.  
  80.         new MediaElement($(this).attr('id'), {
  81.  
  82.             success: function (mediaElement, domObject) {
  83.  
  84.                 if ( typeof playerData.wpf_tags_start != 'undefined' ) {
  85.  
  86.                     mediaElement.addEventListener('play', function(e) {
  87.  
  88.                         // mediaElement start video
  89.  
  90.                         applyTags(playerData.wpf_tags_start);
  91.  
  92.                     });
  93.  
  94.                 }
  95.  
  96.                 if ( typeof playerData.wpf_tags_complete != 'undefined' ) {
  97.  
  98.                     mediaElement.addEventListener('ended', function(e) {
  99.  
  100.                         // mediaElement video complete
  101.  
  102.                         applyTags(playerData.wpf_tags_complete);
  103.  
  104.                     });
  105.  
  106.                 }
  107.  
  108.                 if ( typeof playerData.timecodeTags != 'undefined' ) {
  109.  
  110.                     mediaElement.addEventListener('timeupdate', function(e) {
  111.  
  112.                         // mediaElement player progress
  113.  
  114.                         if(Object.keys(playerData.timecodeTags).length == 0)
  115.                             return;
  116.  
  117.                         $.each(playerData.timecodeTags, function(timecode, tags) {
  118.                              
  119.                              if(mediaElement.currentTime >= timecode) {
  120.                                 applyTags(tags);
  121.                                 delete playerData.timecodeTags[timecode];
  122.                              }
  123.  
  124.                         });
  125.  
  126.                     });
  127.  
  128.                 }
  129.  
  130.             }
  131.         });
  132.  
  133.     });
  134.  
  135.     function initializeIFrames() {
  136.  
  137.         // iFrame embeds
  138.         $('iframe').each(function(index, el) {
  139.  
  140.             var playerData = getPlayerData(el);
  141.  
  142.             if ( typeof playerData.wpf_tags_start == 'undefined' && typeof playerData.wpf_tags_complete == 'undefined' && typeof playerData.timecodeTags == 'undefined' ) {
  143.                 return;
  144.             }
  145.  
  146.             var playerType = $(this).attr('data-player_type');
  147.  
  148.             if(playerType == 'vimeo') {
  149.  
  150.                 var player = new Vimeo.Player($(this));
  151.  
  152.                 if ( typeof playerData.wpf_tags_start != 'undefined' ) {
  153.  
  154.                     var startDone = false;
  155.  
  156.                     player.on('play', function() {
  157.  
  158.                         // Vimeo started video
  159.                        
  160.                         if(startDone == false) {
  161.                             startDone = true;
  162.                             applyTags(playerData.wpf_tags_start);
  163.                         }
  164.                     });
  165.  
  166.                 }
  167.  
  168.                 if ( typeof playerData.wpf_tags_complete != 'undefined' ) {
  169.  
  170.                     var completeDone = false;
  171.                    
  172.                     player.on('timeupdate', function(data) {
  173.  
  174.                         if (data.percent >= 0.95 && completeDone == false) {
  175.  
  176.                             // Vimeo 95% complete
  177.  
  178.                             completeDone = true;
  179.                             applyTags(playerData.wpf_tags_complete);
  180.                         }
  181.  
  182.                     });
  183.  
  184.                 }
  185.  
  186.                 if ( typeof playerData.timecodeTags != 'undefined' ) {
  187.  
  188.                     player.on('timeupdate', function(data) {
  189.  
  190.                         // Vimeo player progress
  191.  
  192.                         if( Object.keys( playerData.timecodeTags ).length == 0 ) {
  193.                             return;
  194.                         }
  195.  
  196.                         $.each(playerData.timecodeTags, function(timecode, tags) {
  197.  
  198.                             if ( timecode.endsWith('%') ) {
  199.  
  200.                                 // Percentage based tracking
  201.  
  202.                                 var percent = parseInt( timecode.replace('%', '') );
  203.                                 percent = percent / 100;
  204.  
  205.                                  if( data.percent >= percent ) {
  206.                                     applyTags(tags);
  207.                                     delete playerData.timecodeTags[timecode];
  208.                                  }
  209.  
  210.                             } else {
  211.                              
  212.                                  if(data.seconds >= timecode) {
  213.                                     applyTags(tags);
  214.                                     delete playerData.timecodeTags[timecode];
  215.                                  }
  216.  
  217.                             }
  218.  
  219.                         });
  220.  
  221.                     });
  222.  
  223.                 }
  224.  
  225.             } else if(playerType == 'youtube') {
  226.  
  227.                 var playerId = $(this).attr('id');
  228.  
  229.                 YTdeferred.done(function(YT) {
  230.  
  231.                     var player;
  232.                     var appliedStart = false;
  233.  
  234.                     player = new YT.Player(playerId, {
  235.                         events: {
  236.                             'onReady': onPlayerReady,
  237.                             'onStateChange': onPlayerStateChange
  238.                         }
  239.                     });
  240.  
  241.                     // Elementor image overlay support
  242.                     $('.elementor-custom-embed-image-overlay').parent().has( '#' + playerId ).click(function(event) {
  243.                        
  244.                         if( typeof playerData.wpf_tags_start != 'undefined' ) {
  245.                             applyTags(playerData.wpf_tags_start);
  246.                             appliedStart = true;
  247.                         }
  248.  
  249.                     });
  250.  
  251.                     function onPlayerStateChange(event) {
  252.  
  253.                         if (event.data == YT.PlayerState.PLAYING && typeof playerData.wpf_tags_start != 'undefined' ) {
  254.  
  255.                             // YouTube started video
  256.  
  257.                             if( appliedStart == false ) {
  258.                                 applyTags(playerData.wpf_tags_start);
  259.                                 appliedStart = true;
  260.                             }
  261.  
  262.                         } else if( event.data == YT.PlayerState.ENDED && typeof playerData.wpf_tags_complete != 'undefined' ) {
  263.  
  264.                             // YouTube finished video
  265.  
  266.                             applyTags(playerData.wpf_tags_complete);
  267.  
  268.                         }
  269.  
  270.                     }
  271.  
  272.                     function onPlayerReady(event) {
  273.  
  274.                         if ( typeof playerData.timecodeTags != 'undefined' ) {
  275.  
  276.                             var videotime = 0;
  277.                             var timeupdater = null;
  278.  
  279.                             function updateTime() {
  280.  
  281.                                 var oldTime = videotime;
  282.  
  283.                                 if(player && player.getCurrentTime) {
  284.                                     videotime = player.getCurrentTime();
  285.                                 }
  286.  
  287.                                 if(videotime !== oldTime) {
  288.                                     onProgress(videotime);
  289.                                 }
  290.                             }
  291.  
  292.                             timeupdater = setInterval(updateTime, 500);
  293.  
  294.                         }
  295.  
  296.                     }
  297.  
  298.                     function onProgress(currentTime) {
  299.  
  300.                         // YouTube 500ms player progress
  301.  
  302.                         if(Object.keys(playerData.timecodeTags).length == 0)
  303.                             return;
  304.  
  305.                         $.each(playerData.timecodeTags, function(timecode, tags) {
  306.                              
  307.                              if(currentTime >= timecode) {
  308.                                 applyTags(tags);
  309.                                 delete playerData.timecodeTags[timecode];
  310.                              }
  311.  
  312.                         });
  313.  
  314.                     }
  315.  
  316.                 });
  317.  
  318.             } else if (playerType == 'wistia') {
  319.  
  320.                 window._wq = window._wq || [];
  321.  
  322.                 var videoObject = Wistia.api( $(this).attr('id') );
  323.  
  324.                 _wq.push({
  325.                     // id: videoObject.hashedId(),
  326.                     id: '_all',
  327.                     onReady: function(video) {
  328.  
  329.                         if (typeof playerData.wpf_tags_start != 'undefined') {
  330.  
  331.                             var startDone = false;
  332.  
  333.                             video.bind("play", function () {
  334.  
  335.                                 // Wistia start video
  336.  
  337.                                 if (startDone == false) {
  338.  
  339.                                     startDone = true;
  340.                                     applyTags(playerData.wpf_tags_start);
  341.  
  342.                                 }
  343.                             });
  344.  
  345.                         }
  346.  
  347.                         if ( typeof playerData.wpf_tags_complete != 'undefined' ) {
  348.  
  349.                             var completeDone = false;
  350.  
  351.                             video.bind('timechange', function(t) {
  352.  
  353.                                 if ( t / video.duration() >= 0.95 && completeDone == false) {
  354.  
  355.                                     // Wistia 95% complete
  356.  
  357.                                     completeDone = true;
  358.                                     applyTags(playerData.wpf_tags_complete);
  359.  
  360.                                 }
  361.  
  362.                             });
  363.  
  364.                         }
  365.  
  366.                         if ( typeof playerData.timecodeTags != 'undefined' ) {
  367.  
  368.                             video.bind("timechange", function(t) {
  369.  
  370.                                 if(Object.keys(playerData.timecodeTags).length == 0)
  371.                                     return;
  372.  
  373.                                 $.each(playerData.timecodeTags, function(timecode, tags) {
  374.  
  375.                                     // Wistia player progress
  376.  
  377.                                     if( t >= timecode ) {
  378.  
  379.                                         applyTags(tags);
  380.                                         delete playerData.timecodeTags[timecode];
  381.  
  382.                                     }
  383.  
  384.                                 });
  385.  
  386.                             });
  387.  
  388.                         }
  389.  
  390.                     }
  391.  
  392.                 });
  393.  
  394.             } else if (playerType == 'vooplayer') {
  395.  
  396.                 var playerId = $(this).attr('data-playerid');
  397.  
  398.                 document.addEventListener('vooPlayerReady', function( event ) {
  399.  
  400.                     // VooPlayer can't tell you the current time (annoying), so you have to create an array of all the timecodes
  401.                     // you're interested in first, and pass them to vooAPI( playerId, 'getTime' ) and it will tell you if the current
  402.                     // time is close to one of your defined timecodes.
  403.  
  404.                     var completeTimecode = false;
  405.  
  406.                     var startDone = false;
  407.                     var completeDone = false;
  408.                     var vooTimecodes = [ 1 ];
  409.  
  410.                     // Merge in timecodes
  411.                     if ( typeof playerData.timecodeTags != 'undefined' && Object.keys(playerData.timecodeTags).length != 0 ) {
  412.  
  413.                         $.each(playerData.timecodeTags, function(timecode, tags) {
  414.  
  415.                             vooTimecodes.push( parseInt( timecode ) );
  416.  
  417.                         });
  418.  
  419.                     }
  420.  
  421.                     vooAPI(playerId, 'getDuration', ['1'], function( duration ) {
  422.  
  423.                         completeTimecode = parseInt( Math.floor( duration * 0.95 ) );
  424.                         vooTimecodes.push( completeTimecode );
  425.  
  426.                         vooTimecodes.sort(sortNumber);
  427.  
  428.                     });
  429.  
  430.                     function checkVooProgress() {
  431.  
  432.                         vooAPI(playerId, 'getTime', vooTimecodes, checkTimecodes);
  433.  
  434.                         function checkTimecodes( time ) {
  435.  
  436.                             if (typeof playerData.wpf_tags_start != 'undefined') {
  437.  
  438.                                 if (startDone == false) {
  439.  
  440.                                     startDone = true;
  441.                                     applyTags(playerData.wpf_tags_start);
  442.  
  443.                                     vooTimecodes.splice( $.inArray('1', vooTimecodes), 1 );
  444.  
  445.                                     vooAPI(playerId, 'getTime', vooTimecodes, checkTimecodes);
  446.  
  447.                                 }
  448.  
  449.                             }
  450.  
  451.                             if ( typeof playerData.wpf_tags_complete != 'undefined' ) {
  452.  
  453.                                 if (completeDone == false && time == completeTimecode ) {
  454.  
  455.                                     completeDone = true;
  456.                                     applyTags(playerData.wpf_tags_complete);
  457.  
  458.                                     clearInterval( vooProgressChecker );
  459.  
  460.                                 }
  461.  
  462.                             }
  463.  
  464.                             if ( typeof playerData.timecodeTags != 'undefined' ) {
  465.  
  466.                                 if(Object.keys(playerData.timecodeTags).length == 0)
  467.                                     return;
  468.  
  469.                                 $.each(playerData.timecodeTags, function(timecode, tags) {
  470.  
  471.                                     if( timecode == time ) {
  472.  
  473.                                         applyTags(tags);
  474.                                         delete playerData.timecodeTags[timecode];
  475.  
  476.                                         vooTimecodes.splice( $.inArray(timecode, vooTimecodes), 1 );
  477.  
  478.                                         vooAPI(playerId, 'getTime', vooTimecodes, checkTimecodes);
  479.  
  480.                                     }
  481.  
  482.                                 });
  483.  
  484.                             }
  485.  
  486.                         }
  487.  
  488.                     }
  489.  
  490.                     var vooProgressChecker = setInterval(checkVooProgress, 1000);
  491.  
  492.                 });
  493.  
  494.             }
  495.  
  496.         });
  497.  
  498.     }
  499.  
  500.  
  501.     setTimeout( initializeIFrames, 350 );
  502.  
  503. });
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!