Put this demo script in Frame 1 of a fresh FLA and give it a whirl:
// Create some text TextFields
var n:Number;
var tf:TextField;
var tfmt:TextFormat = new TextFormat("_sans", 20);
for(n = 0; n 2){
tf.text = "Test text for number " + (n+1);
}

function handleMouseUp($e:MouseEvent):void {
var tf:TextField = TextField($e.target);
if(tf.selectionBeginIndex == tf.selectionEndIndex){
// If the user hasn't dragged to select text already,
// select the whole text field.
tf.setSelection(0, tf.text.length);
}
tf.removeEventListener(MouseEvent.MOUSE_UP, handleMouseUp);
}
function handleFocusIn($e:Event):void {
var tf:TextField = TextField($e.target);
tf.addEventListener(MouseEvent.MOUSE_UP, handleMouseUp);
tf.addEventListener(FocusEvent.FOCUS_OUT, handleFocusOut);
}
function handleFocusOut($e:Event):void {
var tf:TextField = TextField($e.target);
tf.addEventListener(FocusEvent.FOCUS_IN, handleFocusIn);
tf.removeEventListener(FocusEvent.FOCUS_OUT, handleFocusOut);
}


Basically it works by listening for the FOCUS_IN event on each TextField – when it gets it, it then listens for the MOUSE_UP event that normally follows. When that event happens it checks if a selection has been made (which happens when the user holds and drags to highlight characters in the field), and if not it highlights the whole field. Now since it’s no longer listening for the FOCUS_IN nor the MOUSE_UP events, it lets the user click again in the same field and it won’t highlight it all again – this is important to make it easier for the user to work with the field.
When the user moves away from the field, the FOCUS_OUT event fires, the TextField catches it and starts listening for the FOCUS_IN event again.

All this is fine unless the user uses the keyboard to TAB into the field – if the user tabs into the field, and then uses the mouse to select characters, we don’t want the whole field to highlight again, so to prevent this we have the stage listen out for the FocusEvent.KEY_FOCUS_CHANGE event. When this event fires we check if the object the focus is moving to (the relatedObject property) is a TextField, if it is then we remove the listener on that field for the MOUSE_UP event – this disables the new highlighting feature. To make sure it works again properly when the user moves out again, we start it listening for the FOCUS_OUT event.

Have I typed enough now? To see it in action:
Auto Highlighting TextField
and
download the FLA (CS4)

Oh and this all works because of the order the events come in as. When you use the mouse to focus on an Input field it goes like this:
FocusEvent.FOCUS_IN
MouseEvent.MOUSE_UP

when you use the keyboard to tab in:
FocusEvent.KEY_FOCUS_CHANGE
FocusEvent.FOCUS_IN
MouseEvent.MOUSE_UP

If this comes in useful at all, please leave a comment?

//checks to see if the browser has JS on and
//if ExternalInterface is compatible with the browser
if (ExternalInterface.available)
{
//calls the JS function "window.open" in a new window
ExternalInterface.call( "window.open", url_str, "_blank" );
}
else
{
//the fall back call is "navigateToURL"
var urlRequest:URLRequest = new URLRequest(url_str);
navigateToURL(urlRequest,"_blank");
}
But there’s a problem – AlivePDF needs to use a POST request to send the PDF bytearray – that’s not possible with the ExternalInterface.call alternative.

So the solution is to split up the PHP script into two: The first, create_pdf.php receives the bytearray POST and stores it in a session var, all it returns is ok or fail. The second script, fetch_pdf.php takes no parameters, and just outputs a PDF based on whatever’s in the session.
To make that work you need to change the call to PDF.save so it uses Method.LOCAL, and saves the return value, which is the PDF bytearray. Then you send that bytearray via POST to the create_pdf.php script, when that returns you can call the fetch_pdf.php script to actually get it.

But now there’s another problem – if you wait for a COMPLETE event to tell you when create_pdf.php has finished, and then try to load fetch_pdf.php – you’ll still trigger the popup blocker, because now you’re no longer calling the script as a result of a mouse click. So you have to add a little interface and button to the app to allow the user to click to fetch the PDF when it’s ready.

So to sum up, here’s how it goes:

1. User requests a PDF.
2. Use PDF.save(Method.LOCAL) and store the return PDF bytearray.
3. Use URLLoader to send that bytearray to the create_pdf.php script, listen for the COMPLETE event.
4. When the COMPLETE event triggers, show the user a button to allow them to fetch the PDF.
5. When the user clicks the button, use the above workaround with ExternalInterface.call to load fetch_pdf-php.

Here are the two PHP scripts.
create_pdf.php
session_start();

if ( isset ( $GLOBALS["HTTP_RAW_POST_DATA"] )) {
// get bytearray
$pdf = $GLOBALS["HTTP_RAW_POST_DATA"];
$_SESSION['pdf_data'] = $GLOBALS["HTTP_RAW_POST_DATA"];
echo 'ok';
} else {
echo 'error';
}


fetch_pdf.php
/*
** Return the PDF that was previously created and stored in the user's session.
*/
session_start();

echo $_SESSION['pdf_data'];
} else {
echo 'An error occured.';
}

Hope that helps someone else.

The thing to do here is to add a listener to the stage. All mouse events end up at the stage eventually, and when they get there they tell us what was clicked:

 stage.addEventListener(MouseEvent.CLICK, handleStageClick);
