Sunday, June 29, 2008
Preloading with Flex for actionscript projects still seems to be really under-documented. Personally I've found it to be a bit of a joke that you've got to search half a dozen sites to find out how it's done, I mean it's preloading, it's what Flash does.

So I thought I'd add "my" approach here. It's what I'm using and seems to work well, it's been cobbled together by reading through the half a dozen websites, so I'm not claiming it's all my code or my idea, it's other peoples code who are clever than me shoved together.

Let's start at the begining,

package {
    import flash.display.DisplayObject;
    import flash.display.Loader;
    import flash.display.LoaderInfo;
    import flash.display.MovieClip;
    import flash.display.StageQuality;
    import flash.display.StageScaleMode;
    import flash.events.Event;
    import flash.utils.getDefinitionByName;

    [SWF(width="400", height="600", frameRate="40", backgroundColor="#FFFFFF")]

    public class Preloader extends MovieClip{
//---------------------------------------------------------------------------------------
// Properties
//---------------------------------------------------------------------------------------
        private var logoClass:Class;
        private var logoClassInstance:Object;
        
//---------------------------------------------------------------------------------------
// Constructor
//---------------------------------------------------------------------------------------
        public function Preloader() {
            stop();
            stage.showDefaultContextMenu=false;
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.quality=StageQuality.LOW;

            addEventListener(Event.ENTER_FRAME,mainloop);
        }

//---------------------------------------------------------------------------------------
// Private
//---------------------------------------------------------------------------------------
        private function mainloop(e:Event):void{
            if(framesLoaded >= 2){
                nextFrame();
                triggerLogo();
                removeEventListener(Event.ENTER_FRAME,mainloop);
                addEventListener(Event.ENTER_FRAME,mainloop2);
            }            
        }

//---------------------------------------------------------------------------------------
        private function mainloop2(e:Event):void{
            if(framesLoaded == totalFrames){
//It's all loaded, has the logo finished ?
                if(logoClassInstance.animCompletedFlag==true){
                    removeEventListener(Event.ENTER_FRAME,mainloop2);
                    nextFrame();
                    triggerGame();
                }
            }            
        }

//---------------------------------------------------------------------------------------
private function triggerLogo():void{
            logoClass = getDefinitionByName("PreloaderLogo") as Class;
    if(logoClass) {
        logoClassInstance = new logoClass();
        addChild(logoClassInstance as DisplayObject);
    }
}

//---------------------------------------------------------------------------------------
private function triggerGame():void{
            var main:Class = getDefinitionByName("Main") as Class;
    if(main) {
        var app:Object = new main();
        addChild(app as DisplayObject);
             app.waiting();                        //Call the singleton to kick it all off
                logoClassInstance.dispose();
    }
}

//---------------------------------------------------------------------------------------
    }
}

Just to run through this nice and quickly, the preloader extends the MovieClip class as we're using 3 frames for the game ( The actual preloader class, the PreloaderLogo class and the Main one ( Which is the game itself )).
In the constructor we just do all the stage stuff that we want to do ( Hide that menu ), and then run an eventListener ( Mainloop ) which checks to see how much of the overall game has loaded. If frame 2 has loaded it means how logo is loaded, so we can fire that off ( See the trigger logo method, and below is the PreloaderLogo class )

