Resize event and/or fullscreen on Flash embedded in html

Hi everyone,

I went to publish my game last week for the MiniLD, and I ran into a big hiccup. A key feature of my game did not work in HTML5. So, I went to republish it in Flash, which had been working as I developed it. I published on itch.io, which then had a link specifically designed for Ludum Dare embedding, and I used that, and enabled the fullscreen option in Ludum Dare. (It’s designed for larger than the maximum resolution that Ludum Dare lets you embed, so resizing/fullscreen is a bit crucial.) All that to say, because it’s hosted by LD, I don’t have control over the embedding code like in this thread: Flash build which uses the entire available window as stage?

The problem is, switching to fullscreen when playing the embedded swf from LD doesn’t seem to fire a resize event, like it does if I play the swf in a standalone player.

Is there some way to accomplish this?

(My preference would have been HTML5 working from the beginning, but somehow a really basic switch statement has different behaviours between the two platforms.)

Any errors in the console? Can you temporarily switch to an if/else if that fixed the problem?

Oh you mean about the switch statement, actually that’s what I eventually did, and it did work (the if/else). Quite oddly, with the switch, no errors were in the console, and the game kept running, even though what it turns out was happening was that way after the switch statement, I had something that would cause an error. With the if/else, the error showed up just fine (and also output all the debug statements, and stopped the game.) With the switch, the debug statements I had just after the case began did not get flushed and yet the game kept running and no error was output. I still think there’s a bug there of some kind, because now that I’ve fixed the error-causing thing, I still need to use an if/else there otherwise my game is broken due to odd switch behaviour:

trace("starting out", _ui.currMode, _ui.currMode == "fairy_destination");
            switch (_ui.currMode) {
                case "optional_village":
trace("not here", _ui.currMode, _ui.currMode == "fairy_destination");
                    if (Std.is(itemClicked, Village)) {
                        var village = cast(itemClicked, Village);
                        if (village.side == ISLANDER) {
                            villageIndex = villages.indexOf(village);
                            setMode("fairy_destination");
                        }
                    }
                case "fairy_destination":
trace("we should get here", _ui.currMode, _ui.currMode == "fairy_destination");
                    if (tileMap.getTile(clickedX, clickedY) != BigMap.colourMap.indexOf(FlxColor.BLUE)) {
                        destX = clickedX;
                        destY = clickedY;
                        setMode("plant_types");
                    }
                default:
trace("not here 2", _ui.currMode, _ui.currMode == "fairy_destination");
                    setMode("general");
trace("not here 2 end", _ui.currMode, _ui.currMode == "fairy_destination");
            }
trace("done the switch statement", _ui.currMode, _ui.currMode == "fairy_destination");

How is it possible that this outputs the following, on Firefox and Chrome both?

State_Play.hx:585: starting out,fairy_destination,true
State_Play.hx:604: not here 2,fairy_destination,true
State_Play.hx:719: 
State_Play.hx:721: 
State_Play.hx:725: 
State_Play.hx:606: not here 2 end,general,false
State_Play.hx:608: done the switch statement,general,false

In particular, that second line makes no sense to me whatsoever. It went to the default branch instead of the case "fairy_destination" even though clearly _ui.currMode == "fairy_destination" as seen in the trace output. If I step through with the debugger in the console, it indeed jumps from the switch down to the default, not even stopping on the case lines (which is what happens in the Flash debugger, each case line gets a step.)

Flash OTOH gives this output:

State_Play.hx:585: starting out,fairy_destination,true
State_Play.hx:597: we should get here,fairy_destination,true
State_Play.hx:719: 
State_Play.hx:721: 
[a bunch of normal output from setMode("plant_types") here, without errors...]
State_Play.hx:608: done the switch statement,plant_types,false

Also I guess I can assume the resize event from Flash embedded in HTML isn’t guaranteed unless you have control over the embed code?

Perhaps we’ll have to look at the generated JS to find out

As for Flash resize code, does the Flash plugin embed get resized? If not, then it is not really resizing. Maybe if you embed to a 100% size, or use some other code to resize that way?

The generated JS looks OK:

haxe_Log.trace(this._ui.get_currMode(),{ fileName : "State_Play.hx", lineNumber : 567, className : "State_Play", methodName : "clickMap", customParams : [this._ui.get_currMode() == "fairy_destination"]});
var _g2 = this._ui.get_currMode();
switch(_g2) {
case "fairy_destination":
    haxe_Log.trace("right",{ fileName : "State_Play.hx", lineNumber : 570, className : "State_Play", methodName : "clickMap", customParams : [this._ui.get_currMode(),this._ui.get_currMode() == "fairy_destination"]});
    break;
default:
    haxe_Log.trace("wrong",{ fileName : "State_Play.hx", lineNumber : 572, className : "State_Play", methodName : "clickMap", customParams : [this._ui.get_currMode(),this._ui.get_currMode() == "fairy_destination"]});
}

But stepping through it, it jumps direct to default. (Maybe this is normal on JS debuggers, to jump straight to the one it’s going to execute, but on Flash at least, the debugger steps through each case line until one matches.)

As for the embed, I’m not sure what you mean exactly, but in case it helps I switched to embedded flash temporarily to find out what the embed code Ludum Dare uses looks like, and it’s this:

<object style="visibility: visible;" id="swf_drop" data="https://commondatastorage.googleapis.com/itchio/upload2/game/[edited for brevity]" type="application/x-shockwave-flash" height="579" width="898"><param value="direct" name="wmode"></object>

My project.xml looks like this (all other window tags are commented out; I tried several variations with regards to resizable and fullscreen without luck):

    <window width="1024" height="600" fps="60" background="#000000" hardware="true" vsync="true" resizable="true" fullscreen="true" />

And my Main.hx constructor has simply:

        addChild(new FlxGame(1024, 600, State_Title, 1, 30, 30, true));
        FlxG.scaleMode = new StageSizeScaleMode();

What Haxe type is currMode?

It looks like the Flash embed is hard-coded to use height="579" width="898" and will not be resized later

String. And the getter just returns a private variable. No monkey business.

As for the Flash embed, I’m not sure what mechanic they use exactly–I’d have to do it again and check the source–but they do provide a full-screen button on ludumdare.com. I’d think that’d cause a resize (it does in Flash standalone, pressing Ctrl+F to go full-screen.)

It’s strange that the switch would fail, I’ve never heard of this, and can’t see anything that would suggest why it would

1 Like

Thanks for the review at least. :slight_smile: