After a bit of time using my Wacom in the Flash IDE, I recreated the sketches in vector format, and then separated them into MovieClips and Graphic symbols.

Here is an example of how I decided to organize all of the different assets for now. Notice that two of the items, Gui and gauge, have linkage properties, which is why their "Export" property isn't blank like the rest of the symbols in the library.

First, let's take a look at the code and assets in the Gui class. Here's a screenshot of the assets, and their instance names:

And now, here is the code to go along with the Gui class:

package
{
	import flash.display.MovieClip;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.text.TextField;

	public class Gui extends MovieClip
	{
		// Event constants
		public static const APPLE_CLICKED:String = "apple clicked";
		public static const CHEESEBURGER_CLICKED:String = "cheeseburger clicked";

		// Gui elements
		public var age_txt:TextField;
		public var weight_txt:TextField;

		public var boredomGauge:Gauge;
		public var hungerGauge:Gauge;
		public var thirstGauge:Gauge;

		public var apple:MovieClip;
		public var cheeseburger:MovieClip;

		public function Gui()
		{
			// set labels
			boredomGauge.label.text = "Boredom";
			hungerGauge.label.text = "Hunger";
			thirstGauge.label.text = "Thirst";

			// add button function to apple
			apple.addEventListener(MouseEvent.CLICK, function(evt:Event) { dispatchEvent(new Event(APPLE_CLICKED)); }, false, 0, true);
			apple.buttonMode = true;
			apple.useHandCursor = true;

			// add button function to cheeseburger
			cheeseburger.addEventListener(MouseEvent.CLICK, function(evt:Event) { dispatchEvent(new Event(CHEESEBURGER_CLICKED)); }, false, 0, true);
			cheeseburger.buttonMode = true;
			cheeseburger.useHandCursor = true;
		}

		public function update($tom:Tom):void
		{
			// update all Gui fields based on $tom variable
			age_txt.text = String($tom.age);
			weight_txt.text = String($tom.weight);
			boredomGauge.value = $tom.boredom;
			hungerGauge.value = $tom.hunger;
			thirstGauge.value = $tom.thirst;
		}

	}

}

Since it's all new, let's go through it line by line.

First, you will notice two public static constants, APPLE_CLICKED and CHEESEBURGER_CLICKED, which will serve as temporary Event descriptions. We then define our textfields, age_txt and weight_txt.

Then we define the gauges, boredomGauge, hungerGauge, and thirstGauge, which make use of another new class, Gauge.as.  Finally, we need something to click on, which interacts with our character.  For now, I've created two simple MovieClips and cleverly named them apple and cheeseburger, but  in the future I will connect these to the Food.as class.

Other than the declarations we just went over, there are only 2 functions to the Gui.as class right now, the constructor function, Gui(), and update().  The constructor function is pretty simple, we just assign labels to the gauges.  Each item which uses the Gauge.as class is basically a MovieClip with certain child item, including a textfield named label. Next, we add MouseEvent listeners to the apple and cheeseburger MovieClips, which in turn dispatch an event.  This may seem redundant, but it's one way of separating the logic in the Gui fro the game logic, which will reveal it's use as the project increases in complexity.

The remaining function, update(), is used to refresh the gui to reflect all of the current values of the passed Tom.as object.

For Part 5 we'll explore the Gauge.as class, and then see everything in action so far!

here it is in action on wonderfl

The explanation (or tutorial) part of this post will be complete soon.  I will also optimize the code in the next couple of posts.  Until then, take a look at the code and try to understand what's going on.

package
{
    import flash.display.Sprite;

    public class SlotMachine extends Sprite {

        private var _credits:uint = 4; // start with $20

        private var _slotReel1:SlotReel;
        private var _slotReel2:SlotReel;
        private var _slotReel3:SlotReel;

        public function SlotMachine()
        {   

            _slotReel1 = new SlotReel();
            _slotReel2 = new SlotReel();
            _slotReel3 = new SlotReel();

            spinReels();
            spinReels();
            spinReels();
            spinReels();
        }

        private function spinReels():void
        {
            if (_credits)
            {
                _credits--; // costs $1 per spin

                _slotReel1.spin();
                _slotReel2.spin();
                _slotReel3.spin();

                // check for matches
                if (_slotReel1.value == _slotReel2.value && _slotReel1.value == _slotReel3.value)
                {
                    trace("win!");
                    _credits += 1000;
                }
                else if (_slotReel1.value == _slotReel2.value)
                {
                    _slotReel1.hold = true;
                    _slotReel2.hold = true;
                }
                else if (_slotReel1.value == _slotReel3.value)
                {
                    _slotReel1.hold = true;
                    _slotReel3.hold = true;
                }
                else if (_slotReel2.value == _slotReel3.value)
                {
                    _slotReel2.hold = true;
                    _slotReel3.hold = true;
                }

                trace(_slotReel1.value + " " + _slotReel2.value + " " + _slotReel3.value+" credits left: "+_credits);
            } else {
                trace("out of credits!");
            }

        }

    }
}

