// include the FileArts framework.
#include "filearts.as"

// create a base movie clip that everything
// will be put into.
$(_root).movieClip('display_area').set({
	_x: 0,
	_y: 0,
	_width: Stage.width,
	_height: Stage.height
});

$(new XML()).set('ignoreWhite', true).load(function(){
	
	// get some states on the categories from the
	// XML file.
	var num_threads:Number = $(this.firstChild.firstChild).attrib('ts');
	var num_categories:Number = $(this.firstChild.firstChild).attrib('cs');
	
	// loop through all of the categories supplied
	// in the XML file.
	$(this.firstChild.lastChild.childNodes).each(function(i){
		
		// some variables that hold the names (partial) of
		// movie clips that will be created.
		var category_mc:String = 'c'+$(this).attrib('i');
		var category_mc_point:String = category_mc + 'p';
		var category_mc_name:String = category_mc + 'n_';
		
		// figure out the x and y position of where this
		// category will go.
		var x_position = Math.abs((Math.random() * Stage.width) - (Stage.width / 2));
		var y_position = Math.abs((Math.random() * Stage.height) - (Stage.height / 2));
		
		// figure out the size ratio of this particular
		// category compared to all of the categories as
		// a whole.
		var size_ratio:Number = ($(this).attrib('ts') / num_threads);
		var width:Number = Math.ceil(size_ratio * 50);
		var font_size:Number = Math.ceil(size_ratio * 40);
		
		// restrict the width of the category circle and
		// the font size.
		width = width < 15 ? 15 : width;
		font_size = font_size < 12 ? 12 : font_size;
		
		// restrict the x and y positions of the category
		// in terms of the satge width and height.
		x_position = x_position <= 30 ? 50 : (x_position > Stage.width ? Stage.width - 50 : x_position);
		y_position = y_position <= 30 ? 50 : (y_position > Stage.height ? Stage.height - 50 : y_position);
		
		// create the movie clip that all of the category info
		// will be put in.
		$($('display_area').movieClip(category_mc)).set({
			_x: x_position,
			_y: y_position
		});
		
		// create a circle with a gray border and white fill
		$($(category_mc).movieClip(category_mc_point + '_border')).draw({
			shape: 'circle',
			radius: width / 2,
			lineColor: 0xACACAC,
			lineWidth: 2,
			fillColor: 0xFFFFFF,
			_x: 0,
			_y: 0
		});
		
		// create a black circle that will act as a mask
		$($(category_mc).movieClip(category_mc_point)).draw({
			shape: 'circle',
			radius: width / 2,
			fillColor: 0x000000,
			_x: 0,
			_y: 0
		});
		
		// create some text that will be masked
		$($(category_mc).movieClip(category_mc_name + 'hidden')).text({
			_name: 'category_name1',
			_x: (-1 * (width / 2)),
			_y: (-1 * (width / 2)),
			_width: width,
			_height: width,
			type: 'static',
			size: font_size,
			font: 'Arial',
			color: 0x000000,
			text: $(this).attrib('n').substr(0, 3),
			selectable: false
		});
		
		// create a similar text field as above that
		// won't be masked but will be hidden a few seconds
		// after everything has been loaded.
		$($(category_mc).movieClip(category_mc_name + 'visible')).text({
			_name: 'category_name2',
			_x: (-1 * (width / 2)),
			_y: (-1 * (width / 2)),
			_width: 150,
			_height: width,
			type: 'static',
			size: font_size,
			font: 'Arial',
			color: 0x000000,
			text: $(this).attrib('n'),
			selectable: false
		});
		
		$(category_mc).fade(50, 100, "fast");
		$(category_mc).mask(category_mc_name + 'hidden', category_mc_point);
	});
},function(){
	trace('Could not connect to XML.');
}).load('http://flash.filearts.com/test.php');