CODEWITHSUNDEEP
phpjavascriptjquery
rob.m
rob.m

Reputation: 10601

call vimeo video using ajax?

I have this example code, but i believe when i call the ajax function that is not loaded. How can i load an external script as below? Thanks

       <?php if (is_ajax_request()): ?>
        <div id="movie5" class="movie"></div>
            <script>
                 var swf = swfobject.embedSWF("http://vimeo.com/moogaloop.swf?clip_id=35014154&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=ffffff&amp;fullscreen=1&amp;autoplay=0&amp;loop=0", "movie5", "500", "281", "9.0.0","expressInstall.swf", { api:1, player_id:"movie5" }, { allowfullscreen:true, allowscriptaccess:'always' });
            </script>

Upvotes: 0

Views: 1077

Answers (2)

rob.m
rob.m

Reputation: 10601

Eventually i came up with using this:

In the main page I have a element which i then populate and replace with the iframe

Main page:

<span class="video clearfix" data-vimeoid="<?php echo the_field('vimeo') ?>"></span>

Content page to be loaded:

var url = this.href + " .content";
  var videoSpan = infoBox.find("span.video");
  var iframe = $('<iframe/>', {
            'frameborder' : 0,
            'width' : '692',
            'height' : '389',
            'src' : 'http://player.vimeo.com/video/'+ videoSpan.data("vimeoid") +'?autoplay=0&api=1'
    });
  videoSpan.replaceWith(iframe);

Upvotes: 0

ShankarSangoli
ShankarSangoli

Reputation: 69915

Why do you need a ajax call for this? It is pure javascript just execute it and make sure the required library is included on the page. Try this.

if($('movie5').length == 0){
    $('<div id="movie5" class="movie" />')
    .appendTo(document.body);//Specify the container where you need this player
}

var swf = swfobject.embedSWF("http://vimeo.com/moogaloop.swf?clip_id=35014154&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=ffffff&amp;fullscreen=1&amp;autoplay=0&amp;loop=0", "movie5", "500", "281", "9.0.0","expressInstall.swf", { api:1, player_id:"movie5" }, { allowfullscreen:true, allowscriptaccess:'always' });

Update:

Ideally the script which is a part of html content is executed by jQuery when you use html, append etc methods. It is not working then there must be some js error on the page.

Alternative way which you can try is. Just get the html content through ajax call and execute the script to initialize the player after you set the html content inside ajax success handler.

Try this.

$.ajax({
   ..
   success: function(data){
         $('.info').html(data);

         //Now initialize the player
         var swf = swfobject.embedSWF("http://vimeo.com/moogaloop.swf?clip_id=35014154&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=ffffff&amp;fullscreen=1&amp;autoplay=0&amp;loop=0", "movie5", "500", "281", "9.0.0","expressInstall.swf", { api:1, player_id:"movie5" }, { allowfullscreen:true, allowscriptaccess:'always' });

   }  
})

Upvotes: 1

Related Questions