..........
private function handleStageClick($e:MouseEvent):void {
  var tmpDo:DisplayObject = DisplayObject($e.target);
  var path:String = $e.target.name;
  while (tmpDo.parent && tmpDo.parent.name) {
    path = tmpDo.parent.name + "." + path;
    tmpDo = tmpDo.parent;
  }
  trace("CLICK: " + path);
}

How to turn a colour bitmapdata into greyscale.

// Turn the object graphics to greyscale.
var matrix:Array = new Array();
matrix = matrix.concat([0.33, 0.33, 0.33, 0, 0]); // red
matrix = matrix.concat([0.33, 0.33, 0.33, 0, 0]); // green
matrix = matrix.concat([0.33, 0.33, 0.33, 0, 0]); // blue
matrix = matrix.concat([0, 0, 0, 1, 0]); // alpha

var filter:ColorMatrixFilter = new ColorMatrixFilter(matrix);

// Note, bdItem has already been created with an image.
bdItem.applyFilter(bdItem, new Rectangle(0, 0, bdItem.width, bdItem.height), new Point(0, 0), filter);

The idea of this blog is to make my Flash work, the portfolio pieces and experiments, more available. My site will soon get a redesign using a Papervision interface, which while cool in many ways will make it a little harder for people to find my content, so this blog should hopefully remedy that. And also provide you with a way to give me feedback on things.

So I’ll start of with a random one… this was always one of my favourite experiments but I’ve yet to find a use for it, so it can kick off the blog

Spirals in Motion

As is usual in my experiments, roll your mouse over the screen to interact with the changing patterns.

It was written way back when in AS1, set your background to black and stick this in frame 1:

drawCircle = function (x, y, r) {
	var angleDelta = 45*(Math.PI/180), rx, ry, ex, ey;
	var regDist = r/Math.cos(angleDelta/2);
	var angle = 0;
	this.moveTo(x+r, y);
	for (var i = 0; i<8; i++) {
		 angle += angleDelta;
		 rx = x+Math.cos(angle-(angleDelta/2))*(regDist);
		 ry = y+Math.sin(angle-(angleDelta/2))*(regDist);
		 ex = x+Math.cos(angle)*r;
		 ey = y+Math.sin(angle)*r;
		 this.curveTo(rx, ry, ex, ey);
	}
}

var k = 0.14;
var friction = 0.825;
var cx = Stage.width/2;
var cy = Stage.height/2;
var ox = cx;
var oy = cy;
var numBranches = 3;
var numNodes = 30; // Number of circles per branch
var nodes = [];
// Set up colours
var col = Math.random()*Math.PI*2;
var colInc = 0.1;
// Create the circles
for(n=0, z=1; n<numBranches; n++){
	nodes.push(new Array());
	for(var m=0; m<numNodes; m++, z++){
		nodes[n].push(thisNode =
			this.createEmptyMovieClip("mc_"+z, (m*numBranches)+n));
		// Initally all are white, this is adjusted later
		thisNode.beginFill(0xffffff);
		drawCircle.apply(thisNode, [0, 0, 220 * (1-(m/numNodes))]);
		thisNode.endFill();
		thisNode.thisCol = new Color(thisNode);
	}
}
// Localise Math functions for better performance.
this.sin = Math.sin;
this.cos = Math.cos;
this.abs = Math.abs;
this.createEmptyMovieClip("border", z);
this.border.lineStyle(1, 0xAAAAAA);
this.border.lineTo(Stage.width-1, 0);
this.border.lineTo(Stage.width-1, Stage.height-1);
this.border.lineTo(0, Stage.height-1);
this.border.lineTo(0, 0);
this.onEnterFrame = function(){
	var thisCol, nRatio, r, g, b, rDone, gDone, bDone, rInc, gInc, bInc;
	var dx = ox - cx;
	var dy = oy - cy;
	var xRatio = dx/cx;
	var yRatio = dy/cy;
	var radInc = xRatio * -7;
	var thetaInc = yRatio * 0.05;
	var thetaMod = xRatio * 1.5;
	col += colInc;
	for(var n=0; n<numBranches; n++){
		nRatio = n/numBranches;
		theta = thetaMod + ((Math.PI*2)*nRatio);
		thisCol = col + ((Math.PI*2)*nRatio);
		rDone = this.abs(0x88 + (this.sin(thisCol))*0x77);
		gDone = this.abs(0x88 + (this.sin(1.5 + thisCol))*0x77);
		bDone = this.abs(0x88 + (this.sin(3 + thisCol))*0x77);
		rInc = rDone / numNodes;
		gInc = gDone / numNodes;
		bInc = bDone / numNodes;
		r = g = b = 0;
		for(var m=0, rad=80; m<numNodes; m++){
			theta += thetaInc;
			rad += radInc;
			thisNode = nodes[n][m];
			thisNode._x = cx+(this.cos(theta) * rad);
			thisNode._y = cy+(this.sin(theta) * rad);
			r += rInc;
			g += gInc;
			b += bInc;
			thisNode.thisCol.setRGB(r<<16 | g<<8 | b);
		}
	}
	vx = (vx + ((_xmouse - ox) * k)) * friction;
	vy = (vy + ((_ymouse - oy) * k)) * friction;
	ox += vx;
	oy += vy;
}