r3dux.org

My second attempt at recreating the PS3 XMB “wave” thingy in Flash – I’m thinking it’s not too shabby for purely using blurred 2D lines for the waves. I’m sure it could be fine-tuned to match up with the real XMB better, but for what I wanted this is fine.

And all using zero 3D, and zero splines/beziers.

Not bad for 7KB of Flash!

I had to cover a class on Flash today, and I haven’t touched it in over a year, so I got up bright and early to make sure I wasn’t too rusty…. and yeah… I was. Really rusty.

I was thinking in C++ and Python and Java, not thinking in AS3 and everything was wrong – so I decided to write a PS3 XMB (Cross Media Bar) “Wave-Thing” as practice. In fact, it doesn’t even do the waves – just the sparkles. Still, was a good exercise to get my head back in the game.

There’s nothing to stop me implementing the waves as fixed DisplayObjects moving in parallax (easy, weak), or via blurred splines (preferred, harder) – but at least I got the sparkles, um, sparkling…

I think I will do the waves, I need some spline practice…

Update: Modified so spark is allocated to MC with one of four levels of blur, increased spark density, spark has 50% chance of pulsing again without being re-initialised, spark has 1% chance of being big on initialisation.

Credits: PS3 wave background from: http://blog.guifx.com/2009/04/24/playstation-3-wallpapers/

Update: Update/fix at bottom of post…

Flash on Linux has always been a mess, especially on 64-bit, so when I upgraded my flash plugin the other day to the latest 11.2 beta I wasn’t in the least bit surprised when it broke. This time, watching videos with people in them had the people looking like they were from Avatar – all the skin was blue, and in general the colours were well off. For example:

Flash being, well, Flash...

To fix this up, you need to twiddle with the flash settings at /etc/adobe/mms.cfg, or if you wanted to, do the twiddling through the Flash-Aid plugin like below (in my final working config I actually use the top option of GPU validation as enabled and disable VDPAU):

Flash Plugin Acceleration Options

Once that’s done, restart your browser and hey-presto – correct colours in Youtube:

Flash Colours Restored

You may have to turn on or off some combination for it to work with your particular machine in a trial & error style, because what might work in YouTube might crash when using other flash video sites (vimeo, gametrailers etc). After some playing around, I’ve decided to live with the bad youtube colours and use the following settings in the /etc/adobe/mms.cfg config file:

$ cat /etc/adobe/mms.cfg 
OverrideGPUValidation=1
EnableLinuxHWVideoDecode=0

And as I’m a curious lad, I thought I’d make a table of what works and what doesn’t (on my setup – LMDE w/ NVidia 290 drivers):

Looks like there’s no clear winner that works for everything… Oh wells, there’s a good write-up with alternate solutions and things over on WebUpd8 here – even though they talk about flash 10.2 on Ubuntu, this is the first time I’ve had this issue and it’s on LMDE (Debian based) with the flash 11.2 beta and the same fixes work here. I guess if you’re that bothered, you could always downgrade to some previous flashplugin (like something from the 10.x series) and see how that holds out.

But on the upside, it’s kinda funny watching things in Avatar mode =P

Update: You can fix the bad colours in Flash 11.2.202.221 by setting the following options in /etc/adobe/mms.cfg:

OverrideGPUValidation=0
EnableLinuxHWVideoDecode=1

With NVidia 295.20 drivers (although I’m not sure if that’s part of the problem) Flash video plays fine without any colour issues. Hurrah! =D

In the final week of the ActionScript intro we get into using sounds with ActionScript, and play audio which is external to our flash file(s), embedded within our flash files as well as covering topics like offsetting and repeating. We also create our own custom pause function (because weirdly, the functionality isn’t natively available).

This wraps up all the ActionScript stuff I taught over a brief course about a year ago, and I’ve got to say, I didn’t mind ActionScript 3 as a language at all. You can do a lot of nice bits and pieces with it which can be embedded directly on the web, or you can use it for some quick prototyping (although if you were prototyping some serious effects, you’d probably be more likely to do so in the processing language), so yeah. Glad I spent a month or so getting my head around it.