import flash.display.MovieClip;

class SlotReel extends MovieClip {

    private var _numberOfSlotFrames:uint = 12;
    private var _currentSlotFrame:uint;
    public var hold:Boolean;

    public function SlotReel(){ super(); }

    public function spin():void
    {
        if (!hold)
        {
            _currentSlotFrame = Math.round(Math.random() * (_numberOfSlotFrames- 1) + 1);
            gotoAndStop(_currentSlotFrame);
        }
    }

    public function get value():uint { return _currentSlotFrame; }
}

To get started, let's have a look at what's changed in the Tom.as class. First, look at the getter function:

public function get weight():Number {
	// when returning weight, round to 1 decimal
	// this way "weight" getter function will return 201.5
	// while private variable _weight will still be accurate
	return Math.round(_weight * 10) / 10;
}

We could have easily made _weight a public variable, but then it will return a very long number (201.12395323). Most digital scales aren't even that accurate, nor do most people need to know their weight to that many decimal points. Programming wise, we want to make sure Tom's weight is as accurate as possible, so behind the scenes, we are storing the entire decimal within the private variable _weight, but whenever something outside of the Tom.as class requests to know Tom's weight, Tom will return his weight rounded to the nearest single decimal through the weight getter method (which to outsiders, looks like a variable instead of a function). You may be thinking, "but I could just get Tom's weight, then round it myself!" That's true, however I prefer doing this within the getter method, so that I can take care of formatting in one place, instead of many different places.

I also added the rest of the simple getter functions, in case I want to create similar functions to the weight function above.

// getter functions for private variables
public function get health():String { return _health; }
public function get mood():String 	{ return _mood; }
public function get hunger():uint { return _hunger; }
public function get thirst():uint { return _thirst; }
public function get boredom():uint { return _boredom; }
public function get age():uint { return _age; }

The previous tutorial (Part 2) covered getter functions, so this shouldn't seem brand new. We haven't covered setter functions yet though, so let's take a look at that:

// example setter function
public function set weight(value:Number):void
{
	// we shouldn't allow the weight variable to be changed
	// unless it's through the eat() or drink() functions
	throw new Error("Hey, no cheating your diet!");
}

Let's take a step back for a second. Right now, we have a "Tom" class, that has a private variable _weight, which can only be accessed from within the Tom.as file. One way to think about it is this: since _weight is private, it's almost like a secret that "Tom" is keeping to himself. Unless there is a public function created to expose that variable to the rest of the world, there will be no way to alter or check on Tom's weight. If we make _weight a public variable, then it solves the problem, but creates another: Tom should only be able to gain or lose weight by eating or exercising, not by magically adding or removing X pounds.

Being able to write the following should not be possible, because you can't do it in the real world (and therefore, we won't allow it in this game).

tom.weight = 100; // this is cheating!
tom.weight = tom.weight - 50; // losing 50 pounds is that easy?
tom.weight++; // where did those extra lbs just come from?

In the weight setter function, we throw an error whenever code tries to change the _weight variable directly.  All three of the lines posted above will throw the following error:

throw new Error("Hey, no cheating your diet!");

Instead, Tom will only be able to gain or lose weight through new functions that we'll create, starting with eat():

Tom.as

// public functions
public function eat($food:Food):void
{
	_weight += $food.calories / Food.CALORIES_IN_A_POUND;
	trace("After eating that " + $food.name + ", Tom now weighs " + weight);
}

Here you can see the only place within the Tom.as class which alters the _weight variable. To restate one more time, the only way to change Tom's weight outside of the Tom.as class, is to call this new eat() function. Also, whenever this eat() function is called, Tom will trace out a message that states what he ate, and how much he weighs after eating. To fully understand what's going on, we also need to analyze the new Food.as class, since the eat() function is expecting you to pass it a Food variable:

Food.as:

package
{
	public class Food
	{

		public var calories:uint;
		public var name:String;

		public static const CALORIES_IN_A_POUND:uint = 3500;

		public function Food($name:String, $calories:uint)
		{
			name = $name;
			calories = $calories;
		}
	}
}

