Debugging with Flash Player 9,0,28,0

All the kids are debugging with Flash Debug Player these days, (haven't you heard?)

For those of you that don't know, the Debug version of the player sends trace commands to a text file which you can watch with a variety of tools, but we'll get into that later.

To get the Debug Player visit http://www.adobe.com/support/flashplayer/downloads.html and get the latest Netscape (Firefox) and ActiveX debug players.

With the latest upgrade of Flash Debug Player (9,0,28,0) there's been a few changes to accomodate the wonderful(?) Microsoft Vista, Which imposes certain security restrictions. Please note: this post only relates to Windows.

Adobe have provided documentation for the debug player, and for most people it'll work just fine, however, if you're in a corporate environment no doubt you have a roaming profile and this is where the fun begins.

Previously the environment variables %HOMEDRIVE% and %HOMEPATH% were used by the debug player to find it's settings file mm.cfg. It appears that this is no longer the case (the Adobe livedocs page doesn't tell you this.)

It seems that %USERPROFILE% is now used to determine the location of mm.cfg which will allow you to set the config of Flash Debug Player.

The rest of the information in this LiveDocs page is fine. I'll save you the trip over and give you the rest of the infor. The new fixed location of the Player log file is: %USERPROFILE%\Application Data\Macromedia\Flash Player\Logs\flashlog.txt and within the mm.cfg the settings now available are...

As far as setting up your mm.cfg file goes, it's a simple text file.

Using notepad enter the following lines

ErrorReportingEnable=0
TraceOutputFileEnable=1

Then save as the file to %USERPROFILE%/mm.cfg

If everything is working ok you will be able to read trace messages from Flash in the file %USERPROFILE%\Application Data\Macromedia\Flash Player\Logs\flashlog.txt

Log viewers...

There are a number of tools out there to view log files, and there are some which specifically target the Flash Debug Player, however due to the latest changes, many of these no longer work properly...

FlashTracer by Alessandro Crugnola (of SEPY fame) is a FireFox extension which will follow flashlog.txt output. You can get it here

A nice alternative is Log Viewer from BrineSoft a bog standard windows based file watcher.

Of course for the truly hardcore there's the unix tail command, available to windows users via the Cygwin project. If you want to play with that one, it's for command line veterans only.

Hopefully now you can stop mucking about with these XMLSocket or LocalConnection solutions, (or heaven forbid TextField.. I ask you!)

11 comments February 1st, 2007

Badgr 2.0 beta

PLEASE NOTE: Visit the badgr project page for more info.

Here's a quick heads up for the new badgr release

I'm not posting much in the way of instructions, since I'm not going to support this until I've got the form made, but as you can see the form is a little complex, so if you're desperate to get it while it's hot you can grab the badgr2.swf now...

Right click and save badgr2.swf

There are now a lot more parameters you can throw at bagdr 2.0 so let's have a little look at them, if you know how to build a URL query string then you're ok, if you haven't the foggiest idea what I'm talking about, sorry, you'll have to wait for the nice easy install form...

Badgr 2.0 parameters

These are entered into the embed / SWFobject code after badgr2.swf? and separate each one with an &character.

• badgrmode= one of the following numbers (default is badgrmode=1)
  1. user
  2. user set
  3. user favourites
  4. user tag search
  5. group
  6. all tag search
• userid= which is either the userid, groupid or setid depending on the badgrmode you want.
• tags= followed by the tags you want to search for (comma separated.) If you're searching for multi word tags such as "Blue Skies" (or whatever) write them in your list as blueskies as Flickr treats them as the same tag. Tags are ignored unless you are using badgrmode= 4 or 6.
• limit= The maximum number of photos to return from your set, default is rows x columns.
• waittime= time in seconds to wait between displaying a zoomed in photo square.
• displaytime= time in seconds to wait when a photo square is zoomed up.
• rows= Number of rows of small photo squares (I recommend you have 2 or more) The display height of the swf will be 38 * rows. (default = 5)
• columns= Number of columns of small photo squares (I recommend you have 2 or more) The display width of the swf will be 38 * columns. (default = 5)
• framescaling= This is a string of 4 numbers separated by commas, the default is 1.05,1.0,1.08,1.04 ... They are the scaling factors of the frame, here's a quick description of what they do in order.. (a, b, c, d)
  • The total canvas size / a
  • (The total canvas size / a) / b
  • 75px square * c
  • c / d
  These settings create the default frame for badgr.