Download link: An Introduction to ActionScript 3.0 – Week 9
Audience: Beginners who know a little about variables, functions, objects and how to perform some basic programming math.
Format: PDF
Content License: The document, its contents and the provided source code are released under a creative commons non-commercial attribution share-alike 3.0 license by me (r3dux) and comes with no guarantee of correctness, fitness for purpose or anything of the sort. The audio samples used are the property of their respective owners and are used under a fair-use type of deal.

If you’ve followed the series of posts over time, or just stumbled across one week’s worth of notes and found it useful, then I’m happy I went to the effort – and if you’ve learnt something from them then even better

Cheers!

When it comes to programming, the devil is always in the details. In this case, I just wanted to add a MovieClip to the stage in a flash file, and then access that MovieClip’s instance properties to control some other instance stuff from within a class. Sounds simple, right? But could I do it? Could I ****. If you’re reading this, then there’s a good chance you’re in the same boat. Luckily for us both, it’s not too difficult to do at all. Here’s some simple proof of concept code to help you along:

Note: This first example uses a class called Ball. If you want to see it in action either download my pre-made code (Adobe Flash CS4 format), or just draw a circle or something, select it, convert to symbol (shortcut key: F8), tick the “Export for ActionScript…” checkbox and give it a class name of “Ball” (capital B) then use the following code to access instance properties of a given Ball object from within the class itself.

Main Flash File (.fla) Code

import Ball;
 
var myBall:Ball = new Ball(stage);
myBall.name = "myBall"; // If you don't set a name, you can't call getChildByName("THE-NAME")
myBall.x = 100;
myBall.y = 100;
stage.addChild(myBall);
 
var ball2:Ball = new Ball(stage);
ball2.name = "ball2";
ball2.x = 150;
ball2.y = 150;
stage.addChild(ball2);

Ball.as ActionScript File Code

package
{
	import flash.display.MovieClip;
	import flash.events.Event;
	import flash.display.Stage;         // Needed to use stages
	import flash.display.DisplayObject; // Needed for getChildxxx functions, which return a DisplayObject
 
	public class Ball extends MovieClip
	{
		// Per object instance variables
		// private var someVar:SomeType;
 
		// Static (shared) instance of what stage the balls are on (i.e. a reference to the main stage)
		private static var ballStage:Stage;
 
		// Constructor
		function Ball(theStage:Stage):void
		{
			// Set the stage the particles are on so we can use it to get details.
			ballStage = theStage;
 
			// Bind each particle to update once per frame
			this.addEventListener(Event.ENTER_FRAME, updateBall);
		}
 
		private function updateBall(e:Event):void
		{
			trace(ballStage.getChildAt(0)); // MainTimeline
 
			var tmp:DisplayObject = ballStage.getChildAt(1); // myBall
			trace("By getChildAt, x is: " + tmp.x);
 
			tmp = ballStage.getChildByName("ball2"); // ball2 - requires the built-in ".name" property to be set!
			trace("By getChildByName(blah): " + tmp.x);			
 
			// Move the balls around a little on the stage, just so we can see the properties change
			if (this.x >= 200)
			{
				this.x = 1;
			}
			else
			{
				this.x += 1;
			}
		}
 
	} // End of class
 
} // End of package

The trick is that we keep a reference to (or really a copy of) the main flash file’s stage handy by passing it into the constructor, so we can refer to it and get at any instances of anything on that stage to work with. Also, if we’re getting an instance by name, then we have to set the .name property! I thought you could just get it by the instance name itself (as in, the variables own name, not it’s .name property), but apparently not.

You might wonder why go to all this effort when we could just call this.x instead of ballStage.getChildByName(“SOME_NAMED_DISPLAYOBJECT”) or such in the above code, but the reason is that by jumping through these extra hoops we can access the properties of instances of other classes inside any other class. For example, if I had a Football class and a Player class, I could access the properties of a Football instance on the stage from within the Player class, or vice-versa.

To show a more concrete example, try using the cursor keys to move the attractor (just an instance of a MovieClip on the stage) around the below – the particles interact with the location of the attractor MovieClip, because I grab a copy of it by name (which is slower than by index from what I read, but this is just an example) and then move each particle instance from that information in the Particle class:

Full source for the above keyboard attraction example can be found: here.

Cheers!