northstarphillips
asked on
Auto Hide flv player component until mouse over.
I have a php streaming flash player from (http://www.flashcomguru.com/index.cfm/2005/11/2/Streaming-flv-video-via-PHP-take-two). I need the player component to auto hide until the user mouse's over the video display window(theVideo). Here is the Action Script. Does anybody know how to mod it to make the player component auto hide until the video display is moused over. Thanks in advanced. Ramy and Aneesh, Ready...Set...Go!
:::Here is the Action Script::::
var nc:NetConnection = new NetConnection();
nc.connect(null);
var ns:NetStream = new NetStream(nc);
var _vidName = "golfers.flv";
var _vidURL = "http://www.yourdomain.com/" + _vidName;
var _phpURL = "http://www.yourdomain.com/flvprovider.php";
var ending = false;
var amountLoaded:Number;
var duration:Number;
var loaderwidth = loader.loadbar._width;
theVideo.attachVideo(ns);
ns.setBufferTime(2);
statusID = setInterval(videoStatus, 200);
ns.onStatus = function(info) {
trace(info.code);
if(info.code == "NetStream.Buffer.Full") {
bufferClip._visible = false;
ending = false;
clearInterval( statusID );
statusID = setInterval(videoStatus, 200);
}
if(info.code == "NetStream.Buffer.Empty") {
if ( !ending ) {
bufferClip._visible = true;
}
}
if(info.code == "NetStream.Play.Stop") {
bufferClip._visible = false;
//ending = true;
}
if(info.code == "NetStream.Play.Start") {
ending = false;
}
if(info.code == "NetStream.Buffer.Flush") {
ending = true;
}
}
playButton.onRelease = function() {
ns.pause();
}
play_btn.onRelease = function() {
restartIt();
this._visible = false;
}
rewindButton.onRelease = function() {
restartIt();
}
ns["onMetaData"] = function(obj) {
duration = obj.duration;
//trace(obj.width);
//trace(obj.height);
// suck out the times and filepositions array, this was added by flvmdi27b
times = obj.keyframes.times;
positions = obj.keyframes.fileposition s;
}
function videoStatus() {
amountLoaded = ns.bytesLoaded / ns.bytesTotal;
loader.loadbar._width = amountLoaded * loaderwidth;
loader.scrub._x = ns.time / duration * loaderwidth;
}
loader.scrub.onPress = function() {
clearInterval (statusID );
ns.pause();
this.startDrag(false,0,thi s._y,loade rwidth,thi s._y);
}
loader.scrub.onRelease = loader.scrub.onReleaseOuts ide = function() {
scrubit();
this.stopDrag();
}
function scrubit() {
var tofind = Math.floor((loader.scrub._ x/loaderwi dth)*durat ion);
if (tofind <= 0 ) {
restartIt();
return;
}
for (var i:Number=0; i < times.length; i++){
var j = i + 1;
if( (times[i] <= tofind) && (times[j] >= tofind ) ){
trace("match at " + times[i] + " and " + positions[i]);
bufferClip._visible = true;
ns.play( _phpURL + "?file=" + _vidName + "&position=" + positions[i]);
trace("play " + _phpURL + "?file=" + _vidName + "&position=" + positions[i]);
break;
}
}
}
function pauseIt() {
ns.pause();
}
function stopIt() {
ns.seek(0);
ns.pause();
}
function restartIt() {
ns.play( _vidURL );
}
//restartIt();
// holds sound
_root.createEmptyMovieClip ("vSound", _root.getN extHighest Depth());
vSound.attachAudio(ns);
var so:Sound = new Sound(vSound);
so.setVolume(100);
mute.onRollOver = function() {
if(so.getVolume()== 100) {
this.gotoAndStop("onOver") ;
}
else {
this.gotoAndStop("muteOver ");
}
}
mute.onRollOut = function() {
if(so.getVolume()== 100) {
this.gotoAndStop("on");
}
else {
this.gotoAndStop("mute");
}
}
mute.onRelease = function() {
if(so.getVolume()== 100) {
so.setVolume(0);
this.gotoAndStop("muteOver ");
}
else {
so.setVolume(100);
this.gotoAndStop("onOver") ;
}
}
/*
var theMenu:ContextMenu = new ContextMenu();
theMenu.hideBuiltInItems() ;
_root.menu = theMenu;
var item1:ContextMenuItem = new ContextMenuItem("::::: Video Controls :::::",trace);
theMenu.customItems[0] = item1;
var item2:ContextMenuItem = new ContextMenuItem("Play / Pause Video",pauseIt,true);
theMenu.customItems[1] = item2;
var item3:ContextMenuItem = new ContextMenuItem("Replay the Video",restartIt);
theMenu.customItems[2] = item3;
*/
restartIt();
play_btn._visible = false;
:::Here is the Action Script::::
var nc:NetConnection = new NetConnection();
nc.connect(null);
var ns:NetStream = new NetStream(nc);
var _vidName = "golfers.flv";
var _vidURL = "http://www.yourdomain.com/" + _vidName;
var _phpURL = "http://www.yourdomain.com/flvprovider.php";
var ending = false;
var amountLoaded:Number;
var duration:Number;
var loaderwidth = loader.loadbar._width;
theVideo.attachVideo(ns);
ns.setBufferTime(2);
statusID = setInterval(videoStatus, 200);
ns.onStatus = function(info) {
trace(info.code);
if(info.code == "NetStream.Buffer.Full") {
bufferClip._visible = false;
ending = false;
clearInterval( statusID );
statusID = setInterval(videoStatus, 200);
}
if(info.code == "NetStream.Buffer.Empty") {
if ( !ending ) {
bufferClip._visible = true;
}
}
if(info.code == "NetStream.Play.Stop") {
bufferClip._visible = false;
//ending = true;
}
if(info.code == "NetStream.Play.Start") {
ending = false;
}
if(info.code == "NetStream.Buffer.Flush") {
ending = true;
}
}
playButton.onRelease = function() {
ns.pause();
}
play_btn.onRelease = function() {
restartIt();
this._visible = false;
}
rewindButton.onRelease = function() {
restartIt();
}
ns["onMetaData"] = function(obj) {
duration = obj.duration;
//trace(obj.width);
//trace(obj.height);
// suck out the times and filepositions array, this was added by flvmdi27b
times = obj.keyframes.times;
positions = obj.keyframes.fileposition
}
function videoStatus() {
amountLoaded = ns.bytesLoaded / ns.bytesTotal;
loader.loadbar._width = amountLoaded * loaderwidth;
loader.scrub._x = ns.time / duration * loaderwidth;
}
loader.scrub.onPress = function() {
clearInterval (statusID );
ns.pause();
this.startDrag(false,0,thi
}
loader.scrub.onRelease = loader.scrub.onReleaseOuts
scrubit();
this.stopDrag();
}
function scrubit() {
var tofind = Math.floor((loader.scrub._
if (tofind <= 0 ) {
restartIt();
return;
}
for (var i:Number=0; i < times.length; i++){
var j = i + 1;
if( (times[i] <= tofind) && (times[j] >= tofind ) ){
trace("match at " + times[i] + " and " + positions[i]);
bufferClip._visible = true;
ns.play( _phpURL + "?file=" + _vidName + "&position=" + positions[i]);
trace("play " + _phpURL + "?file=" + _vidName + "&position=" + positions[i]);
break;
}
}
}
function pauseIt() {
ns.pause();
}
function stopIt() {
ns.seek(0);
ns.pause();
}
function restartIt() {
ns.play( _vidURL );
}
//restartIt();
// holds sound
_root.createEmptyMovieClip
vSound.attachAudio(ns);
var so:Sound = new Sound(vSound);
so.setVolume(100);
mute.onRollOver = function() {
if(so.getVolume()== 100) {
this.gotoAndStop("onOver")
}
else {
this.gotoAndStop("muteOver
}
}
mute.onRollOut = function() {
if(so.getVolume()== 100) {
this.gotoAndStop("on");
}
else {
this.gotoAndStop("mute");
}
}
mute.onRelease = function() {
if(so.getVolume()== 100) {
so.setVolume(0);
this.gotoAndStop("muteOver
}
else {
so.setVolume(100);
this.gotoAndStop("onOver")
}
}
/*
var theMenu:ContextMenu = new ContextMenu();
theMenu.hideBuiltInItems()
_root.menu = theMenu;
var item1:ContextMenuItem = new ContextMenuItem("::::: Video Controls :::::",trace);
theMenu.customItems[0] = item1;
var item2:ContextMenuItem = new ContextMenuItem("Play / Pause Video",pauseIt,true);
theMenu.customItems[1] = item2;
var item3:ContextMenuItem = new ContextMenuItem("Replay the Video",restartIt);
theMenu.customItems[2] = item3;
*/
restartIt();
play_btn._visible = false;
ASKER
Aneesh, I appreciate the help but that is not really what I was trying to do. Let me clarify. I want the video to auto play on startup and I want the video controls (rewindButton, PlayButton, mute, loader, controlBar) to only be visible when the user mouse's over the video display. Here is a link to see what I'm working with (http://www.northstarphillips.com/testPHP.html) The video is set to auto play and I would like the video playback crontrols to be visible only when the user mouses over the video display area. Thanks Adam.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
It works great. Thank you very much Aneesh.
here are the steps:
Step 1:
remove following two lines from the last
-----------
restartIt();
play_btn._visible = false;
----------
Step 2.
replace following code :
-------------
play_btn.onRelease = function() {
restartIt();
this._visible = false;
}
-------------
replace it with the folloiwng:
---------
play_btn.onRollOver = function() {
restartIt();
this._visible = false;
}
-----------
3.
select "play_btn" on stage, and scale it cover the whole player..
4.
now set alpha of "play_btn" to 0 using properties panel..
5.
you are done, now button will be there on video player but not be visible
as user will rollOver, video will start
Rgds
Aneesh