Empty project with only red square works correctly, but other project with many graphics doesn’t work.
I’ve had trouble with the HTML5 target updating its display before. What happens if you move an element slightly, directly after entering full screen? Like mysprite.x += 1;
Moving sprite does not affect anything.
But I detected, that black screen appears in chrome, but in firefox all is good.
I found solution in this article https://productforums.google.com/forum/#!msg/chrome/MJjuK65Exkg/IpC668uFw2sJ, but I don’t know how solve this problem without correcting chrome shortcut.
I wonder what happens if you try a different HTML5 generator:
openfl test html5 -Dcanvas
How I can change HTML5 generator in my project? I use FlashDevelop.
In your project.xml, use:
<haxedef name="canvas" if="html5" />
or:
<haxedef name="dom" if="html5" />
Anyway appears black screen.
I am out of ideas. 
Do you have working sample?
As you use FlashDevelop, what’s the build command in the output panel, it might be that FlashDevelop uses webgl key to compile.
My advice is to type& run the command in the console directly, to make sure that what you enter is what you actually get.
When I try exit from fullscreen, I press ‘Esc’, but there is no event KeyboardEvent.KEY_DOWN. And I can’t track the moment of exit from fullscreen by pressed ‘Esc’ button.
I solved this by events from javascript, but javasctipt does not react to F11.
For the record, this is Haxe’s documentation, so it doesn’t necessarily apply to OpenFL. The main point of OpenFL is to take Flash-only features and make them work on other platforms.
That said, OpenFL hasn’t finished implementing all of Flash’s features, and stage.displayState seems to be one of the unfinished features.
This implemented for desktop, but not HTML5, happy to work with someone to support it
Here is a solution. Not the beautiest, but its work:
private function buttonClicked(event:MouseEvent):Void {
this.toggleFullscreen();
}
private function toggleFullscreen() {
var isInFullScreen = untyped __js__("(document.fullscreenElement && document.fullscreenElement !== null) ||
(document.webkitFullscreenElement && document.webkitFullscreenElement !== null) ||
(document.mozFullScreenElement && document.mozFullScreenElement !== null) ||
(document.msFullscreenElement && document.msFullscreenElement !== null);");
if (isInFullScreen) {
if (untyped __js__("document.exitFullscreen")) {
untyped __js__("document.exitFullscreen()");
} else if (untyped __js__("document.webkitExitFullscreen")) {
untyped __js__("document.webkitExitFullscreen();");
} else if (untyped __js__("document.mozCancelFullScreen")) {
untyped __js__("document.mozCancelFullScreen();");
} else if (untyped __js__("document.msExitFullscreen")) {
untyped __js__("document.msExitFullscreen();");
}
}
else {
if (untyped __js__('document.getElementById("openfl-content").requestFullscreen')) {
untyped __js__('document.getElementById("openfl-content").requestFullscreen()');
} else if (untyped __js__('document.getElementById("openfl-content").mozRequestFullScreen')) {
untyped __js__('document.getElementById("openfl-content").mozRequestFullScreen()');
} else if (untyped __js__('document.getElementById("openfl-content").webkitRequestFullscreen')) {
untyped __js__('document.getElementById("openfl-content").webkitRequestFullscreen()');
} else if (untyped __js__('document.getElementById("openfl-content").msRequestFullscreen')) {
untyped __js__('document.getElementById("openfl-content").msRequestFullscreen()');
}
}
}This should be supported using stage.displayState since Lime 5.1.0, but let me know if it does not work properly or could improve
Hello!
I’m reviving this thread because I ran into a problem with Fullscreen support on HTML5 as well, for a game powered by OpenFL + Starling. I’m using OpenFL 7.1.2, Lime 6.2.0 and Starling 2.3.1.
The game has normally a fixed size of 760px x 650px inside the HTML page.
I do Starling.current.nativeStage.displayState = StageDisplayState.FULL_SCREEN_INTERACTIVE in response to a MouseEvent.MOUSE_UP OpenFL event (because a Starling Event.TOUCH wouldn’t be recognized by the browser as user input so the fullscreen request would be denied with an error in the console saying “Failed to execute ‘requestFullscreen’ on ‘Element’: API can only be initiated by a user gesture.”).
And I don’t get any errors this way and the browser does go to full screen (I get a temporary pop-up at the top saying " is now full screen. Exit Full Screen (Esc)". However, my Event.RESIZE handler set on the nativeStage is not getting called, so the game doesn’t actually resize. It either remains the same 760x650px, but centered on screen instead of the original top-left corner (in Chrome), or does get expanded to fit the screen height (in Firefox), but this is not a Stage expansion (neigher nativeStage, nor Starling Stage), and the aspect ratio doesn’t change. As I said, no Event.RESIZE is ever called inside my code.
Strangely I do get a FullScreenEvent.FULL_SCREEN event dispatched, and I can read a displayState of StageDisplayState.FULL_SCREEN_INTERACTIVE from withing that handler, but it happens only once, on the first attempt to go to full screen. Subsequent attempts don’t trigger this event anymore (unless I refresh the page and try again), and still no Event.RESIZE, not even on that first attempt.
I’m using
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
What am I missing? I tried StageDisplayState.FULL_SCREEN instead of StageDisplayState.FULL_SCREEN_INTERACTIVE, I’ve tried resizable=“true” / “false” and fullscreen=“true”/“false” in project.xml, I’ve tried to fiddle manually with the generated index.html, but to no avail. I can cause minor differences in the way it expands the content or not, but I can’t make it do perform a true fullscreen that it recognized by OpenFL code as such and resizes my Stage.
In a Flash build it works like a charm, the problem is on HTML5 target only.
Has anyone else hit this problem? Can we do anything about it?
Thanks!
I had a similar issue with stage.fullScreenSourceRect, and ended up with a specific workaround for OpenFL :
Regarding your issue about the stage staying centered in Chrome, I fixed it by patching the style properties in the generated index.html :
html,body { margin: 0; padding: 0; height: 650px; }