Continue playing FLVs

Report · Aug 27, 2009

Hi everyone,

I created a bunch on video clips which I later converted into FLV. I also created a flash project that loads each video from a folder located next to my main project ("chapters" folder). I got each button to load its respective video, but what I am trying to accomplish is have each video play continously (so that when video 1 is done playing, video 2 is loaded and starts playing... until we reach the last video, could be up to 15-20 videos).

Can anyone point me in the right director for accomplishing this?

Below is the code I have so far...

import fl.video.*;
import fl.controls.ProgressBarMode;
import flash.display.StageDisplayState;

stop();

var flvControl = display;
var flvSource = "chapters/SyprisLogo_intro.flv";

function progressHandler(event:VideoProgressEvent):void
{
   var bl = Math.round(event.bytesLoaded/1000);
   var bt = Math.round(event.bytesTotal/1000);
   pb.setProgress(bl,bt);
}

function readyHandler(event:VideoEvent):void
{
   removeChild(pb);
}

pb.mode = ProgressBarMode.MANUAL;
pb.indeterminate = false;

flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
flvControl.addEventListener(VideoEvent.READY, readyHandler);
flvControl.source = flvSource;

display.addEventListener(VideoEvent.COMPLETE, flvDone);
function flvDone(ve:VideoEvent):void
{
    if (stage.displayState == StageDisplayState.FULL_SCREEN)
    {
        stage.displayState=StageDisplayState.NORMAL;
    }
}

//BTNs//
btn1.addEventListener(MouseEvent.CLICK, addVid_1);
btn2.addEventListener(MouseEvent.CLICK, addVid_2);

function addVid_1(event:MouseEvent):void
{
    display.stop();
    flvSource = "chapters/vid1.flv";
    flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
    flvControl.addEventListener(VideoEvent.READY, readyHandler);
    flvControl.source = flvSource;
}

function addVid_2(event:MouseEvent):void
{
    display.stop();
    flvSource = "chapters/vid2.flv";
    flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
    flvControl.addEventListener(VideoEvent.READY, readyHandler);
    flvControl.source = flvSource;
}

Report · Aug 28, 2009

OK... a bit of a progress... I added this inside my flvDone function:

display.addEventListener(VideoEvent.COMPLETE, flvDone);
function flvDone(ve:VideoEvent):void
{
     if( flvSource = "vid2.flv"){
         display.stop();
         flvSource = "chapters/vid2.flv";
         flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
         flvControl.addEventListener(VideoEvent.READY, readyHandler);
         flvControl.source = flvSource;
         } else if {
          flvSource = "vid2.flv"){
         display.stop();
         flvSource = "chapters/vid3.flv";
         flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
         flvControl.addEventListener(VideoEvent.READY, readyHandler);
         flvControl.source = flvSource;
         }
}
   ...and so on for the rest of the videos.

It seems to be working fine (no errors or issues so far). I just feel there has to be a "cleaner" way for doing this. Any suggestions?

thanks!!!

Rafa.

Report · Aug 28, 2009

One of better way could be to create an array of your videos and just call members:

var videoArray:Array = ["vid1.flv","vid2.flv","vid3.flv",.. "vidN.flv"];

var currentVideoIndex:int = 0;

function flvDone(ve:VideoEvent):void
{

currentVideoIndex = currentVideoIndex < videoArray.length - 1 ? currentVideoIndex + 1 : 0;

flvSource = videoArray[currentVideoIndex ];

etc...

}

Report · Aug 28, 2009

Hi Andrei1,

Thanks for your help. I do have my video inside a folder called "chapters," would that make a diffrence when I build the array? Also, I am not getting any errors, but only the first video is loading... after that, the second vid doesnt load, and the buttons that call each respective video dont work either... any idea why this would happen?

Rafa.

Report · Aug 28, 2009

The array I gave is just an example - you need to change it to accommodate your videos urls.

I don't know anserws to your other questions because there is no sufficient amount of code shown.

Report · Aug 28, 2009

Andrei1,

This is what I have so far:

import fl.video.*;
import fl.controls.ProgressBarMode;
import flash.display.StageDisplayState;

stop();

var flvControl = display;
var flvSource = "chapters/video1_intro.flv";