That is the entire class so far.  Right away you may notice that I'm using public variables this time! I did this for a couple of reasons: to show how public variables can be easily used instead of private variables with getter/setter methods, and also because it just made more sense in this case. Also notice the constant I've created, called CALORIES_IN_A_POUND, which is equal to 3500.  Using all capital letters for constants, and underscores for spaces is a programming standard.  It's not required by flash, but this is a good habit to get into.

This is also the first function in which we are accepting arguments:

Food.as:

public function Food($name:String, $calories:uint)

Remember, that within this Food.as file, since the "Food" function has the same name of the class, "Food," it's called a constructor function, and is called when a new Food item is created. The $name:String and $calories:uint within the parenthesis denote that in order to create a new Food item, a name must be supplied in string format ("Apple"), and calories must be provided as a positive (unsigned) integer (165). The dollar sign in front of those argument variables is a new feature to AS3 which I've recently discovered, and is a preference thing. Feel free to omit the dollar signs, I like to use them for all of my argument variables, which helps prevent conflicts with duplicate variable names.

The very next line stores the supplied arguments ($name and $calories) into private variables within the Food item. To create a Food item, this is the code:

var someFood:Food = new Food("Burrito", 500);

Which creates a new Food item with the name "Burrito," along with storing 500 calories within that Food item (declared someFood).

And that's it for the Tom.as and Food.as classes. The only other changes to cover are within the TomAS3Gotchi.as class:

TomAS3Gotchi.as:

// feed Tom some food
_tom.eat(new Food("apple", 500));
_tom.eat(new Food("cheeseburger", 3000));

// this will trigger an error
_tom.weight = 100;

The first line is calling our new public eat() function within the Tom.as class. Since eat() requires a Food variable, one is created on that same line, using Food("apple", 500). This creates a new Food object with the name "apple" and 500 calories. The next line is basically the same, but as you can see the Cheeseburger has many more calories. Doing some quick mental math, you can see that 3000+500 = 3500, which is the same number of calories in a pound. This should show us that Tom gains a full pound after eating both items.

The next line is a deliberate attempt to create an error.  We added code in the weight setter function of our Tom.as class, so that an Error will be thrown whenever Tom's weight is changed by any method other than the eat() function.  Let's see what happens:

Just as expected, an error was thrown with our custom message, "Hey, no cheating your diet!"

If you read the full error message in the pop-up window, you can see exactly how that error was thrown.  Start from the bottom and work your way up.  The last line says "at TomAS3Gotchi()[D:\projects\producerism\Tom-as3-gotchi\src\TomAS3Gotchi.as:26]" which means that the error all started with line #26 of TomAS3Gotchi.as:

line #26 of TomAS3Gotchi.as:

_tom.weight = 100;

The line above that is "at Tom/set weight()[D:\projects\producerism\Tom-as3-gotchi\src\Tom.as:50]"

line #50 of Tom.as:

throw new Error("Hey, no cheating your diet!");

And there you have it - first, the TomAS3Gotchi.as class tried to set Tom's weight through the setter property on line #26. Next, within the setter property of Tom.as (line 50), we throw an error. Of course, this wasn't a huge revelation since we knew this error would happen, and caused it to error on purpose. The point is, you may run into an error in another project somewhere, and need to figure out where it's coming from. By following these lines from the bottom to the top, you will be able to figure out the source of most errors.

And that's it for now! I promised some buttons and a crude GUI, so that will be covered in the next part of this series.

Tom-as3-gotchi Flash Game Tutorial - zip, git, or wonderfl. (SVN will be posted soon)

Logically, when a new Tom is created, he should have default values set (for example, weight, height, mood and more).  As the project gets bigger and more complex, I may create a class just to store default values, but for now we'll just add them all to the top of Tom.as.  There are 3 main changes:

First, I've created new static constants for all defaults.  Static basically means that the placeholder (DEFAULT_AGE) will always exist within the Tom class.  Constant means that the value of that constant (DEFAULT_AGE=25) will not change while the program is running.  Since DEFAULT_AGE is a constant, trying to write DEFAULT_AGE = 10 anywhere else in the code will cause an error.  The _age placeholder is a variable though (defined with var keyword instead of const), so that means it can change while the program is running.  This is all sort of unimportant now, and more of a personal preference - but I thought it would be useful to explain it in a little bit of detail.

