Uncaught Typeerror: kann Eigenschaft ‚ready‘ undefinierten Vimeo lesen

Question

Demo Here

Hallo, Ich habe Vimeo Video implementiert und es funktioniert gut, aber die Ausgabe iam Verkleidung ist, wann immer das Video endet (In Listener) Ereignisse sind Funktioniert nicht.

hinweis: onclick des bildes iam video spielen.

(function($) { 
$(function() { 
    //alert('hi') 
    //var thumbSelector = $('.gwt__embed__video .flex-viewport, .sliderNew #carousel, .sliderNew .flex-direction-nav'); 
    //var dotSelector = $('.gwt__embed__video .flex-viewport, .flex-control-nav.flex-control-paging, .flex-direction-nav, flex-control-nav'); 
    //var slidFalse = $('.sliderNew .flexslider').flexslider({ slideshow: false }); 
    //var slidTrue = $('.sliderNew .flexslider').flexslider({ slideshow: true }); 
    var iframe = $('#player1')[0]; 
    var player = $f(iframe); 
    var status = $('.status'); 

    console.log("01 player" + player); // result null 
    // When the player is ready, add listeners for pause, finish, and playProgress 
    // Call the API when a button is pressed  
    $('#test_1').on('click', function() { 
     $('#test_1').hide(); 
     imgClick1(); 
     //$('#player1').show(); 
     //$('.gwt__video__wrap .close').show(); 
     // player.api($(this).text().toLowerCase()); 
     console.log("02 on click player" + player); // 
    }); 
    function imgClick1() { 

     var tag1 = document.createElement('script'); 
     tag1.src = "http://a.vimeocdn.com/js/froogaloop2.min.js"; 
     var firstScriptTag1 = document.getElementsByTagName('script')[0]; 
     firstScriptTag1.parentNode.insertBefore(tag1, firstScriptTag1); 


     var ifrm = document.createElement("IFRAME"); 
     ifrm.setAttribute("src", "https://player.vimeo.com/video/76979871?api=1&player_id=player1&autoplay=1"); 
     ifrm.setAttribute("id", "vplayer"); 
     ifrm.setAttribute("class", "vimeo-player"); 
     ifrm.style.width = "100%"; 
     ifrm.style.height = "224px"; 
     // add rest of your values 
     ifrm.frameborder = 0; 
     document.getElementById("vPlayer").appendChild(ifrm); 

     jQuery('iframe#vplayer').each(function(){ 
     alert('eaci............') 
     $f(this).addEvent('ready', ready); 
     }); 

     function ready(player_id){ 
      $f(player_id).addEvent('play', play); 
      $f(player_id).api('play'); 
      alert("Ready!!!"); 
     } 
     function play(){ 
      alert("Playing!!!"); 
     } 


     $('#vPlayer iframe').load(function() { 
      alert('On Load Function.') 
      //player = document.querySelectorAll('iframe')[0]; 
      console.log("neeeeeeeeeeee" + player); 
      // $('#vPlayer iframe').attr('id', videoData[0]['id']); 
      /* $f(player).addEvent('ready', function(id){ 
       var vimeoVideo = $f(id); 
       console.log('success'); 
      }); */ 
      function videoEnd() { 
       alert('hello mister') 
      } 
     }); 
    } 

    function onPause(id) { 
     status.text('paused'); 
    } 

    function onFinish(id) { 
     alert("eeee"); 
    } 

    function onPlayProgress(data, id) { 
     status.text(data.seconds + 's played'); 
    } 



}); 

})(jQuery); 

Danke !!

Answer 1

Ich habe das Problem behoben, nun die Fehlermeldung :-) gegangen ist here is the Demo

$(function(){ 
    /************ 
    Img Click Load Vimeo Video **********************************************/ 
    window.artist_vimeo_id = $(this).attr('1450411820675');  
    $('#test_1').on('click', function(e) { 
    alert('img clicked'); 
    $(this).each(function(i, obj) { 
     e.preventDefault(); 
     window.artist_vimeo_id = $(this).attr('data-vimeo'); 
     iframeVimeo(); 
    }); 
    vimeoLoad();     
    });   

    function getVimeoArtistId() { 
    return window.artist_vimeo_id; 
    } 
    function loadScriptVimeo() { 
    //if (typeof(YT) == 'undefined' || typeof(YT.Player) == 'undefined') { 
     var tag = document.createElement('script'); 
     tag.src = "https://f.vimeocdn.com/js/froogaloop2.min.js"; 
     var firstScriptTag = document.getElementsByTagName('script')[0]; 
     firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 
    //} 
    } 
    function iframeVimeo() { 
    var ifrm = document.createElement("IFRAME"); 
    var ifrmUrl = "https://player.vimeo.com/video/"; 
    ifrm.setAttribute("src", "https://player.vimeo.com/video/76979871?api=1&player_id=player1&autoplay=1"); 
    ifrm.setAttribute("class", "vimeo"); 
    ifrm.setAttribute("id", "player1"); 
    ifrm.style.width = "100%"; 
    ifrm.style.height = "100%"; 
    ifrm.frameborder = 0; 
    $(".gwt__embed__video").append(ifrm); 
    return false;  
    } 
    function vimeoLoad() { 
    jQuery('iframe.vimeo').each(function(){ 
     Froogaloop(this).addEvent('ready', ready); 
    }); 
    function ready(playerID){ 
     Froogaloop(playerID).addEvent('play', play(playerID)); 
     Froogaloop(playerID).addEvent('finish', finish); 
     Froogaloop(playerID).api('play'); 
    } 
    function play(playerID){ 
    } 
    function finish(){ 
     $('#player1').remove(); 
    } 
    } 





    /*********************/ 


     $('.test-click').on('click',function(){ 
     alert('Initialized'); 
     }) 
    })