function progressHandler(event:VideoProgressEvent):void
{
   var bl = Math.round(event.bytesLoaded/1000);
   var bt = Math.round(event.bytesTotal/1000);
   pb.setProgress(bl,bt);
}

function readyHandler(event:VideoEvent):void
{
   // Remove progressbar when we start playing...
   removeChild(pb);
}

pb.mode = ProgressBarMode.MANUAL;
pb.indeterminate = false;

flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
flvControl.addEventListener(VideoEvent.READY, readyHandler);
flvControl.source = flvSource;

var videoArray:Array = ["chapters/video1_intro.flv","chapters/video1.flv","chapters/video3.flv","chapters/video4.flv"];
var currentVideoIndex:int = 0

display.addEventListener(VideoEvent.COMPLETE, flvDone);
function flvDone(ve:VideoEvent):void
{

    currentVideoIndex = currentVideoIndex < videoArray.length - 1 ? currentVideoIndex + 1 : 0;
    flvSource = videoArray[currentVideoIndex ];

}

//BTNs//
btn1.addEventListener(MouseEvent.CLICK, addVid_1);
btn2.addEventListener(MouseEvent.CLICK, addVid_2);
btn3.addEventListener(MouseEvent.CLICK, addVid_3);
btn4.addEventListener(MouseEvent.CLICK, addVid_4);

function addVid_1(event:MouseEvent):void
{
    display.stop();
    flvSource = "chapters/video1_intro.flv";
    flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
    flvControl.addEventListener(VideoEvent.READY, readyHandler);
    flvControl.source = flvSource;
}

function addVid_2(event:MouseEvent):void
{
    display.stop();
    flvSource = "chapters/video1.flv";
    flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
    flvControl.addEventListener(VideoEvent.READY, readyHandler);
    flvControl.source = flvSource;
}
function addVid_3(event:MouseEvent):void
{
    display.stop();
    flvSource = "chapters/video3.flv";
    flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
    flvControl.addEventListener(VideoEvent.READY, readyHandler);
    flvControl.source = flvSource;
}
function addVid_4(event:MouseEvent):void
{
    display.stop();
    flvSource = "chapters/video4.flv";
    flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
    flvControl.addEventListener(VideoEvent.READY, readyHandler);
    flvControl.source = flvSource;
}

I was pointing the correct path in my array, but I cant load anything after "video1_intro.flv." I am not sure what I am doing wrong...

Rafa.

Report · Aug 28, 2009

I am not sure why you videos don't play yet but, first, let's clean the code.

1. What is flvControl? Is it FLVPlayback instance? If so, you perhaps need to utilize its methods like play(), etc. I write my own video streaming routine - so I don't know much about this class and its quirks.

2. With video array implementation you don't need a separate function/event handlers for each video - you can reuse the same function. One of the ways can be (please note that I did not test the code for I don't have Flash IDE on this PC - so it is an untested concept and you may need to make some adjustments. Also see my code comments.):

import fl.video.*;
import fl.controls.ProgressBarMode;
import flash.display.DisplayObject;
import flash.display.StageDisplayState;
import flash.events.Event;
import flash.events.EventDispatcher;
import flash.events.MouseEvent;

stop();

var videoArray:Array = ["chapters/video1_intro.flv", "chapters/video1.flv", "chapters/video3.flv", "chapt ers/video4.flv"];
var currentVideoIndex:int = 0;
var flvControl = display;
// add listeners to video
flvControl.addEventListener(VideoEvent.COMPLETE, flvDone);
flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
flvControl.addEventListener(VideoEvent.READY, readyHandler);

pb.mode = ProgressBarMode.MANUAL;
pb.indeterminate = false;
// make array of buttons

// makes it more flexible in case you want to add more videos
var buttonsArray:Array = [btn1, btn2, btn3, btn4];
// activate buttons
activateButtons();
// iterator - use in the loop - it is more efficient to instantiate outside the loop
var i:int = 0;
// play first video
playVideo();
function progressHandler(event:VideoProgressEvent):void
{
   var bl = Math.round(event.bytesLoaded/1000);
   var bt = Math.round(event.bytesTotal/1000);
   pb.setProgress(bl,bt);
}

function readyHandler(event:VideoEvent):void
{
// Remove progressbar when we start playing...
removeChild(pb);
}