public class Tom
{
// Constants and Defaults
private static const DEFAULT_WEIGHT :uint     = 200;
private static const DEFAULT_AGE    :uint     = 25;
private static const DEFAULT_MOOD   :String = "Happy";
private static const DEFAULT_HEALTH :String = "Healthy";

Next, I've added some more code to the constructor function.  Again, the constructor function is the function with the same name as the class (in this case, "Tom"), which is run automatically when the class is created.  I've added code that sets the _weight, _age, _mood and _health variables to the default constants defined at the top of the class.  I also set _hunger, _thirst and _boredom to 0.  I could have created another set of constants (DEFAULT_HUNGER:uint = 0) but I believe that they will all start at 0 for now, so creating a specific constant just for that seems a bit redundant.

public function Tom()
{
	// constructor function
	trace("Hi, I'm Tom!");

	// set defaults
	_weight = DEFAULT_WEIGHT;
	_age = DEFAULT_AGE;
	_mood = DEFAULT_MOOD;
	_health = DEFAULT_HEALTH;

	// set hunger, thirst and boredom to 0
	_hunger = _thirst = _boredom = 0;
}

Finally, I created 2 getter functions, called health() and mood().  Notice that the health() getter function simply returns the _health variable, and likewise, the mood() function returns _mood.  The reason for creating these functions, are to allow other classes (like TomAS3Gotchi.as) to access information about the Tom.as class.   Without creating public functions like health() and mood(), there would be no way to get the status of Tom's health or mood, since those variables are set to private.

public function get health():String { return _health; }
public function get mood():String     { return _mood; }

The difference between a getter function, and a regular function is pretty simple.  A regular function is written as so:

public function myHealth():String { return "Healthy";  }

and is used like this:

trace(Tom.myHealth());

which will trace out "Healthy" when run.

A getter function is a little different.  To write one, you simple add the word "get" in front of the function:

public function get myHealth():String {return "Healthy";  }

and is used a bit differently too:

trace(Tom.myHealth);

which traces the same message, "Healthy" when run.  The biggest difference is that you can treat a getter function the same as a variable (notice there are no parenthesis after myHealth in this example).  When we get into setter functions later in this series, it will make more and more sense.

The next change is very simple - and that's just to check to see if our changes are working.  In the TomAS3Gotchi.as class, we will add 2 lines to the constructor function, TomAS3Gotchi().

TomAS3Gotchi.as

package
{
	import flash.display.Sprite;

	/**
	 * ...
	 * @author T@IDEAS
	 * Main class of the entire project.  This is the file that is actually compiled to SWF.
	 */
	[SWF(width="800", height="600", backgroundColor="#cccccc", frameRate="30")]
	public class TomAS3Gotchi extends Sprite
	{
		private var _tom:Tom;

		public function TomAS3Gotchi()
		{
			_tom = new Tom();
			trace(_tom.health);
			trace(_tom.mood);
		}
	}
}

Now, when the program is compiled, you get the same trace as before ("Hello, I'm Tom") along with 2 new messages: "Healthy" and "Happy."

Seeing those 2 messages means that not only are the default settings working correctly, but so are our getter functions.  In the next part to this series, I will create similar getter functions for the rest of the variables (hunger, thirst, boredom, etc.) and we will begin to create a very crude GUI for our game, so that there are buttons to click among other things.

All of these files are available to download:

Tom-as3-gotchi Flash Game Tutorial - zip, git, svn, or wonderfl.

Continue to Part 3

Game Concept

Before writing a single line of code, I want to have a solid concept to design my game around.  The Tamagotchi page on Wikipedia, which was surprisingly sparse on information, states the core functions.  I'll be using those as a reference, specifically the functions for:

• Feeding the Tom-as3-gotchi a piece of food or a snack.
• Playing games with the Tom-as3-gotchi.
• Cleaning up a Tom-as3-gotchi's waste.
• Checking Tom-as3-gotchi's age, discipline, hunger, happiness and other statistics.

I've omitted the ability to connect with friends for now, but may decide to introduce that later down the line.

At this point, it's tempting to just open up the Flash IDE (or my preference, FlashDevelop) and get started, but we're still not half way there.  As I see it, there are 3 main components to the entire game. First, the actual character, Tom (Tom-as3-gotchi), which has basic needs (needs to be fed, entertained and kept in shape). We also need a world for Tom to live in - for the scope of this game, his "World" is a room. Within that world exist many objects (food, computer, bed, toilet, etc.), each of which represent the third component, "Object." I'm a visual person (what game programmer isn't?) so after I know the general direction I want to go in, sketching it out on paper can help me focus.  After spending 15-20 minutes, I came up with this simple list of components and functions:

Again, this could all change in the near future, but at least the concept is beginning to take shape.  Since "Tom" is the main component to all of this, I will focus on him first.  Next step, we can almost get into some as3 coding!

Project Structure

Another important factor in game design and programming in general is your workflow.  I typically structure my projects by using folders and naming conventions.  For starters, I almost always start with 3 main folders: assets, deploy and src.

assets

