FULL_SCREEN_INTERACTIVE: clicking the "Allow" button is passed to the application

Question

In an AS3 game (using Flex 4.10.0), I would like to allow players to communicate, even when they are in full screen mode .

So, I use the following ActionScript code (the _fullBox flag starts full-screen mode in my web application):

 public function init():void { if (stage.allowsFullScreenInteractive) stage.addEventListener(FullScreenEvent.FULL_SCREEN, handleFullScreen, false, 0, true); } private function toggleFullScreen(event:MouseEvent):void { stage.displayState = stage.displayState == StageDisplayState.NORMAL ? StageDisplayState.FULL_SCREEN_INTERACTIVE : StageDisplayState.NORMAL; } private function handleFullScreen(event:FullScreenEvent):void { _fullBox.selected = event.fullScreen; } <s:CheckBox id="_fullBox" click="toggleFullScreen(event)" label="Full Screen" /> 

This works in the sense that the full-screen mode is successfully entered, and users can also use the keyboard to communicate.

Unfortunately, clicking the "Allow" button in the dialog box (display "Allow full screen using the control keys?") Is transferred to the web application.

And in my case, it is solved by clicking on the game table in the lobby, as you can see in the screenshot and, therefore, (unwanted) joining the game:

This (bug?) Was seen with Windows 7/64 bit and Flash Player 11,8,800,115.

Can anyone share a good workaround for this?

I was thinking of adding a transparent Sprite or UIComponent above my web application, but the question is when (for example, what methods) show / hide it?

UPDATE:

Calling event.stopPropagation() from handleFullScreen() helps nothing.

UPDATE 2:

I sent Error No. 3623333 to Adobe.

UPDATE 3: Note for me - stage.allowsFullScreenInteractive useless because it is installed only in fullscreen mode.

Answer 1

As you already mentioned, you need to create a transparent layer to avoid unwanted click events. You can hide this layer when the screen returns to its normal state or user full-screen state ( FULL_SCREEN_INTERACTIVE_ACCEPTED event will be fired).

Demo (requires flashplayer 11.3)

 var transparentLayer:Sprite=new Sprite(); var timer:Timer = new Timer(50, 1); init(); function init():void { transparentLayer.graphics.beginFill(0,0.1); transparentLayer.graphics.drawRect(0,0,stage.stageWidth,stage.stageHeight); transparentLayer.graphics.endFill(); transparentLayer.visible=false; addChild(transparentLayer); timer.addEventListener(TimerEvent.TIMER_COMPLETE,handleTimerComplete); stage.addEventListener(FullScreenEvent.FULL_SCREEN_INTERACTIVE_ACCEPTED,handleFSIA); _fullBox.addEventListener(MouseEvent.CLICK,toggleFullScreen); stage.addEventListener(FullScreenEvent.FULL_SCREEN, handleFullScreen); } function toggleFullScreen(e:MouseEvent):void { if(stage.displayState == StageDisplayState.NORMAL){ stage.displayState=StageDisplayState.FULL_SCREEN_INTERACTIVE; transparentLayer.visible=ExternalInterface.available; }else stage.displayState=StageDisplayState.NORMAL; } function handleFullScreen(e:FullScreenEvent):void { _fullBox.selected = e.fullScreen; if(stage.displayState == StageDisplayState.NORMAL) transparentLayer.visible=false; } function handleFSIA(e:FullScreenEvent):void{ timer.reset(); timer.start(); } function handleTimerComplete(e:TimerEvent):void{ transparentLayer.visible=false; } 

Answer 2

One workaround detected.

The Allow and Cancel buttons are not part of the application, so when you hover one of these buttons, you get a rollOut event for the application.

 <s:Application rollOut="application_rollOutHandler(event)" rollOver="application_rollOverHandler(event)"> 

Inside the event handler, you can disable mouse events for child objects. Do not disable the application, because after that you will not receive the rollOver event.

 private function application_rollOutHandler(event:MouseEvent):void { this.mouseChildren = false; } private function application_rollOverHandler(event:MouseEvent):void { this.mouseChildren = true; }