package {  
    import flash.display.MovieClip;
    import flash.display.Sprite;
    import flash.events.Event;
    
    public class PreloaderLogo extends Sprite {
//---------------------------------------------------------------------------------------
// Assets
//---------------------------------------------------------------------------------------
        [Embed("/_assets/assets.swf",symbol="gywLogoMC")]
        private var gywLogoMC:Class;

//---------------------------------------------------------------------------------------
// Properties
//---------------------------------------------------------------------------------------
        private var gywLogo:MovieClip;
        public var animCompletedFlag:Boolean=false;
        
//---------------------------------------------------------------------------------------
// Constructor
//---------------------------------------------------------------------------------------
        public function PreloaderLogo(){
            gywLogo=new gywLogoMC();
            waiting();
        }

//---------------------------------------------------------------------------------------
        public function waiting():void{
            addEventListener(Event.ADDED_TO_STAGE,logoAddedToStage);
        }

//---------------------------------------------------------------------------------------
        public function dispose():void{
            stage.removeChild(gywLogo);
        }

//---------------------------------------------------------------------------------------
// Private
//---------------------------------------------------------------------------------------
        private function logoAddedToStage(e:Event):void{
            stage.addChild(gywLogo);
            gywLogo.gotoAndPlay(1);
            gywLogo.addEventListener(Event.ENTER_FRAME,waitingToEnd);
        }

//---------------------------------------------------------------------------------------
        private function waitingToEnd(e:Event):void{
            if(gywLogo.currentFrame==gywLogo.totalFrames){
                gywLogo.gotoAndStop(gywLogo.totalFrames);
                gywLogo.removeEventListener(Event.ENTER_FRAME,waitingToEnd);
                animCompletedFlag=true;
            }
        }


//---------------------------------------------------------------------------------------
    }
}

All that's happening there is the class embeds our logo and plays the animation. The waiting() method checks to see if this class has been added to the display list, if we don't wait then you open up a world of pain where the class can't find the stage.
The waitingToEnd method is as simple as it gets, once the animation has finished it just sets the animCompletedFlag to true.

Going back to the preloader class, after the PreloaderLogo class has been triggered we're running mainLoop2. That's just a check to see if the whole game ( ie all 3 frames ) has loaded. If it has when then check for the animCompletedFlag to be true. If it isn't it means the preloader logo is still running, if it is true, then we're done. The game has loaded and our sexy intro anim is done. From there we do exactly what we did before and trigger our Main class ( The game itself ).

The last part of this is the setting in Flex itself. Right click your project and select properties. From there go to the "ActionScript Compiler" options and pass the following arguments to the compiler
flex.png
(click image to enlarge)

And finally after jumping through an insane amount of hoops you should have a working preloader. The logo class can be whatever you want, and there can be more than 3 frames, if for example you want a loader bar to be displayed quickly and then bring in your logos.

*Update - I've posted the source to Operation Cortex, which includes the preloader code which should make life easier*

Squize.

Sunday, June 29, 2008 3:30:55 PM (W. Europe Daylight Time, UTC+02:00)  #    Disclaimer  |  Comments [0]  |  Trackback
 Saturday, June 28, 2008
This is somewhat of a rant post (again), although, it might just become some sort of history lesson... we'll see where it ends.