// activates buttons
function activateButtons():void {
for (i = 0; i < buttonsArray.length; i++) {

// give each button the name that contains index

        // index will be used to assign value to currentVideo and, thus, as a reference to video array
        buttonsArray.name = "btn_" + i;
        EventDispatcher(buttonsArray).addEventListener(MouseEvent.CLICK, onButtonClick);
    }
}

private function onButtonClick(e:MouseEvent):void
{
    // extract integer from the button name
    currentVideoIndex = int(e.currentTarget.name.split("_")[1]);
    playVideo();
}

function flvDone(ve:VideoEvent):void
{
currentVideoIndex = currentVideoIndex < videoArray.length - 1 ? currentVideoIndex + 1 : 0;
playVideo();
}

// this method relies on currentVideoIndex set elsewhere

function playVideo():void {
flvSource = videoArray[currentVideoIndex ];
flvControl.source = flvSource;
}

Report · Sep 01, 2009

Thank you so much for your help in this. I added "flvSource" to the list of starting variables and added quotations to the "buttonsArray." Below is the code so far (basically the same as yours).

import fl.video.*;
import fl.controls.ProgressBarMode;
import flash.display.DisplayObject;
import flash.display.StageDisplayState;
import flash.events.Event;
import flash.events.EventDispatcher;
import flash.events.MouseEvent;

stop();

var videoArray:Array=["chapters/video1_intro.flv","chapters/video1.flv","chapters/video3.flv","chapt ers/video4.flv"];
var currentVideoIndex:int=0;
var flvControl=display;
var flvSource = "chapters/SyprisLogo_intro.flv";
// add listeners to video
flvControl.addEventListener(VideoEvent.COMPLETE, flvDone);
flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
flvControl.addEventListener(VideoEvent.READY, readyHandler);

pb.mode=ProgressBarMode.MANUAL;
pb.indeterminate=false;
// make array of buttons
// makes it more flexible in case you want to add more videos
var buttonsArray:Array=["btn1,btn2,btn3,btn4"];
// activate buttons
activateButtons();
// iterator - use in the loop - it is more efficient to instantiate outside the loop
var i:int=0;
// play first video
playVideo();
function progressHandler(event:VideoProgressEvent):void {
    var bl=Math.round(event.bytesLoaded/1000);
    var bt=Math.round(event.bytesTotal/1000);
    pb.setProgress(bl,bt);
}

function readyHandler(event:VideoEvent):void {
    // Remove progressbar when we start playing...
    removeChild(pb);
}

// activates buttons
function activateButtons():void {
    for (i = 0; i < buttonsArray.length; i++) {

        // give each button the name that contains index

        // index will be used to assign value to currentVideo and, thus, as a reference to video array
        buttonsArray.name="btn_"+i;
        EventDispatcher(buttonsArray).addEventListener(MouseEvent.CLICK, onButtonClick);
    }
}

function onButtonClick(e:MouseEvent):void {
    // extract integer from the button name
    currentVideoIndex=int(e.currentTarget.name.split("_")[1]);
    playVideo();
}

function flvDone(ve:VideoEvent):void {
    currentVideoIndex=currentVideoIndex<videoArray.length-1?currentVideoIndex+1:0;
    playVideo();
}

// this method relies on currentVideoIndex set elsewhere

function playVideo():void {
    flvSource=videoArray[currentVideoIndex];
    flvControl.source=flvSource;

I am getting this error when I use "ctrl+enter" for previe:

ReferenceError: Error #1056: Cannot create property name on String.
at splash_3_fla::MainTimeline/activateButtons()
at splash_3_fla::MainTimeline/frame2()

The FLV instance is not loading anything. What do you think the issue is?

Thank you,

Rafael.

Report · Sep 01, 2009

The problem is how you create the array.

Your code is:

var buttonsArray:Array=["btn1,btn2,btn3,btn4"];

Please take a close look at it...

This array contains one element which value is a string "btn1,btn2,btn3,btn4". Do you see that? This is very important to understand:

1. Whatever is enclosed in double or single quotes is treated as String.

2. This array is supposed to contain references to the objects. References to objects cannot be enclosed into quotes and have to be written straight as of the variables were named. So, the array must have the following syntax:

var buttonsArray:Array=[btn1, btn2, btn3, btn4];

By the way, the error gave you an exact location where the problematic code is. If you turn on debugging - it will give you problem line number too.