Hi!
I had a weird problem with my FLVPlayback : the caption button didn't appear when I was publishing (I did chose a skin with the caption button). The solution was to add manually a caption button (on the already existing skin). I also had to manually add a function to toggle the visibility of the captions.
Weird, I know. But otherwise, it didn't work.
So, now I have a new problem. When I click on the seekbar to move further in the video, the captions disappear automatically. Sadly, my variable is still set to "false" (visibility off). So I have to click twice on my caption button to make it appear back.
I thought that maybe I could add a listener on the seekbar? But it looks like I can't precisely point the seekbar because it's within the skin? How could I do that. Would there be another solution?
Thank you very much for your time.
Here's my code...
import fl.video.*;
import fl.controls.ProgressBarMode;
var flvControl:FLVPlayback = display;
var flvCaption:FLVPlaybackCaptioning = caption;
var flvSource:String = "videos/P01_Intro.flv";
flvControl.source = flvSource;
caption.captionButton = cap_btn;
caption.source = "intro.xml";
function progressHandler(event:VideoProgressEvent):void{
var bl:Number = Math.round(event.bytesLoaded/1000);
var bt:Number = Math.round(event.bytesTotal/1000);
pb.setProgress(bl,bt);
}
function readyHandler(event:VideoEvent):void{
removeChild(pb);
display.play();
}
function onCaptionChange(e:*):void {
if (caption.showCaptions){
caption.showCaptions = false;
} else {
caption.showCaptions = true;
}
}
function changeStatutCaption(e:*):void{
trace("test");
}
// Set progress bar state
pb.mode = ProgressBarMode.MANUAL;
pb.indeterminate = false;
// Add listeners and load the video
flvControl.addEventListener(VideoProgressEvent.PROGRESS, progressHandler);
flvControl.addEventListener(VideoEvent.READY, readyHandler);
cap_btn.addEventListener(MouseEvent.CLICK,onCaptionChange);
//flvControl.seekBar.addEventListener(MouseEvent.MOUSE_DOWN,changeStat utCaption);
trace(flvControl.seekBar) //returns null...
I mean, create the FLVPlayback component in AS3. You're assigning a variable to an instance reference:
var flvControl:FLVPlayback = display;
Creating it in AS3 would like so, with no instance added to the stage:
var flvControl:FLVPlayback = new FLVPlayback();
Then instead of using the Flash component inspector to select the skin, manually grab the correct skin and apply it yourself, e.g.:
flvControl.skin = "SkinOverAll.swf";
Of course you need that SWF loaded on your server. I build in FlashBuilder 4.7 so I still just use Flash CS5.5 for making quick graphics and I find my FLVPlayback controls in this folder:
C:\Program Files (x86)\Adobe\Adobe Flash CS5.5\Common\Configuration\FLVPlayback Skins\ActionScript 3.0
Adjust for your version of Flash. See if your Closed Caption button appears.
Bottom line is there's no reason you should need to create a custom skin unless you want to and by what you said it doesn't appear that you want to. CC buttons exist in the premade skins.
Oh! Okay!
So, I did try your solution. Changed the code to that :
import fl.video.*;
import fl.controls.ProgressBarMode;
var flvDisplay : FLVPlayback;
var flvSource : String = "videos/P01_Intro.flv";
var flvCaption : FLVPlaybackCaptioning;
var flvCaptionSource : String = "intro.xml"
flvDisplay = new FLVPlayback();
flvDisplay.skin = "SkinUnderPlaySeekCaption.swf";
flvDisplay.source = flvSource;
flvDisplay.width = 757;
flvDisplay.height = 530;
flvCaption = new FLVPlaybackCaptioning();
flvCaption.source = flvCaptionSource;
flvCaption.showCaptions = true;
addChild(flvDisplay);
addChild(flvCaption);
I temporarily put the code related to the progress bar in comment, so I didn't add it to the post.
You know what's bizarre? The caption button still doesn't appear! The captions do work though. I just can't turn them off since the button isn't there. :/
So basically, I return to my first problem : is there any way to "access" the seekbar scroller trough code? Then my first solution would "work".
Here's a quick CS4 project I made to demonstrate it for you. All it does is play some random portion of a Phone Arena YouTube video for 30 seconds and has a caption from 0-9 seconds, 10-19 seconds, 20-29 seconds.. Caption button shows up, works, text shows up just fine, very easy code.
http://www.ertp.com/tmp/caption/FLVCaption.zip
Live Example:
http://www.ertp.com/tmp/caption/
Ugly but gets the point across. Don't forget to set the FLVPlaybackCaptioning.flvPlayback to the instance name of the FLVPlayback (you'll see it in my simple source). I have zero error checking in here nor am I assuring the XML is loading, etc, but you'll get the idea.
Fuuuuuuu.
Looks like my file was corrupted! When I copy-paste your code instead of mine in my file : the caption button still disappeared. But, if I use your code on your file and just change the value for the .xml and .flv, it worked just fine.
All this time for a corrupted file. So, so sad.
Thank you for your help. It is highly appreciated!
North America
Europe, Middle East and Africa
Asia Pacific