My current game somehow managed to be a real endurance test (as you might remember, if not, read it here), a lot of things that I had never done before, or at least not very often. The combination of the specific genre and the "new" language ... well it took it's time.
As a minor update on this, the game now seems to become more playable by the minute (oh, and yes, I rewrote the damn movement routine, dropping about 50% of the code needed making more stable and of course working - yet again I wonder why I haven't wrote it that way in the first place ... well never know.)

So while coding I started to look ahead for my next project. One of the things I didn't want this time, was to re-invent the wheel, so I had a lok at the game-engines I had coded so far and I discovered one, that never had been used in a game before, but was 100% working. It lacked of course all the nice and shiny things, it was just a working, ugly game - but something a lot of people seem to like (looking around the casual game scene).

The decission was quite an easy one, ignoring the fact that this is just a "me too" game.

Let the ideas come ...

Think, think, think.

One by one the ideas came in, this usually a blend of things I like or like to use, but hey, we're just at the beginning.

STOP.

This time I want something less bloated, slick, clean, minimalistic UI. Once again, I've spend a good time just hunting for inspiration, playing a few of some of the best minimalistic games I've managed to find so far, Tonypa's. They are slick, clean, easy to pick up and don't contain more than the barest minimum of visuals.

Great. Wait. It would be nice if I would add a hint of a background story ...
Oh, and for that I have a great set of visuals in mind ...
Hey, what if I let the player decide what to do next, even though it's just a puzzle game ...

Darn. That's for "less bloated, slick, clean, minimalistic".

Why do I think that this belongs into a game - trying to find the answer.

First of all, I don't like 99% of the mini games that are available in flash. this includes all the "tunnel games", "click as fast as you can", and even praised games like "filler" (which is a nice variation of the qix heme) leave me cold.
I think, it may be, because I've seen their predecessor in various forms on different systems before.
OK, so for me there needs to be some sort of substance attached to a game.

I grew up with a c64 and I collected games (as nearly everyone of this time did), I think my collection had over 2000 games, most of them well, not quite legally optained. But I also owned some original games and paid real money for them. (30 DM, which was a fucking amount of money for a 12 year old school kid).

Anyway these games pretty much defined what I like about games and what not, I like pretty visuals (ok, compared to today those old games look really shit), I like good sound (and I think it's essential for a game) and I like some sort of depth (just clicking and holding for creating a filled circle is it not), a simple form of variation ...

I even tried to add that to "Law of the West", which is a bit shallow, to be honest, but there is some sort of variation in it.

Most of the full price games had at least one or the other, even the low price games from Mastertronic had a lot more game to it than some of the hyped flash games.

Back to pen and paper ... and forget "quick and easy"

Just before I started to write this (and bore you to death) I grabbed a pencil and some sheets of empty paper and began to sketch things out, draw a few charts about the progression of the game and what kind of things I want to add in order to distinguish my "me too" game from all the successfull ones that are already out.

So far I like what I came up with, as I believe I have added some unique things to the core gameplay. Of course it is way bigger than what I wanted in the first place and for sure just as I write this, someone had the same ideas.
To make it even more ... well, use a word you like ... I decided to go with a Pirate theme (still very popular, and although my first idea was to make a third LotW themed game, but I couldn't fit in the ideas I wanted to add)

The basic tasklist so far looks like this:
  • draw a worldmap based on the Caribbean Sea around 1500
  • create a set of outdoor images for the menus and ingame screens
  • maybe create some 3d characters (so it won't look like Myst, ... yet I still want to do my own Myst-like flash based adventure game)
  • draw a map of the decissions a player could make
  • draw the level maps/playfields for the levels (I mentioned it's some sort of puzzle game?)
  • decide on extras that can be used to help the player
  • create a list of nice "medals" (more about that in later post, but right now, play the LotW Pinball to see some).
  • find a way to allow savegames, either over the server, or using a code or shared objects

I'll let you know where this ends, and maybe (if there is interest) I go into detail and post some of the sketches and early renderings.
It seems like this one became a bit more than a simple re-use of an already existing game engine. It also seems that I decided to go a good deal beyond the usual flashgame timewaster - and it clearly shows that I'm nuts. I don't even know if there is money in this one (either as license or (most likely not) as sponsored game (as I had my share of sponsoring madness so far).

stupid me.

nGFX

Saturday, June 28, 2008 1:02:26 PM (W. Europe Daylight Time, UTC+02:00)  #    Disclaimer  |  Comments [0]  |  Trackback
 Wednesday, June 25, 2008
Look what's live now

pinballAd.jpg

Play it here: Law of the West Pinball

Squize.

Tuesday, June 24, 2008 10:13:47 PM (W. Europe Daylight Time, UTC+02:00)  #    Disclaimer  |  Comments [9]  |  Trackback
 Friday, June 20, 2008
"...two posts in one day?"

Just a quick post to pimp a new game out today, Big Bod Says

bb_grab.png

It's just a bit of throw away pointless fun. Bit of trivia, the voice of Big Bod is actor Timothy Spall, which is nice.

Squize.

Friday, June 20, 2008 1:59:17 PM (W. Europe Daylight Time, UTC+02:00)  #    Disclaimer  |  Comments [0]  |  Trackback
Back.

It's been a while (again) since my last post so this is kind of a catch up of what happend to the game that badly needs to be finished soon.

First let me tell you how much I hate tilebased games.

The current game is my first "real" tilebased game, so this might change after I've finished this one, but for now ... I hate them.

  • Here's a little description of the game.
  • Action and timebased puzzlegame
  • collect keys and items to open doors and avoid obstacles
  • avoid monsters running around
As the game has a built in editor my first (and wrong) idea was to built the map based on the requirements of the editor, which needed to add some additional things:
  • 2 layers, one floor and on "on top" so you could place things below other things
  • connections between certain buttons and their "endpoint"
  • ability to alter the monster order (because monsters can trigger buttons, for instance)
Basically to build the editor was easy (taking into account that it must be easy to use and still allow to edit all aspects of a level), after I did a complete layout in Photoshop I used that as roadmap for coding.

(Did I mention that this is my first AS3 project?), first week

As always the first quite easy project turned into something that's tested my endurance, the switch to AS3 was not as hard as I feared and I found my way around the mass of classes faster than I thought (I think it's because I'm used to .NET which works like this for a lot longer now).

The first few days I spent with converting my toolset to AS3 and setting up (and redefining) my working environment. So it was alot of coding without having something to play with. Then there was a good deal of time "wasted" reading ...

So where is my timeline, week two (or so)

I'm using CS3 and FlashDevelop instead of flex/eclipse, mainly because I can't stand eclipse's behavior and FD looks and feels a lot like Visual Studio, so I feel more at home there.

My first idea was to go with a 1 frame sollution, but this also would mean no pretty preloader, so I got my head around that started with a preloading/main class.
Hunting for a replacement for "this.getBytesLoaded()" I finally came up with this:

        public function Preloader() {
            
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.showDefaultContextMenu = false;

            [...]

            this.addEventListener(Event.ENTER_FRAME, this.onEnterFrame);
            
            this.loaderInfo.addEventListener(Event.INIT, this.initDisplay);
            this.loaderInfo.addEventListener(Event.COMPLETE, this.initApplication);
            this.loaderInfo.addEventListener(ProgressEvent.PROGRESS, showProgress);

            this.stop();
            
        }
        

        public function showProgress(eProgress:ProgressEvent):void {

            var fPercent:Number = Math.round((eProgress.bytesLoaded / eProgress.bytesTotal )*100 );
            var mcProgressbar:MovieClip = MovieClip(this.getChildByName("mcProgressBar"));
            
            with (mcProgressbar) {
                mcBar_00.width = fPercent * 2;
                
                [...]
                
            }
            
            if (this._iState == STATE_NOP) {
                this._iState = STATE_LOADBG;
            }
            
        }

You may notice my excessive use of "this", I know it's not needed, but I kinda like it, as it helps me to see at a first glance what is coded on class level and what is defined in the current method (and it also triggers autocomplete :) ).

One of the very first problems I encounter was the missing support for Movieclips in AS3, not that it is gone but it's not as straight forwards as it could have been.

"Oh you don't need MCs anymore", week two, Wednesday

Of course I do. Damn.
Sure I could code a complex UI and create and place every button, textbox, bitmap by code, but to be honest: WHY? (when you finally see the UI you understand why, I just say more than 150 elements ...).
Though I learned how to get along with it.

"Yes, that looks good", week three

After the main screen was done, it's time to start with the editor.
The layout was done so I could just dive into coding the UI for it, but yet again the next few days were a pain, because theres was just nothing to see.

The game needed a map structure (internally and for saving and reading xml), so I decided to code a map class that not only was able to hold the level's data, but also a methods for handling serializing xml and the map editing methods.

Also I coded a tile engine, which later was converted into the main game engine class. Why? Well, I decided that I don't want to switch to "real" game mode when testing the currently build map (also game and editor are using different tile sizes). So the tile engine is there (because I need it in the editor) and writting an extra game class would have meant to either create a new instance from withing the game or link it in using a reference.

Now I just switch the state of the tile engine and it runs as game and inside the editor.

To run it as "real" game I now just have to pass over the new tilesheet and the game can be run in a different environment. wow.

Fast forward some weeks now, week ... I stoped counting

A lot of code, more code, even more code without being able to play with the result. To be honest I got utterly pissed and depressed.

While coding this game a lot of different flash projects and some dynamic websites needed to be done too, like this: http://akademie.gira.de/ a database driven web based training site, multi language enabled, but in German only right now, so there was a lot of flash and 3D to do, too.

I now can edit a map, but I still can't play it. Time to wander away from flash and write something to save the map ... and wrote this: FileSave.

It's alive, IT'S ALIVE!, this week

Finally at the game is playble in parts (at least in the editor), "in parts" means: the first level can be played, still there are some features missing that need to be added, but I'll add them when I add the original game's first 150 maps (I mentioned it's an official licensed remake, didn't I?)

To get there I needed to convert the nice thought out editor map format into something that can be used to play the game, yes I could have thought about that earlier but hey, it's my first tile based game (Wintertales and Logimotion seem to be Tilebased, but I used it only for the "background, while all movement is done by math).

Yesterday it finally all fell into place and WORKED, the player is moving, can collect keys, open doors ... and the first level can be solved.

After I moved away from frame based and went over to time based movement (read a great tutorial from Jeff of 8bitrocket here).

Hopefully I'll don't forget to return posting about the progress from now on.

Anyway I planed to post a basic overview of the classes and structure used later. (and to be honest I need get to coding :) )

nGFX


Friday, June 20, 2008 12:40:08 PM (W. Europe Daylight Time, UTC+02:00)  #    Disclaimer  |  Comments [1]  |  Trackback
 Tuesday, June 17, 2008

I'm enjoying these one word titles, it's saving me a bit of effort when trying to think of something catchy.

Anyway, the purpose of this post is below. Forgive youTube it's nasty nasty compression, we did try vimeo over and over again, but it just kept falling over on the file.

 

Or you can hit it directly here.

I really don't know when it'll be out, there's been a general appathy towards it atm, perhaps we need to add a shop system to it.

Squize.

Tuesday, June 17, 2008 9:45:25 AM (W. Europe Daylight Time, UTC+02:00)  #    Disclaimer  |  Comments [6]  |  Trackback
 Friday, June 13, 2008

The final Phantom Mansion went live today. I just needed to share that, after 8 episodes and nearly a year working on it ( A hetic 3/4 days every month just before release ).

So that's it for me and Hector. Freedom.

I'd like to thank all the die hard fans of the series for their constant support, and anyone whose taken the time to vote on it on any portal where they've been hosted.

And it's time for the final link to mansion for this blog, here, right here.

Squize.

Friday, June 13, 2008 2:45:44 PM (W. Europe Daylight Time, UTC+02:00)  #    Disclaimer  |  Comments [0]  |  Trackback
 Wednesday, June 11, 2008

Sorry things have been quiet here for a while, I've been busy going to a couple of weddings and making it to 36 without dying ( Quite an achievement considering my lack of doing anything healthy ).

The pinball game still isn't quite gold yet, we're hoping to finally kill it off Thursday. In the mean time whilst it's sitting on FGL we've been included in the new "First Impressions" feature of the site, which I think is a really great idea ( I think it may well still be beta, so I don't want to blab too much about it here as it's not my place to ).

The thing with feedback is culling out the good useful comments from the noise. And by good I don't just mean the "nice work" style comments, but the comments that make you remove the blinkers a little and be objective about the game.

The main concern which has come up is that people really don't like the fact that it scrolls. I find this weird in that I'm used to the 16bit era of pinball games where they all scrolled. It allows for a playfield which is a lot less cluttered and just gives everything a nice sense of scale and scope. I'm just hoping that the slighty broken camera in the version they tested ( Which is fixed now and hopefully always gives you the best view of what's happening and where the ball is going to go ) is the main reason people weren't liking that aspect. If not, then well it's not going to be that popular and that's all there is to it.

grab_lowP.jpg

Yeah, that's a reflection on there.

Another interesting point raised was about the flipper movement, a lot of people felt that there was almost a lag on them, so that was fixed last night to make them more responsive.

Aside from that ( And filtering out the noise like I said earlier, eg "there are not enough features on the pinball board/play area itself (no bumpers/ramps/etc)", aside from those 3 bumpers and 2 ramps you mean ? ) it's just a polarised comments ( "Too complicated", "Not complicated enough", "Instructions too brief", "Instructions too wordy" ) and things we were aware of anyway, such as the animations running too slow ( This was due to developing at 60fps and then having to drop it down to 40fps for the browser version ).

So a bit more love, a couple of bug fixes, a few more assets from Olli, and it's good to go. We just need someone to buy it off us then.

Squize.

Wednesday, June 11, 2008 1:18:50 PM (W. Europe Daylight Time, UTC+02:00)  #    Disclaimer  |  Comments [3]  |  Trackback