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 colBackground: uint = 0xFFFFFF;
        private var colBackgroundAlt: uint = 0xFFFFFF;
        private var colBorder: uint = 0;
        private var borderThickness: uint = 1;
        private var borderAlpha: Number  = 1;
        private var backgroundAlpha: Number  = 1;        
		private var colArrow: uint = 0xFFFFFF;
		private var isUp: Boolean = false;
		private var borderOutThickness: Number = 2;
		
		override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
			graphics.clear();
		   	colBorder= getStyle('borderColor');
			colArrow = ColorUtil.adjustBrightness(colBorder, -50);
			colBackground = getStyle('fillColors')[0];
			colBackgroundAlt = ColorUtil.adjustBrightness(colBackground, 90);
 
 			var colBorderOut: uint = ColorUtil.adjustBrightness(colBackground, 0);
		   	var colBorderOutAlt: uint = ColorUtil.adjustBrightness(colBorderOut, 150);
 
 			unscaledHeight-=1;
 
		   	if (name.indexOf('elected') > 0) {
				isUp = true;
		   	}
		   
		   	graphics.lineStyle(1, colBorder, 1);
		   	var matrix: Matrix = new Matrix();
		   	matrix.createGradientBox(unscaledWidth, unscaledHeight, Math.PI/2);
		   	drawRoundRect(0, 1, unscaledWidth, unscaledHeight, 0, 
		   		[colBackgroundAlt, colBackground],
		   		[backgroundAlpha, backgroundAlpha],
		   		matrix, GradientType.LINEAR, [0, 255]);

		   	var cX: Number = unscaledWidth - 15;
		   	var cY: Number = unscaledHeight / 2;
		   	
		   	graphics.lineStyle(0, 0, 0);
		   	var textWidth: Number;
		   	var textX: Number = getStyle('paddingLeft');
		   	
		   	if (parent) {
        		textWidth = parent.getChildAt(parent.numChildren-1).width;
        	}


			with (graphics) {
				lineStyle(1, colBackground, 1);
				moveTo(1, cY);
				lineTo(textX, cY);
				moveTo(textX + textWidth + 1, cY);
				lineTo(unscaledWidth-1, cY);
				
				cY++;
				lineStyle(1, colBackgroundAlt, 1);
				moveTo(1, cY);
				lineTo(textX, cY);
				moveTo(textX + textWidth + 1, cY);
				lineTo(unscaledWidth-1, cY);
			}        	 
		   	
		   	var rectWidth: Number = unscaledHeight*0.7;
		   	var rectX: Number = cX - rectWidth/2;
		   	var rectY: Number = cY - rectWidth/2;
		   	
		  	matrix.createGradientBox(rectWidth, rectWidth, Math.PI/2, rectX, rectY);
		   	
		   	graphics.lineStyle(0,0,0);
		   	drawRoundRect(
				rectX, rectY, rectWidth, rectWidth, 2, 
				[colBorderOut, colBorderOutAlt], [backgroundAlpha, backgroundAlpha], matrix, GradientType.LINEAR, [0, 255]);
		   	
		   	colBorder = colBackground;
		   	graphics.lineStyle(1, colBorder, 0.5);
		   	
		   	switch (name) {
				case "overSkin":
					var adj: int = 60;
					colBackground = ColorUtil.adjustBrightness(colBackground, adj);
					colBackgroundAlt = ColorUtil.adjustBrightness(colBackgroundAlt, adj);
					break;
				default:
		 			break;
		   	}
		   	
			drawRoundRect(
				rectX+borderOutThickness, rectY+borderOutThickness, 
				rectWidth-borderOutThickness*2, rectWidth-borderOutThickness*2, 
				2, 
				[colBackgroundAlt, colBackground], [backgroundAlpha, backgroundAlpha], matrix, GradientType.LINEAR, [0, 255]);

			switch (name) {
				case 'selectedDownSkin':
				case 'downSkin':
					colArrow = ColorUtil.adjustBrightness(colArrow, 150);
				case 'selectedOverSkin':
				case 'overSkin':
					graphics.lineStyle(2, colArrow, 0.5);
					cX = rectX + rectWidth/2;
					cY = rectY + rectWidth/2;
					var radius: Number = 3;
					with (graphics) {
						moveTo(cX - radius, cY);						
						lineTo(cX+radius, cY);
						if (!isUp) {
							moveTo(cX, cY - radius);						
							lineTo(cX, cY + radius);
						}
					}
					break;
			}

		}
	}
}