This folder will contain "non-deliverables" meaning all reference materials like .psd (photoshop), .ai (illustrator), .pdf, .txt, .doc, uncompressed videos (.mov, .avi, etc.) and just about anything else that won't need to be uploaded when everything is done.  Any images or other assets that are embedded into your app at compile-time will also go in here (like .wav, .jpg, .png and .gif files).

deploy

The deploy folder will include all of your deliverables, or the files that are "delivered" to the end-user.  This usually includes .html, .css, .php, .swf, .mp3, .jpg, .png, .flv, .xml and any other assets that are loaded in dynamically at run-time.  This is also where you will set Flash (or FlashDevelop) to publish your SWF files into.

src

If you haven't figured it out already, src is short for source.  Not that it really needs to be shortened, but this is a naming convention that I've picked up over time.  The source folder is where you will store all of your source code.  This includes .fla, .as, .mxml and a few others.

Source Control

You may also notice a folder named ".git" on the left panel in the screenshot above, and if you are really paying attention to details, you will also see that all of the folders have little green checkmarks on them.  Without going to far into the rabbit-hole of source control, the tl;dr version is that source control lets you keep a complete history of all changes you make to code (and assets), along with ways to restore previous versions of the entire project, or of individual files.  I will not be covering how to set up source control in this series, as I would prefer to just focus on the game.  I have been using Subversion for source control for a few years, and recently started moving over to Git.  In fact, along with being my first tutorial series, this is also my first project using git.  For anyone that wants to follow along, I've posted Tom-as3-gotchi on github, and google code.  By using source control, it makes it very easy to make huge changes, without worrying about breaking things - and it makes working on a project with multiple people a little easier.

Getting to the Code!

Finally, we've developed an overall concept (well, at least we started to),  and we've setup our directory structure (albeit basic right now).  If this were less about programming, and more about game design, the next step would probably be to start sketching ideas out on paper, and even coming up with some mock-ups and rough graphics.  However, since this is about the programming, let's code!

The first step is to setup our main component of the game, Tom.  You may notice that I use uint instead of int or Number for numeric variables.  This is another preference thing, and also a bit of optimization.  A Number type can go into the decimals, which isn't necessary for our game, and the main difference between a regular integer (int) and an unsigned-integer (uint) is that a regular integer can be negative (-1000) but a uint must be 0 or higher.  Again, this makes sense because our age, weight, or other values will never be less than 0.

Tom.as

package
{

	/**
	 * ...
	 * @author Thomas Gorence
	 * Base class for the main component of the Tom-as3-gotchi game.
	 */
	public class Tom
	{
		// Weight and Age are integers
		private var _weight:uint;
		private var _age:uint;

		// hunger, thirst and boredom will be rated from 0-10
		private var _hunger:uint;
		private var _thirst:uint;
		private var _boredom:uint;

		// health and mood will be represented by strings
		private var _health:String;
		private var _mood:String;

		public function Tom()
		{
			// constructor function
			trace("Hi, I'm Tom!");
		}

	}

}

Notice that our class, Tom, does not extend Movieclip or Sprite, or anything else - meaning that Tom is an abstract class.  I've also created a few private variables to store information about Tom.  They all begin with an underscore, which I use to denote a private variable versus a public variable.  It's another personal preference thing, and also allows me to create getter/setter methods easily, which I will get into later.  The class is named "Tom," and you will notice a public function in the class with the same name ("public function Tom").  This is known as the constructor function, which runs when the class is instantiated.  To put that into English, the constructor function is run once, automatically, whenever a new "Tom" is added.  In this case, when a new Tom object is added to the project, it will trace out "Hi, I'm, Tom!"

Before wrapping up, take a look at the other file in this project.

TomAS3Gotchi.as

package
{
	import flash.display.Sprite;

	/**
	 * ...
	 * @author T@IDEAS
	 * Main class of the entire project.  This is the file that is actually compiled to SWF.
	 */
	[SWF(width="800", height="600", backgroundColor="#cccccc", frameRate="30")]
	public class TomAS3Gotchi extends Sprite
	{
		private var _tom:Tom;

		public function TomAS3Gotchi()
		{
			_tom = new Tom();
		}

	}

}

