package skins
{
	import flash.display.GradientType;
	import flash.geom.Matrix;
	
	import mx.skins.Border;
	import mx.utils.ColorUtil;

	public class AccordionButton extends Border
	{
		
        private var backgroundColor: uint = 0xFFFFFF;
        private var backgroundColorAlt: uint = 0xFFFFFF;
        private var borderColor: uint = 0;
        private var borderThickness: uint = 1;
        private var borderAlpha: Number  = 1;
        private var backgroundAlpha: Number  = 1;        
		private var arrowColor: uint = 0xFFFFFF;
		private var isUp: Boolean = false;
		
		override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
			graphics.clear();
		   	borderColor = getStyle('borderColor');
			arrowColor = ColorUtil.adjustBrightness(borderColor, -50);
			backgroundColor = getStyle('fillColors')[0];
			backgroundColorAlt = ColorUtil.adjustBrightness(backgroundColor, 90);
 
 			unscaledHeight-=1;
 
		   	if (name.indexOf('elected') > 0) {
				isUp = true;
		   	}
		   
		   	var textPadding: Number = 3;
		   	var textWidth: Number = 0;
		   	var textX: Number = getStyle('paddingLeft') - textPadding;
		   	if (parent) {
        		textWidth = parent.getChildAt(parent.numChildren-1).width + textPadding*2;
        	}

			var cols: Array = [backgroundColor, backgroundColorAlt, backgroundColor];
			var alphas: Array = [1, 1, 1];
			var ratios: Array = [0, 100, 230];
			var matrix: Matrix = new Matrix();
			matrix.createGradientBox(unscaledWidth, unscaledHeight, Math.PI/2);

			with (graphics) {
				lineStyle(1, borderColor, 1);
				beginGradientFill(GradientType.LINEAR, cols, alphas, ratios, matrix);
				drawRoundRectComplex(0, 0, unscaledWidth, unscaledHeight, 0, unscaledHeight, 0, 0);
				endFill();
			}
			
			cols = [backgroundColor, backgroundColorAlt];
			ratios = [0, 255];
			alphas = [1, 1];
			var r: Number = 10;
			with (graphics) {
				lineStyle(0, 0, 0);
				beginGradientFill(GradientType.LINEAR, cols, alphas, ratios, matrix);
				drawRoundRectComplex(textX, 1, textWidth, unscaledHeight - 1*2, r, r, r, r);
				endFill();
			}
		  	
		  	graphics.lineStyle(0, 0, 0);
		  	
		  	var skinColor: uint = ColorUtil.adjustBrightness(backgroundColorAlt, 50);//0xCCCCCC;
		  	arrowColor = 0;
		  	
		  	if (name.toLowerCase().indexOf('down') != -1) {
		  		arrowColor = 0xFFFFFF;
		  		skinColor = ColorUtil.adjustBrightness(skinColor, -30);
		  		backgroundColorAlt = ColorUtil.adjustBrightness(backgroundColorAlt, - 30);
		  	} 
		  	
		  	r = unscaledHeight-2;
		  	cols = [ColorUtil.adjustBrightness(backgroundColorAlt, -60), backgroundColorAlt, skinColor, backgroundColorAlt, skinColor];
		  	alphas = [1, 1, 1, 1, 1];
		  	ratios = [65, 140, 180, 230, 255]; 
		  	matrix.createGradientBox(r, r, 0, unscaledWidth - r - 10 - r*0.05, 1);
		  	
		  	drawRoundRect(unscaledWidth - r - 10, 1, r, r, r, cols, alphas, matrix, GradientType.RADIAL, ratios); 
	
			var cX: int = unscaledWidth - r - 10 + r/2;
			var cY: int = unscaledHeight/2 + 1;
			r = 3;
			
			with (graphics) {
				lineStyle(2, arrowColor, 0.4);
				switch (name) {
					case 'selectedDownSkin':
					case 'selectedOverSkin':
						moveTo(cX - r, cY);
						lineTo(cX + r, cY);						
						break;
					case 'downSkin':
					case 'overSkin':
						moveTo(cX - r, cY);
						lineTo(cX + r, cY);
						moveTo(cX, cY + r);
						lineTo(cX, cY - r);
						break;
				}
			}
			
			
		}
	}
}