• framecolors= Similar to the scaling factors but much simpler this is a set of 5 hex colors separated by commas which are the frames colors... default... #FFFFFF,#000000,#000000,#AAAAAA,#000000
• framealphas= The corresponding alpha / transparency values for each of the 5 frame colors. the 5 values are in the following order
  • Main canvas frame (stretches to the limits of the badgr 2.0 canvas)
  • Frame outline
  • Main frame
  • Photo outer border
  • Photo inner border
• rolling= Indicates whether all the images in the returned photo selection be displayed or just the random 25 picked at the start. Set to yes or no (default is no.)

Examples

badgr2.swf?badgrmode=1&userid=75556562@N00&limit=all&timing=8&rows=15&columns=4&framealphas=0,0,0,100,100&rolling=1&framescaling=1.05,1.0,1.5,1.04&framecolors=#FFFFFF,#FFFFFF,#FFFFFF,#000000,#FFFFFF

The swf dimensions are 152 wide x 570 high (4*38 x 15*38)

These settings show all of my photos in a 4x15 grid in rolling mode, using a customised picture frame and 8 seconds wait timing.

badgr2.swf?badgrmode=2&userid=72057594117941491&limit=all&rolling=1

Standard 5x5 grid (190x190px)

Show all the photo's from set http://www.flickr.com/photos/bpx/sets/72057594117941491 - Russian and/or Soviet propaganda & advert posters [1917-1991] in rolling mode.

badgr2.swf?badgrmode=3&userid=75556562@N00&limit=all&rolling=1

Standard 5x5 grid (190x190px)

Show my favourite photos in rolling mode.

badgr2.swf?badgrmode=4&userid=75556562@N00&limit=all&rolling=1&tags=sky&folliage

Standard 5x5 grid (190x190px)

Show my photos tagged with sky or folliage in rolling mode.

badgr2.swf?badgrmode=5&userid=35468136003@N01&limit=all&rolling=1

Standard 5x5 grid (190x190px)

Show all photos from the Holgagraphy flickr group in rolling mode.

badgr2.swf?badgrmode=6&limit=200&rolling=1&tags=brick

Standard 5x5 grid (190x190px)

Show all photos tagged with brick in rolling mode.

11 comments August 2nd, 2006

AS2.0 - XMLSerialiserAlpha