So this is the actual file that we will use to compile.  If you don't have Flash IDE or FlashDevelop installed (and have no other way of using flash), this Tom-as3-Gotchi Flash Game Programming Tutorial is also hosted on wonderfl, so you can program and view it for free.  I'm using FlashDevelop (it's free, windows only) but you can also use the Flash IDE by creating a new FLA file, and then in the stage properties, set the Document Class to "TomAS3Gotchi" and save that FLA file into the same folder as TomAS3Gotchi.as (the src folder).

Note: if you are using Flash IDE, you will have to go into Publish Settings and set the SWF output to "../deploy/TomAS3Gotchi.swf" and uncheck HTML output.  If you want to set height, width, framerate and background color, those also must be done in the stage properties, as Flash IDE will ignore line #10 altogether.

If you compile/publish the project in either FlashDevelop or the Flash IDE, you should see the message trace out, indicating that our Tom class was successfully created (or instantiated) and the constructor function was run.

Flash IDE:

FlashDevelop:

Well, that's good for now.  Again, all of these files are available to download:

Tom-as3-gotchi Flash Game Tutorial - zip, git, svn, or wonderfl.

Continue to Part 2

My goal is to write something new everyday, although realistically I'll manage about 3-4 posts per week.  Hopefully someone out there will get some use to these tutorials - but in line with one of my personal mantras (experience - expectation = happiness), I'll be writing for my own personal benefit at first... and if others can learn from this as well, all the better.

That being said, you can see the tutorials section here.

At work (IDEAS in Orlando, FL) I've been introducing my coworkers/friends to AS3, and recently figured out that the best way to teach, is through practical example.  I guess I should have just started with the obvious!  After reviewing a few other websites that teach Flash Programming, I've been inspired by the good and the bad.  Lee Brimelow's gotoAndLearn was inspiring in that I've personally watched it start from a simple tutorial site, into the Flash Blog of an Adobe Platform Evangelist.  I was also inspired by some very popular, but not-so-impressive sites, which got me thinking, "if they are teaching flash successfully to thousands, with ugly code..."

I also believe game programming is a good way of learning - since it often involves lots of different moving parts.  I'll leave my philosophy on game design to another post, but the tl;dr version is that before programming a game, the concept and gameplay should be fleshed out in detail, without any regards to technology.  Meaning, the concept of the game should be fun and exciting even if it were text-based, or a board-game, or a first-person shooter, and so on.  Of course, not all games are created this way, but it's how I like to approach them, as opposed to finding some game-engine and just working on the gameplay and fun as you code.

So... while you may not have learned anything yet, I promise to give it my best shot!  If you ever have any comments, questions or suggestions for new topics, please comment!  And of course, check out the tutorial section!

Developing

Without getting into definitions of what "open" means, I can speak from personal experience.  Developing for Flash wasn't always a treat.  The IDE was hard to work with, and would frequently leave me with corrupt files and crashes.  Slowly I learned to work in external files using tools like SEPY to save time from crashing.  There were also lots of hacks and workarounds that became common practice.  There were a few open source solutions for flash, but most of it was intermediate to advanced.  Then, I discovered FlashDevelop, which completely eliminated the barrier for programming.  I was able to download the free Flex SDK and compile to the latest versions of Flash and AIR, all without using free software.  That may not be a textbook definition of "open," but it's sure as hell more open than developing for iPhone and iPad.

Programming for the iPhone was actually a lot of fun, and as I mentioned before there's something inspiring about it. Creating software for the latest must-have-gadget is thrilling, and hearing about all the success stories from simple (and not so simple) apps gave me lots of motivation.  Learning Objective-C was rewarding, and I didn't have many problems setting up or using XCode or Interface Builder.  The problem I had was with testing and "provisioning."  I will be associating negative emotions to that particular word for quite some time after experiences with the App Store.

Most non-programmers aren't really aware of the development perspective for Apple either.  It's been tense, as they seem to approve or reject apps on a whim, and selectively allow content based on ambiguous statements which seem to revolve around some kind of moral highground.  None of that really sits well with me, and I assume many other developers.  Finally, it's been said over and over, but end-users don't really care what was used to developed their products.  End users don't care about GoLive, FrontPage, Dreamweaver, Coda or Notepad.  They don't care if you use mootools, jquery or dojo.  They certainly don't care if you used XCode, Flash CS5 or Mono.  The only ones that really care what you used, are the creators of each respective development tool.

Mobile Apps

Before getting into any particular side of this debate, I have to say it's a bit foolish making any sort of judgment calls this early in the game. Flash hasn't even scratched the surface of mobile apps, yet some people are already declaring the victors. I can absolutely agree that Apple led the way in rolling out this whole mobile app marketplace business model, and making it tangible - but having a head-start doesn't guarantee lifelong success (although I will be so daring as to suggest Apple may be doing this for a while).

As of right now, Apple is pretty much dominating the mobile apps world compared to Blackberry, Android and other smartphones.  However, the entire process has been bittersweet for developers.  Small shops and independent programmers have been able to turn hobby projects into rags-to-riches stories because of iPhone and iPad development, and that has really been a huge inspiration for even more innovation.  However, that same inspiration has also been stifled along the way.    I haven't made anything for Android yet, and I haven't attempted to port anything in Flash to a mobile device.  I've created a few native iPhone apps, a Blackberry app, and I have developed quite a few mobile websites.

I can't wait to see what sort of impact Flash will have on the mobile marketplace, but until then I'll bite my tongue on that whole issue, which in my opinion is at the heart of this entire episode.

Touchscreens

One element of Steve's post that struck me as particularly humorous was regarding rollover states, and indicating that Flash was outdated because it was designed for using a mouse and keyboard.  The reason I find this humorous is due to the fact I've been working on various touchscreen applications over the past few years using Flash, Flex and AIR.  In fact, while Steve was writing that blog post, I was making some final touches to a touchscreen kiosk application made entirely in Flash CS3.

In fact, when the Microsoft Surface was announced, there were already working multi-touch libraries for Flash being shared around on the internet along with DIY instructions on making multi-touch interfaces.  None of this was exclusive to Flash, as most (if not all)  was ported from other languages - but the point is, Flash has constantly been able to adapt and evolve to however developers see fit.  I'm not even sure Adobe deserves all of the credit for the innovation that's been made by the community, but they sure as hell have embraced it.

Video

The point was made that before Flash, when you wanted to watch a video online you had to choose between Real Player, Quicktime and Windows Media.  It was standard to offer video in multiple formats, because nobody was ready to take sides or make up their mind.  At least not as ready as Apple and Microsoft seem to be today about H.264.  As of 2007, Flash has supported H.264.  If HTML5 is going to support it, more the merrier.  The way I see it - if you have an H.264 video file, it's ready to play in almost any modern browser or media device.  However, if you decide to house that video in a custom Flash player, all of a sudden it cannot be played on an iPhone/iPad.  This has nothing to do with Flash being locked-down or closed.  The video is there, it's just that Apple is refusing to acknowledge it, because of the wrapper it's in.

I don't have any problems with HTML5 taking over in online video, in fact I embrace it.  I don't have anything against HTML, or CSS, or XML, or JavaScript, or SQL, or any other scripting language.  I'm a bit confused why H.264 support in HTML5 is supposed to kill Flash.  It's still up to the browsers to implement the actual support, is it not?

Gaming

While Apple has been innovating mobile devices, slick hardware and outstanding UI design, they still haven't cornered much of the gaming market outside of mobile apps.  Despite Jobs' reference to having more entertainment apps than any other platform, the amount of Flash games already on the internet dwarfs the selection in the App Store.  If quality is supposed to be a metric, I would also venture to say that the quality of games available (in terms of immersion and playability along with optimization) from Flash developers is not an issue.  Apple has most definitely wet their appetite, and are probably loving the huge gaming market that they have tapped into.  Along with mobile-apps, only time will tell.

/rant

I'd love to program a game or app in a single format, and be able to deploy to anything.  And that's sort of the point of this whole HTML5 / web standards argument.  The problem is, anyone who has been programming to "web standards" for the last decade (or more) knows how laughable it is.  Yes, Firefox, Chrome, Safari, Opera and IE9 will all (supposedly) support HTML5.  The cynic (or perhaps the realist) in me has to wonder if this is the same type of web-standard compliance that bestows upon us little gems like margin, padding and float issues?  Of course it's possible to create a website that looks identical in all browsers, down to the pixel.  It may even be possible to do it without any hacks or browser-specific code.  It's just a very tedious and at times frustrating process.

It seemed like Flash was attempting to take over HTML, or JavaScript, or desktop programming, or anything.  It was made originally as an animation solution, but due to the community has evolved to being a creative tool, to fill in gaps for all sorts of different functions.  Flash has also been one of the few development tools where I can truly write once and publish for multiple platforms and mediums.  It's got an incredibly talented and passionate development community... and while nothing is really too big to fail, it just seems that Flash has come all this way, it's a bit naive to think they would ever die without putting up a huge fight.

I will make a few updates to this post over the weekend, sprinkling in some extra quotes, links and references.

This video documents the entire process, and captures the excitement and passion of game programming. As I dive more and more into programming games in flash, iphone and more, it's become obvious that programming the actual game is the "easy" part. The real magic is making the game playable - but more importantly, fun.

http://ca.kotaku.com/5517715/watch-civilizations-creator-build-a-game-in-48-hours

Anyways, long story short, I ditched all the “bridges” and just made a non-intrusive package (well, started to make it at least) that feeds data into flash using a series of php functions, that connect directly to the smf database.

I’ve put together a practical example of using this class here:

HipHopProduction.com Beat Meet Player

It will load a given topic (in this case, each drop-down item is associated with a topic that has lots of replies with attachments), search that topic for mp3 attachments, and add them to the list. Then by clicking on any of the names in the list, that user’s mp3 will begin to stream.

The functions that I’ve got working so far are getNews, getMembers, getMemberGroups, getPollEntries, getPoll, getBoards, getBoardCategories, getBoardModerators, getMemberInfo, validateMember, and getTopicAttachments.

Read on for the source code and a functional example.

amfphp service file:

// +----------------------------------------------------------------------+
// | Filname: smf2amfphp.php                                           |
// +----------------------------------------------------------------------+
// | Copyright (c) http://www.producerism.com                              |
// +----------------------------------------------------------------------+
class smf2amfphp
{
    function smf2amfphp()
    {
        $conn = mysql_pconnect("localhost","username","password");
        mysql_select_db("smf_database");
    }

    /** getPoll
    * This method returns poll information
    * @param      pollID
    */
    function getPoll($pollID)
    {
        $query = "SELECT * FROM smf_polls WHERE ID_POLL = $pollID";
        $result = mysql_query($query);

        if(!mysql_num_rows($result)){
            return "Poll ID: ".$pollID." not found!";
        }else{
            $record = mysql_fetch_array($result);
            return $record;
        }

    } // end func

    /** getPollEntries
    * This method returns poll entries
    * @param      pollID
    */
    function getPollEntries($pollID)
    {
        $query = "SELECT * FROM smf_poll_choices WHERE ID_POLL = $pollID";
        $result = mysql_query($query);

        if(!mysql_num_rows($result)) {
        return "Poll ID: ".$pollID." not found!";
        }else{
        $tmp = array();
        while($record = mysql_fetch_array($result)){
        array_push($tmp,$record);
        }
        return $tmp;
        }
    } // end func

    /** getTopicAttachments
    * This method returns attachment filenames within a topic
    * @param      topicID
    */
    function getTopicAttachments($topicID)
    {
        $query = "SELECT att.filename, msg.posterName FROM smf_messages msg, smf_attachments att WHERE msg.ID_MSG = att.ID_MSG AND (msg.ID_BOARD = 8 OR msg.ID_BOARD = 11) AND msg.ID_TOPIC = $topicID";
        $result = mysql_query($query);

        if(!mysql_num_rows($result)) {
            return false;
        }else{
            $tmp = array();
            while($record = mysql_fetch_array($result)){
                array_push($tmp,$record);
            }
            return $tmp;
        }
    } // end func

    /** getMemberInfo
    * This method returns member information
    * @param      memberID
    */
    function getMemberInfo($memberID)
    {
        $query = "SELECT * FROM smf_members WHERE ID_MEMBER = $memberID";
        $result = mysql_query($query);

        if(!mysql_num_rows($result)) {
            return "Member ID: ".$memberID." not found!";
        }else{
            $record = mysql_fetch_array($result);
            return $record;
        }
    } // end func

    /** getMemberInfo
    * This method returns poll information
    * @param      memberName    - smf member name
    * @param      passwd      - smf password (this should be a HASH value, unless sha1 is true)
    * @param      sha1         - set to true if passing the actual password (NOT RECOMMENENDED!)
    */
    function validateMember($memberName, $passwd, $sha1=false)
    {
        if($sha1) $passwd = sha1($memberName.$passwd);

        $query = "SELECT * FROM smf_members WHERE memberName = '$memberName' AND passwd = '$passwd'";
        $result = mysql_query($query);

        if(!mysql_num_rows($result)) {
            return false;
        }else{
            $record = mysql_fetch_array($result);
            return $record;
        }
    } // end func
} // end class

flash as3 function that connects to amfphp, and calls one of the functions listed above:

function onLoginClick(evt)
{
    var memberName, passwd;

    memberName = StringUtil.replace(login_txt.text, "\r", "");
    passwd = SHA1.hash(StringUtil.replace(login_txt.text + password_txt.text, "\r", ""));

    _amfphpConnection = new amfphp(GATEWAY_URL, "smf2amfphp.validateMember", new Array(memberName, passwd), { onResponse:onLogin } );
}

as you can see by the SHA1.hash function, I am using the corelib encryption functions by Adobe in my flash file, so the password never leaves the client.

in keeping with everything else smf, i decided to simplify the class API i’m working on. For example, this is now the code for validating a login: (assuming there are 3 objects: login_txt, password_txt and the login button being clicked that triggers onLoginClick)

function onLoginClick(evt)
{
    smf2amfphp.validateMember(login_txt.text, login_txt.text+password_txt.text, onLogin);
}

function onLogin(evt)
{
    if (evt)
    {
        // login successful!
    }
}