How do I use AS3 to hide a playbar skin?

[Fretfive]

I would like to use an overlay skin on a flash project with an imported video. The video is taking up the entire window, so the skinAutoHide attribute does not work, because the mouse leaves the window before the skinAutoHide functionality kicks in. I found this code snippet that hides the playbar as soon as the mouse leves the window:

vpl.skinAutoHide = false;

stage.addEventListener(Event.MOUSE_LEAVE, hideSkin);

stage.addEventListener(MouseEvent.MOUSE_MOVE, showSkin);

function showSkin(evt:Event=null):void {

vpl.skinBackgroundAlpha = .01;

vpl.skin = "SkinOverPlaySeekMute.swf";

}

function hideSkin(evt:Event=null):void {

vpl.skinBackgroundAlpha = 0;

vpl.skin = "";

}

vpl is of course is replaced by your instance name.

This solution works really well until I click the maximize window  icon. Now the playbar is stuck in the visible state because the mouse no longer leaves the window. I've read about solutions that involve placing a pixel buffer around the video and enabling skinAutoHide, but this doesn't work if the user moves the mouse quickly off the window.

The same poster of the above code posted a second snippet, that was supposed to hide the skin after several seconds of mouse inactivity.

vpl.skinAutoHide = false;

var LastMouseMove=getTimer();

var MouseStill=false;

stage.addEventListener(MouseEvent.MOUSE_MOVE,function(ev:MouseEvent) { LastMouseMove=getTimer(); });

var MainCheckLoop=setInterval(function() {

if((getTimer()-LastMouseMove)>1000) {

if(MouseStill==false) {

hideSkin();

MouseStill=true;

}

} else {

if(MouseStill==true) {

showSkin();

MouseStill=false;

}

}

},1000);

stage.addEventListener(Event.MOUSE_LEAVE, hideSkin);

stage.addEventListener(MouseEvent.MOUSE_MOVE, showSkin);

function showSkin(evt:Event=null):void {

vpl.skinBackgroundAlpha = .01;

vpl.skin = "SkinOverPlaySeekMute.swf";

}

function hideSkin(evt:Event=null):void {

vpl.skinBackgroundAlpha = 0;

vpl.skin = "";

}

I do not get any compiler errors, but my screen is blank (and I did remeember to change the vpl.skin name to my skin name and name my instance vpl).

I do, however, get an output error: Error #2044: Unhandled skinError:. text=Error #1009: Cannot access a property or method of a null object reference.

If I can get this to work, I think it would be the best solution.

Can anyone help?

Thanks!

Peter

[kglad]

use a stage resize listener to hide the skin when going fullscreen (or whenever else you want) and unhide it when you want.

[Fretfive]

Thanks for this suggestion. I assume that you are suggesting an addition to the first code snippet in my post above. Unfortunately, AS3 new to me, and I really wouldn't know how correctly add a stage resize listener. Can anyone help?

[Fretfive]

Would it be

stage.addEventListener(Event.RESIZE, showSkin);

added right here:

vpl.skinAutoHide = false;

stage.addEventListener(Event.MOUSE_LEAVE, hideSkin);

stage.addEventListener(MouseEvent.MOUSE_MOVE, showSkin);

stage.addEventListener(Event.RESIZE, hideSkin);

function showSkin(evt:Event=null):void {

vpl.skinBackgroundAlpha = .01;

vpl.skin = "SkinOverPlaySeekMute.swf";

}

function hideSkin(evt:Event=null):void {

vpl.skinBackgroundAlpha = 0;

vpl.skin = "";

}

[kglad · Accepted solution]

you should have only one listener calling one listener function.  within that function you should test to see if you want to make the skin visible or not:

stage.addEventListener(Event.RESIZE, resizeF);

function resizeF(e:Event):void{

if(stage.displayState=="fullScreen"){

vpl.skin="";

} else {

vpl.skin = "SkinOverPlaySeekMute.swf";

}

}

[Fretfive]

Thanks for your help. I have done some coding in JavaScript but am new to AS3. Your snippet above allows me to learn and also gives me a short-term solution.

[kglad]

you're welcome.