This is a first draft solution to creating XML document from an Object structure (when E4X isn't available < flash9 / AS3) a friend of mine was asking if this was possible within Flash as a standard class, since it's not I thought about it and I decided it'd be quite easy to build, so I wrote this class based on Darron Schall's TraceObject function.

The class provides static methods to recurse an Object tree and create a corresponding XML document.

This is a rough first draft, proof of concept, which I'll try and improve over the next few days, there are a few things that I think it'll need, creating node attributes or CDATA sections from an Object, the thing is, these will require an Object to be structured in a particular fashion ... Something it'd like to avoid, but in some cases this functionality would be extremely useful.

Any suggestions for object formatting to provide CDATA / attribute notation would be well recieved.

Anyway here you go, an XML serialiser for Flash, it should work with all versions of Flash v6 up. (I've only tested it with Flash Player 8 & 9.)

/**
 * A static helper class to create an XML document from an Object 
 * structure.
 *
 * @usage var myXMLDoc : XML = XMLSerialiserAlpha.seralise(myObject);
 * Where myObject contains an object structure 
 * eg. http://en.wikipedia.org/wiki/JSON#JSON_example
 *
 * @author jason at mentalaxis dot com
 */
class XMLSerialiserAlpha{
	
	private function XMLSerialiserAlpha(){}
	
	private static var mInit : Boolean = false;
	private static var mTabs : String = "";
	private static var docString : String;
	private static var xmlDom : XML; 
	
	private static function _out (strValue : String) : Void {
		docString += strValue + "n";
	}
	
	private static function docStringToXML() : XML {
		xmlDom = new XML(docString); 
		return xmlDom;
	}

	/**
	 * Recursively trace an object structure and send 
	 * string fragments to the _out method, the user 
	 * call returns an XML object.
	 * 
	 * @param obj Object
	 * @param inOpenChar String
	 * @param initialBlockDisplayed Boolean
	 * 
	 * @return the xml object to the external call
	 */
	public static function seralise(obj : Object, initialBlockDisplayed : Boolean, nodeName : String ) : XML {
		mInit = (initialBlockDisplayed) ? false : true;
		var topLeaf : Boolean;
		if (mInit) {
			docString = "";
			mInit = false;
			topLeaf = true;
		} else {
			topLeaf = false;
			mTabs += "t";
		}

		for (var i : String in obj) {
			
			if (typeof (obj [i]) == "string") {
				_out (mTabs + "<"+i+">" + obj [i] + "</"+i+">");
			} else if (typeof (obj [i]) == "object") {
				if (obj [i] instanceof Array) {
					
					seralise(obj [i], true, i);
					
				} else {
					if(nodeName != undefined) {
						_out (mTabs + "<"+nodeName+">");	
					} else {
						 _out (mTabs + "<"+i+">"); 
					}
					
					seralise(obj [i] , true);
					
					if(nodeName != undefined) {
						_out (mTabs + "</"+nodeName+">");	
					} else {
						_out (mTabs + "</"+i+">");
					}
				}
			} else {
				_out (mTabs + "<" + i + ">" + obj [i] + "</" + i + ">");
				mInit = true;
			}
		}
		mTabs = mTabs.substr (0, mTabs.length - 1);
		if(topLeaf)
		{
			return docStringToXML();
		} else {
			return null;
		}
	}
}

Of course if you find any bugs or have suggestions for improvement, I'm interested to hear about them.

Add comment July 6th, 2006

AS2.0 Event based Timer class.

This Timeout class provides a timer which will dispatch an “onComplete” event message, when the timer is complete.

import mx.utils.Delegate;
import mx.events.EventDispatcher;

class Timeout {
	
	private var timerInterval : Number;
	private var duration : Number;
	private var destroyed : Boolean = false;
	private var running : Boolean = false;

	public function addEventListener(type : String, handler : Function) : Void {}
	public function removeEventListener(type : String, handler : Function) : Void {}
	private function dispatchEvent(e : Object) : Void {}

	/**
	 * Timeout provides a timer which will dispatch an onComplete message.
	 * 
	 * @usage
	 * function myTimeoutHandler() {
	 *   trace("Timer complete");
	 *   // do something after timeout?
	 * }
	 * var duration : Number = 1; // duration as Seconds
	 * var myTimeout : Timeout = new Timeout(duration);
	 * myTimeout.addEventListener("onComplete", myTimeoutHandler);
	 * myTimeout.go();
	 */
	public function Timeout(duration : Number) {
		EventDispatcher.initialize(this);
		if(duration != undefined) {
			this.duration = Math.abs(duration)*1000;
		}
	}
		
	public function go() : Void {
		if(!running) {
			running = true;
			setTimeout();
		} else {
			restart();
		}
	}
	
	private function setTimeout () : Void {
		timerInterval = setInterval (Delegate.create(this, timeoutComplete), duration);
	}

	public function restart (newDuration : Number) : Void {
		if(newDuration != undefined) {
			duration = newDuration;
		}
		dispose();
		go();
	}

	public function dispose () : Void {
		clearInterval(timerInterval);
		running = false;
	}

	public var crush : Function = dispose;
	public var kill : Function = dispose;
	public var destroy : Function = dispose;

	public function toString() : String {
		return "[Object Timer : "+ timerInterval + " ]";
	}

	[Event("onComplete")]
	private function timeoutComplete ():Void {
		clearInterval(timerInterval);
		dispatchEvent({type:"onComplete", target:this});
	}
}

Usage

function myTimeoutHandler() {
  trace("Timer complete");
  // do something after timeout?
}
var duration : Number = 1; // duration as Seconds
var myTimeout : Timeout = new Timeout(duration);
myTimeout.addEventListener("onComplete", myTimeoutHandler);
myTimeout.go();

If you’d like to stop the Timer before it’s completed…
myTimeout.dispose();. Or you can use myTimeout.crush();, myTimeout.kill();, myTimeout.destroy(); depending on your mood.

You can restart the timer myTimeout.restart(); and change the timer duration myTimeout.restart(2);

7 comments April 20th, 2006

Hypotrochoid (aka SpiroGraph(tm))

If like me you enjoyed playing with SpiroGraphâ„¢ as a kid you'll like the Hypotrochoid. Play around with different r1, r2, d values and loop through theta (radians)

/**
* Hypotrochoid is the formal name of the "curves" drawn by Spirograph(tm).
* The function will draw the point of the interaction of two circles r1, r2, 
* offset at d (diameter) derived from theta (angle in radians). Iterate theta to
* produce the figure.
*
* @param r1 radius of circle 1
* @param r2 radius of circle 2
* @param d offset diameter of r2, r2
* @param theta angle (radians) at which to plot the point.
*/

function hypotrochoid (r1:Number, r2:Number, d:Number, theta:Number):Object {
	var x:Number = ((r2-r1)*Math.cos(theta))+(d*Math.cos(((r2-r1)/r1)*theta));
	var y:Number = ((r2-r1)*Math.sin(theta))-(d*Math.sin(((r2-r1)/r1)*theta));
	var point:Object;
	point = {x:x, y:y};
	return point;
};

Here's a quick & dirty example to get you started (and so you can see something fun without having to work out what's going on)... Create a new flash document and paste the code onto frame 1, then run it...

The script will work with all versions of Flash player which support ActionScript 2.0. If for some reason you only have Flash 5 then you can still run it, just remove the strict typing syntax (":Number" & ":Object")

function hypotrochoid (r1:Number, r2:Number, d:Number, theta:Number):Object {
	var x:Number = ((r2-r1)*Math.cos(theta))+(d*Math.cos(((r2-r1)/r1)*theta));
	var y:Number = ((r2-r1)*Math.sin(theta))-(d*Math.sin(((r2-r1)/r1)*theta));
	var point:Object;
	point = {x:x, y:y};
	return point;
};
 
/*
* Set flash framerate to 30 for good results...
* 
* modify the values of r1, r2 & d 
* to experiment... 
* (r1 and r2 must be different to see anything happen!)
*/
var r1 = 15; // radius1
var r2 = 32; // radius2
var d = 71; // distance
//
var spiroGraph_mc = _root.createEmptyMovieClip("spiroGraph_mc", 100);
spiroGraph_mc._x = Stage.width /2;
spiroGraph_mc._y = Stage.height /2;
spiroGraph_mc.lineStyle(1, 0x990000, 100);
//
var i=0; // iterator (defines theta for our x,y point)
spiroGraph_mc.onEnterFrame = function() {
var pointObject:Object = hypotrochoid (r1, r2, d, i);
if(i==0){
	this.moveTo(pointObject.x, pointObject.y);
	} else {
	this.lineTo(pointObject.x, pointObject.y);
	}
	i += .1 // radian scaled iteration...
}

And behold the crazy spirally fun! It should keep you amused for at least 5 minutes. (Note: This is NOT a guarantee, although if you're at work, and a flash dev, you may find yourself mucking about with this for a few days... it's compulsive spirograph on crack.)

Play around with the r1, r2 and d values and you will discover the interesting relationships between the numbers, not to mention see the huge variety of lovely images that can be generated ... Ooh!

Of course since the function itself (when stripped of strict typing) will work in JSFL (not to mention JavaScript) you can use it to generate editable graphics in Flash authoring, PhotoShop, Illustrator etc.. just imagine! (ooh!)

Add comment April 19th, 2006