Question

i need to apply a method – play() – to a flowplayer object, but it’s not working and i don’t understand why, how can i do? in the setupContemporaryEvents() function there is the wrong code, suggestions, thank you in advance.

this is html:

<div id="area1" class="player aree" data-engine="flash">
  <video id="vid1" preload="none">
    <source src="myvideo1.flv" type="video/flv">
  </video>
</div>
<div id="area2" class="player aree" data-engine="flash">
  <video id="vid2" preload="none">
    <source src="myvideo2.flv" type="video/flv">
  </video>
</div>

this is javascript:

$(function() {
  var video1, video2;
  var bVideo1 = false;
  var bVideo2 = false;
  video1 = $("#area1").flowplayer({swf: "flowplayer-5.3.1/flowplayer.swf"});
  video2 = $("#area2").flowplayer({swf: "flowplayer-5.3.1/flowplayer.swf"});

  $("#area1").bind("ready", function(e, api) {
    bVideo1 = true;
    setupContemporaryEvents();
  });
  $("#area2").bind("ready", function(e, api) {
    bVideo2 = true;
    setupContemporaryEvents();
  });

  var setupContemporaryEvents = function(){
    if(bVideo1 && bVideo2){
      $("#area1").bind("resume", function(e, api) {
        // not working
        $("#vid2").play();
        // not working
        $("#area2").play();
        // not working
        video2.play();
      });
    }
  };
});

Answer 1

i found the solution
this is the correction on javascript:

$(function() {
  var video1, video2;
  var bVideo1 = false;
  var bVideo2 = false;
  $("#area1").flowplayer({swf: "flowplayer-5.3.1/flowplayer.swf"});
  $("#area2").flowplayer({swf: "flowplayer-5.3.1/flowplayer.swf"});

  $("#area1").bind("ready", function(e, api) {
    bVideo1 = true;
    video1 = api;
    setupContemporaryEvents();
  });
  $("#area2").bind("ready", function(e, api) {
    bVideo2 = true;
    video2 = api;
    setupContemporaryEvents();
  });

  var setupContemporaryEvents = function(){
    if(bVideo1 && bVideo2){
      $("#area1").bind("resume", function(e, api) {
        video2.play();
      });
    }
  };
});