

/*************************************************************************
*
* ADOBE CONFIDENTIAL
* ___________________
*
*  Copyright 2008 Adobe Systems Incorporated
*  All Rights Reserved.
*
* NOTICE:  All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any.  The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*
* $DateTime: 2008/04/10 13:35:00 $
*
* Adobe Output Module 2.0
*
* MediaGallery Originally Written by Quality Process Incorporated, Enhanced by
* Adobe System China. Contact Sheet written by Adobe System China.
* 
*
**************************************************************************/


/*****************************************************************************************************************
                    Define Global Constant Variable Here
******************************************************************************************************************/
AOM.kTriHt = 7;
AOM.kTriWid = 5;
AOM.kGroupSpacing = 3;


/*****************************************************************************************************************
                    Define Contact Sheet Theme Class Here
******************************************************************************************************************/

/**
  * UITheme class
  * This class define the general UI theme methods .
  *
  * @Date: 2007-12-25
*/
AOM.UITheme = function() {
	this.initUITheme();
}

AOM.UITheme.prototype.initUITheme = function() {
	this.brushes = new Object;
	this.pens = new Object;
	
	//brush and pen names
	this.color = new Object;
	
	this.color.backgroundColor = "backgroundColor";
	this.color.disabledBackgroundColor = "disabledBackgroundColor";
	this.color.middleGrayBrush = "middleGrayBrush";
	this.color.darkGrayBrush = "darkGrayBrush";
	this.color.blackBrush = "blackBrush";
	this.color.whiteBrush = "whiteBrush";
	this.color.highlightBrush = "highlightBrush";
	this.color.saveBtnBrush = "saveBtnBrush";
	this.color.scrollerBgBrush = "scrollerBgBrush";
	this.color.slipBarEdgeBrush = "slipBarEdgeBrush";
	this.color.slipBarBrush = "slipBarBrush";
	this.color.arrowEdgeBrush = "arrowEdgeBrush";
	this.color.arrowBrush = "arrowBrush";
	this.color.triangleBrush = "triangleBrush";
	this.color.gsDisableBrush = "gsDisableBrush";
	this.color.gsDisableTextBrush = "gsDisableTextBrush";
	this.color.gsDisableTriangleBrush = "gsDisableTriangleBrush";
	this.color.barUpEdgeBrush = "barUpEdgeBrush";
	this.color.barEdgeBrush = "barEdgeBrush";
	this.color.barBrush = "barBrush";
	this.color.scaleBrush = "scaleBrush";
	this.color.indicatorBrush0 = "indicatorBrush0";
	this.color.indicatorBrush1 = "indicatorBrush1";
	this.color.indicatorBrush2 = "indicatorBrush2";
	this.color.indicatorBrush3 = "indicatorBrush3";
	
	this.color.foregroundColor = "foregroundColor";
	this.color.disabledForegroundColor = "disabledForegroundColor";
	this.color.normalTextPen = "normalTextPen";
	this.color.focusedTextPen = "focusedTextPen";
	this.color.darkGrayPen = "darkGrayPen";
	this.color.tintGrayPen = "tintGrayPen";
	this.color.middleGrayPen = "middleGrayPen";
	this.color.highlightPen = "highlightPen";
	this.color.hookPen = "hookPen";
	this.color.trianglePen = "trianglePen";
	this.color.gsDisablePen = "gsDisablePen";
	this.color.blackPen = "blackPen";
	this.color.gsDisableBoldPen = "gsDisableBoldPen";
	this.color.gsDisableTextPen = "gsDisableTextPen";
}

AOM.UITheme.prototype.getPen = function(penName) {
	if (this.graphicsStateChanged ("backgroundColor"))  {
		this.flushBrushesCache();
		this.flushPensCache();
	}
		
	var pen = this.pens[penName];
	if (pen == undefined) {
		pen = this.createPen(penName);
		this.pens[penName] = pen;
	}
	return pen;
}



AOM.UITheme.prototype.getBrush = function(brushName) {
    if (this.graphicsStateChanged ("backgroundColor"))  {
		this.flushBrushesCache();
		this.flushPensCache();
	}
		
	var brush = this.brushes[brushName];
	if (brush == undefined) {
		brush = this.createBrush(brushName);
		this.brushes[brushName] = brush;
	}
	return brush;
}

AOM.UITheme.prototype.constraintColor = function(colorVal) {
	if (colorVal > 1)  {
		colorVal = 1;
	} else if (colorVal < 0) {
		colorVal = 0;
	}
	return colorVal;
}


AOM.UITheme.prototype.applyTheme = function (uiElement, applyToChildren) {
	var themeType;
	if (uiElement.themeType != undefined) {
		themeType = uiElement.themeType;
	} else {
		themeType = uiElement.type;
	}
	themeType = themeType.toLowerCase();
	
	var settings = this.themeSettings[themeType];
	if (settings) {
		var expr = "";
		for (var s = 0; s < settings.length; s++) {
			expr += "uiElement." + settings[s] + ";";
		}
		eval(expr);
		
		//define uitheme property so element can find its theme
		uiElement.uiTheme = this;
	}

	//TODO
	if (themeType == "edittext") {
		this.setEditTextDisableBgColor(uiElement);
	}

	var type = uiElement.type;
	if (uiElement.type == undefined) {
		return;
	}
	type = type.toLowerCase();
	
	if (applyToChildren && (type == "group" || type == 'panel')) {
		for (var c = 0; c < uiElement.children.length; c++) {
			this.applyTheme(uiElement.children[c], this.themeSettings, applyToChildren);
		}
	} 
}


AOM.UITheme.prototype.flushBrushesCache = function() {
	this.brushes = new Object;
}

AOM.UITheme.prototype.flushPensCache = function() {
	this.pens = new Object;
}


/**
  * AOMUITheme class
  * This class define sets of special methods for the Contact Sheet functionality.  
  *
  * @Date: 2007-12-25
*/
AOM.AOMUITheme = function(root) {
	//init  brushes and pens , init color name
	this.initUITheme();
	this.initAOMUITheme(root);
}

AOM.AOMUITheme.prototype = new AOM.UITheme();

AOM.AOMUITheme.prototype.initAOMUITheme = function(root) {
	//this is tabbedPalette.content , is a Group object
	this.root = root;
	
	//overriden base method
	this.baseFlushBrushesCache = AOM.UITheme.prototype.flushBrushesCache;
	this.baseFlushPensCache = AOM.UITheme.prototype.flushPensCache;
	
	//theme 
	this.themeSettings = {
		statictext:
			[
				"graphics.foregroundColor=this.getPen(this.color.foregroundColor)",
				"graphics.disabledForegroundColor = this.getPen(this.color.disabledForegroundColor)",
				"onDraw = this.drawStaticText",
				"graphics.font = this.getFont()",
			],
		edittext:
			[
				"graphics.backgroundColor=this.getBrush(this.color.blackBrush)",
				"graphics.disabledBackgroundColor=this.getBrush(this.color.blackBrush)",
				"graphics.foregroundColor=this.getPen(this.color.foregroundColor)",
				"graphics.disabledForegroundColor = this.getPen(this.color.disableForegroundColor)",
				"graphics.gsDisableBrush=this.getBrush(this.color.gsDisableBrush)",
				"graphics.font = this.getFont()",
			],
		checkbox:
			[
				"onDraw = this.drawCheckbox",
				"graphics.font = this.getFont()",
			],	
		swapbutton: 
			[
				"onDraw=this.drawSwapImageButton",
			],
		imagebutton:
			[
				"onDraw=this.drawImageButton",
				"graphics.font = this.getFont()",
			],
		dropdownlist:
			[
				"graphics.foregroundColor = this.getPen(this.color.foregroundColor)",
				"graphics.disabledForegroundColor = this.getPen(this.color.disabledForegroundColor)",
				"graphics.backgroundColor = this.getBrush(this.color.backgroundColor)",
				"graphics.disabledBackgroundColor = this.getBrush(this.color.backgroundColor)",
				"onDraw = this.drawDropDownList",
				"graphics.font = this.getFont()",
			],
		iconbutton:
			[
				"onDraw = this.drawTextButton",   
				"graphics.font = this.getFont()",
			],
		button:
			[
				"onDraw = this.drawTextButton",
				"graphics.font = this.getFont()",
			],
		savebutton:
			[
				"onDraw = this.drawSaveAsButton",
				"graphics.font = this.getFont()",
			],
		sdropdownlist:
			[
				"onDraw = this.drawSelectionButton",
				"graphics.font = this.getFont()",
			],
		colorpnl:
			[
				"onDraw = this.drawColorPanel"
			],
		openclosebtn:
			[
				"onDraw = this.drawDrawerOpenCloseButton",
				"graphics.font = this.getFont()",
			],
		spline:
			[
				"onDraw = this.drawSPLine",
			],
		scrollbar:
			[
				"onDraw = this.drawScrollbar",
			],
		numericstepper:
			[
				"onDraw = this.drawNumericStepper",
			],	
		radiobutton:
			[
				"onDraw = this.drawRadioButton",
				"graphics.font = this.getFont()",
			],
	}
}

AOM.AOMUITheme.prototype.getFont = function() {
	if (this.sysFont == undefined) {
		var tempFontStaticText = this.root.add("StaticText");
		var font = tempFontStaticText.graphics.font;
		var currentFontSize = font.size;
		if (font.size > 11) {
			currentFontSize -= 1; 
		}
		this.sysFont = ScriptUI.newFont (font.name, font.style, currentFontSize);
		this.root.remove(tempFontStaticText);
	} 
	return this.sysFont;
}


AOM.AOMUITheme.prototype.createBrush = function(brushName) {
	var gfx = this.root.graphics;
	
	var bgGray = gfx.backgroundColor.color[0];
	var gray = 0;
	var opacity = 1.0;
	
	switch (brushName) {
	case this.color.backgroundColor:
		gray = bgGray;
		break;
	case this.color.disabledBackgroundColor :
		gray = bgGray;
		break;
	case this.color.middleGrayBrush:
		gray = bgGray + .11;
		if (bgGray < 0.1) {
			gray = bgGray + .2;
		}
		break;
	case this.color.darkGrayBrush:
		gray = bgGray - .15;
		if (gray < 0.1)  gray = 0.1;
		break;
	case this.color.blackBrush:
		gray = bgGray - .24;
		if (gray < 0.1) gray = 0.1;
		break;
	case this.color.whiteBrush:
		gray = 1;
		break;
	case this.color.highlightBrush:
		gray = 1;
		opacity = .15;
		break;
	case this.color.saveBtnBrush:
		gray = bgGray - .05;
		if (gray > 0.8) gray = .80;
		if (gray < 0.1) gray = .10;
		break;		
	case this.color.scrollerBgBrush:
		gray = 0.35 * bgGray  + 0.32;
		break;
	case this.color.slipBarEdgeBrush :
		gray = 0.41 * bgGray  + 0.41;
		break;
	case this.color.slipBarBrush :
		gray = 0.41 * bgGray  + 0.51;
		break;
	case this.color.arrowEdgeBrush :
		gray = bgGray - .15;
		if (gray < 0.1)  gray = 0.1;
		break;
	case this.color.arrowBrush :
		gray = 0.35 * bgGray + 0.51;
		break;
	case this.color.triangleBrush:
		gray = 0.1;
		break;
	case this.color.gsDisableBrush:
		if (bgGray <=.5) {
			gray = .9;
			opacity = .3;
		} else {
			gray = .1;
			opacity = .3;
		}
		break;
	case this.color.gsDisableTextBrush:
		if (bgGray > .5) {
			gray = bgGray - .3;
			opacity = .5;
		} else {
			gray = bgGray + .3;
			opacity = .5;
		}	
		break;
	case this.color.gsDisableTriangleBrush:
		gray = 0.5;
		opacity = 0.5;
	case this.color.barUpEdgeBrush:
		gray = bgGray - .1;
		break;
	case this.color.barEdgeBrush:
		if (bgGray < .5) {
			gray = bgGray + .2;
		} else {
			if (bgGray > .9) {
				gray = bgGray -.08;
			} else {
				gray = bgGray + .2;
			}
		}
		break;
	case this.color.barBrush:
		gray = bgGray + .05;
		break;
	case this.color.scaleBrush:
		if (bgGray < .5) {
			gray = bgGray + .2;
		} else {
			gray = bgGray -.2;
		}
		break;
	case this.color.indicatorBrush0 :
		if (bgGray < .5) {
			gray  = .05;
		} else {
			gray = .45;
		}
		break;
	case this.color.indicatorBrush1:
		if (bgGray < .5) {
			gray  = .15;
		} else {
			gray = .65;
		}
		break;
	case this.color.indicatorBrush2 :
		if (bgGray < .5) {
			gray  = .45;
		} else {
			gray = 1;
		}
		break;
	case this.color.indicatorBrush3 :
		if (bgGray < .5) {
			gray  = .35;
		} else {
			gray = .85;
		}
		break;
	default :
		if (brushName == brushName * 1.0) {
			gray = brushName;
		}
		break;
	}

	gray = this.constraintColor(gray);

	return gfx.newBrush (gfx.BrushType.SOLID_COLOR, [gray, gray, gray, opacity]);
}


AOM.AOMUITheme.prototype.createPen = function(penName) {	
	var gfx = this.root.graphics;
	var fgGray = gfx.foregroundColor.color[0];
	var bgGray = gfx.backgroundColor.color[0];  //current is .27
	var gray = 0;
	var opacity = 1;
	var penWidth = 1;
	
	switch (penName) {
	case this.color.foregroundColor :
		gray = fgGray;
		break;
	case this.color.disabledForegroundColor:
		gray = fgGray;
		break;
	case this.color.focusedTextPen:
		gray = bgGray + .03;
		break;
	case this.color.tintGrayPen:
		if (bgGray < .5) {
			gray = bgGray + .3;
		} else {
			gray = bgGray - .3;
		}
		break;
	case this.color.middleGrayPen:
		gray = bgGray + .11;
		break;
	case this.color.darkGrayPen:
		gray = bgGray - .15;
		break;
	case this.color.highlightPen:
		gray = 1;
		opacity = .15;
		break;
	case this.color.darkGrayPen:
		gray = bgGray - .15;
		break;
	case this.color.hookPen:
		gray = 1;
		if (bgGray > 0.5) gray = 0.3;
		opacity = .9;
		penWidth = 2;
		break;
	case this.color.blackPen:
		gray = 0;
		break;
	case this.color.trianglePen:
		gray = 1;
		opacity = .15;
		break;
	case this.color.gsDisablePen:
		if (bgGray <= .5) {
			gray = .9;
			opacity = .3;
		} else {
			gray = .1;
			opacity = .3;
		}
		break;
	case this.color.gsDisableTextPen:
		if (bgGray > .5) {
			gray = bgGray - .3;
			opacity = .5;
		} else {
			gray = bgGray + .3;
			opacity = .5;
		}	
		break;
    case this.color.gsDisableBoldPen:
		if (bgGray < .5) {
			gray = .9;
			opacity = .3;
		} else {
			gray = .1;
			opacity = .3;
		}
		penWidth = 2;
		break;
	default :
		if (penName == penName * 1.0) {
			gray = penName;
		}
	}

	gray = this.constraintColor(gray);
	return gfx.newPen(gfx.PenType.SOLID_COLOR, [gray, gray, gray, opacity], penWidth);
}

AOM.AOMUITheme.prototype.graphicsStateChanged = function(gstatePropertyName) {
	var changed = false;
	var gfx = this.root.graphics;
	
	if(this.currentBackgroundColor == undefined) {
		changed = true;
	} else {
		var oldColor, newColor;
		if (gstatePropertyName == "backgroundColor") {
			oldColor = this.currentBackgroundColor.color.toString();
			newColor = gfx.backgroundColor.color.toString();
		} else if (gstatePropertyName == "foregroundColor") {
			oldColor = this.currentForegroundColor.color.toString();
			newColor = gfx.foregroundColor.color.toString();
		}
	
		changed = oldColor != newColor;
	}

	return changed;
}


AOM.AOMUITheme.prototype.flushBrushesCache = function() {
	this.baseFlushBrushesCache();
	this.currentBackgroundColor = this.root.graphics.backgroundColor;
}

AOM.AOMUITheme.prototype.flushPensCache = function() {
	this.baseFlushPensCache();
	this.currentForegroundColor = this.root.graphics.foregroundColor;
}


AOM.AOMUITheme.prototype.setEditTextDisableBgColor = function(element) {
	var gfx = element.graphics;
	if (gfx.gsDisableBrush == undefined ||
        gfx.backgroundColor == undefined)
	    return;
	
	var theme = element.uiTheme;
	if (element.gsEnabled == undefined || element.gsEnabled == true) {
		element.onDraw = undefined;
	} else {
		element.onDraw = theme.drawDisabledEditText;
	}
}

AOM.AOMUITheme.prototype.drawDisabledEditText = function(drawingState) {
	 var theme = this.uiTheme;
	var gfx = this.graphics;
	var w = this.size.width;
	var h = this.size.height;

	gfx.newPath();
	gfx.rectPath(0, 0, w, h);
	gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
	
	var title = this.text;
	if (this.properties.noecho) {
		var disableBrush = theme.getBrush(theme.color.gsDisableTextBrush);
		var x0 = 4;
		var y0 = 6;
		if (title == undefined || this.text.length == 0) {
			//
		} else {
			var len = title.length;
			for (var i = 0; i < len; i++) {
				gfx.newPath();
				gfx.rectPath(x0+1, y0, 3, 5);
				gfx.fillPath(disableBrush);
				gfx.newPath();
				gfx.rectPath(x0, y0+1, 5, 3);
				gfx.fillPath(disableBrush);
				x0 += 7;
			}
		}
	} else {
		 var textPen = theme.getPen(theme.color.gsDisableTextPen);
		var textSize = gfx.measureString(title);
		var textX = 3;
		var textY = 0;
		gfx.drawString(title, textPen, textX, textY);
	}

	gfx.newPath();
	if (File.fs == "Macintosh") {
		gfx.rectPath(0, 0, w, h);
	} else {
		gfx.rectPath(0, 0, w-1, h-1);
	}
	gfx.strokePath(theme.getPen(theme.color.gsDisablePen));
}


AOM.AOMUITheme.prototype.getTruncatedTitle = function(title, textWid, realWid, gfx) {
	if (textWid >= realWid) {
		var dotWid = gfx.measureString("...").width;
		var charWid = Math.ceil(textWid /title.length);
		var charN = Math.floor((realWid - dotWid) / charWid);
		return title.substr(0, charN) + "...";
	} else {
		return title;
	}
}

//draw slider
AOM.AOMUITheme.prototype.drawNumericStepper = function(drawingState) {
	try {
		var theme = this.uiTheme;
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;

		//draw background color
		var bgColor = theme.getBrush(theme.color.backgroundColor)
		gfx.newPath();
		gfx.rectPath(0, 0, w, h);
		gfx.fillPath(bgColor);
		
		//draw bar
		var x0 = 0, y0 =7, bw = w, bh = 6;

		gfx.newPath();
		gfx.moveTo(x0+1, y0); gfx.lineTo(x0+bw-1, y0);
		gfx.lineTo(x0+bw, y0+2); gfx.lineTo(x0+bw, y0+bh-2);
		gfx.lineTo(x0+bw-2, y0+bh); gfx.lineTo(x0+2, y0+bh);
		gfx.lineTo(x0, y0+bh-2); gfx.lineTo(x0, y0+2);
		gfx.closePath();
		gfx.fillPath(theme.getBrush(theme.color.barEdgeBrush));
		
		gfx.newPath();
		gfx.rectPath(x0+1, y0, bw-2, 1);
		gfx.fillPath(theme.getBrush(theme.color.barUpEdgeBrush));
				
		gfx.newPath();
		var fillRect = {left:x0+1, top:y0+1, width:bw-2, height:bh-2};
		var bgGray = theme.getBrush(theme.color.barBrush).color[0];
		var startGray = bgGray , midGray = bgGray + .02, endGray = bgGray + .04;   
		theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);
		
		//add scale
		var x0 = 6, y0 = 0;
		var scaleRuleWidth= w - 2 * x0;
		var scaleRuleHeight = 4;	
		
		var sdelta = (scaleRuleWidth) / 10; 
		var x = x0;
		for (var i = 0; i <= 10; i++) {	
			gfx.newPath();
			if (i % 5 == 0) {
				gfx.rectPath(x, y0 , 1, 5);
			} else {
				gfx.rectPath(x, y0 + 2, 1, 3);
			}
			gfx.fillPath(theme.getBrush(theme.color.scaleBrush));
			
			var x = x0 + (i+1) * sdelta;
		}

		//add indicator
		var indicatorBrush0 = theme.getBrush(theme.color.indicatorBrush0);
		var indicatorBrush1 = theme.getBrush(theme.color.indicatorBrush1);
		var indicatorBrush2 = theme.getBrush(theme.color.indicatorBrush2);
		var indicatorBrush3 = theme.getBrush(theme.color.indicatorBrush3);
		var x0 = (this.indicatorLocationValue == undefined) ? 2 : this.indicatorLocationValue; 
		var y0 = 3;
		
		var newPath =theme.trianglePath(gfx, x0, y0, 9, "top");
		gfx.fillPath(indicatorBrush0, newPath);
		
		var newPath = theme.trianglePath(gfx, x0+1, y0+1, 7, "top");
		gfx.fillPath(indicatorBrush1, newPath);
		
		var newPath =theme.trianglePath(gfx, x0+2, y0+2, 5, "top");
		gfx.fillPath(indicatorBrush2, newPath);
		
		var newPath =theme.trianglePath(gfx, x0+3, y0+3, 3, "top");
		gfx.fillPath(indicatorBrush3, newPath);
		
		gfx.newPath();
		gfx.rectPath(x0, y0+5, 9, 7);
		gfx.fillPath(indicatorBrush0);
			 		
		gfx.newPath();
		gfx.rectPath(x0+1, y0+5, 7, 6);
		gfx.fillPath(indicatorBrush2);
			
		indGray = indicatorBrush3.color[0];
		var pathRect = {left: x0 + 2, top: y0+5, width: 5, height:5};
		theme.gradientFillPath(gfx, pathRect, indGray, indGray - .04, indGray - .08);
	
	} catch(e) {
		AOM.CS.Log.writeError("onDraw:" + e);
	}
}


//draw scrollbar
AOM.AOMUITheme.prototype.drawScrollbar = function(drawingState) {
	try{
		var theme = this.uiTheme;
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
			
		var jumpdelta = this.jumpdelta;
		var maxvalue = this.maxvalue;
		var value = this.value;
		
		if (w < h) {
			var arrowWidth = w;
			var arrowHeight = AOM.VSCROLLER_HEIGHT;
			
			var indicatorSize = this.getIndicatorSize();
			
			var indicatorWidth = indicatorSize.width;
			var indicatorHeight = indicatorSize.height;

			//fill background
			gfx.newPath();
			var fillRect = {left: 0, top:0, width: w, height: h};
			var bgGray = theme.getBrush(theme.color.scrollerBgBrush).color[0];
			var startGray = bgGray , midGray = bgGray + .04, endGray = bgGray + .08; 
			theme.vgradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			//draw scrollbar -indicator
			var indicatorLocation = this.getIndicatorLocation();

			var currentX = indicatorLocation.x;
			var currentY = indicatorLocation.y;

			gfx.newPath();
			gfx.moveTo(2, currentY);
			gfx.lineTo(w-2, currentY);
			gfx.lineTo(w, currentY + 2);
			gfx.lineTo(w, currentY + indicatorHeight - 3);
			gfx.lineTo(w-3, currentY + indicatorHeight);
			gfx.lineTo(3, currentY + indicatorHeight);
			gfx.lineTo(0, currentY + indicatorHeight - 3);
			gfx.lineTo(0, currentY +2);
			gfx.closePath();
			gfx.fillPath(theme.getBrush(theme.color.slipBarEdgeBrush));
			
			gfx.newPath();
			fillRect = {left: 1, top:currentY + 1, width: w -2, height: indicatorHeight - 2};
			bgGray = theme.getBrush(theme.color.slipBarBrush).color[0];
			startGray = bgGray , midGray = bgGray - .04, endGray = bgGray - .08; 
			theme.vgradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			//draw up-arrow
			var arrowBrush = theme.getBrush(theme.color.arrowBrush);
			var arrowEdgeBrush = theme.getBrush(theme.color.arrowEdgeBrush);
			var triangleBrush = theme.getBrush(theme.color.triangleBrush);
			
			gfx.newPath();
			fillRect = {left: 0, top:0, width: arrowWidth, height: arrowHeight};
			bgGray =arrowBrush .color[0];
			startGray = bgGray , midGray = bgGray - .04, endGray = bgGray - .08; 
			theme.vgradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			gfx.newPath();
			gfx.rectPath(0, 0, arrowWidth, 1);
			gfx.fillPath(arrowEdgeBrush);

			gfx.newPath();
			gfx.rectPath(0, arrowHeight-1, arrowWidth, 1);
			gfx.fillPath(arrowEdgeBrush);
			
			//draw down-triangle	
			var triangleWidth = 7;
			var triangleHeight = 4;
			
			var triangleMid = Math.floor(triangleWidth / 2);

			var x0 = y0 =0;
			var triangleLeft = x0 + Math.floor((arrowWidth - triangleWidth) / 2);
			var triangleTop = y0 + Math.floor((arrowHeight - triangleHeight) / 2);
			
			for (var di = triangleMid; di >= 0; di--) {
				gfx.newPath();
				gfx.rectPath(triangleLeft + (triangleMid - di), triangleTop + di, triangleWidth - 2 * (triangleMid - di), 1);
				gfx.fillPath(triangleBrush);
			}

			//draw down-arrow	
			gfx.newPath();
			fillRect = {left: 0, top:h - arrowHeight, width: arrowWidth, height: arrowHeight};
			bgGray = arrowBrush.color[0];
			startGray = bgGray , midGray = bgGray - .04, endGray = bgGray - .08; 
			theme.vgradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			gfx.newPath();
			gfx.rectPath(0, h - arrowHeight, arrowWidth, 1);
			gfx.fillPath(arrowEdgeBrush);
			
			//draw up-triangle
			x0 = 0;
			y0 = h - arrowHeight;
			triangleLeft = x0 + Math.floor((arrowWidth - triangleWidth) / 2);
			triangleTop = y0 + Math.floor((arrowHeight - triangleHeight) / 2);
			for (var di = 0; di <= triangleMid; di++) {
				gfx.newPath();
				gfx.rectPath(triangleLeft + di, triangleTop + di, triangleWidth - 2 * di, 1);
				gfx.fillPath(triangleBrush);
			}

		} else {
			//draw hscrollbar 
			var arrowWidth = AOM.HSCROLLER_WIDTH;
			var arrowHeight = h;
			
			var indicatorSize = this.getIndicatorSize();
			var indicatorWidth = indicatorSize.width;
			var indicatorHeight = indicatorSize.height;
			
			//fill backgroundcolor
			gfx.newPath();
			var fillRect = {left: 0, top:0, width: w, height: h};
			var bgGray = theme.getBrush(theme.color.scrollerBgBrush).color[0];
			var startGray = bgGray , midGray = bgGray + .04, endGray = bgGray + .08; 
			theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			//draw  slip bar	
			var indicatorLocation = this.getIndicatorLocation();
			var currentX = indicatorLocation.x;
			var currentY = indicatorLocation.y;

			gfx.newPath();
			gfx.moveTo(currentX + 2, currentY);
			gfx.lineTo(currentX + indicatorWidth-2, currentY);
			gfx.lineTo(currentX + indicatorWidth, currentY + 2);
			gfx.lineTo(currentX + indicatorWidth,  h - 2);
			gfx.lineTo(currentX + indicatorWidth -2, h);
			gfx.lineTo(currentX + 2, h);
			gfx.lineTo(currentX, h- 2);
			gfx.lineTo(currentX, currentY +2);
			gfx.closePath();
			gfx.fillPath(theme.getBrush(theme.color.slipBarEdgeBrush));
			
			gfx.newPath();
			fillRect = {left: currentX + 1, top:currentY + 1, width: indicatorWidth -2, height: h - 2};
			bgGray = theme.getBrush(theme.color.slipBarBrush).color[0];
			startGray = bgGray , midGray = bgGray - .04, endGray = bgGray - .08; 
			theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			//draw up-arrow
			var arrowBrush = theme.getBrush(theme.color.arrowBrush);
			var arrowEdgeBrush = theme.getBrush(theme.color.arrowEdgeBrush);
			var triangleBrush = theme.getBrush(theme.color.triangleBrush);
			
			gfx.newPath();
			fillRect = {left: 0, top:0, width: arrowWidth, height: arrowHeight};
			bgGray = arrowBrush.color[0];
			startGray = bgGray , midGray = bgGray - .04, endGray = bgGray - .08; 
			theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);

			gfx.newPath();
			gfx.rectPath(arrowWidth - 1, 0,  1, arrowHeight);
			gfx.fillPath(arrowEdgeBrush);
			
			//draw left-triangle	
			var triangleWidth = 4;
			var triangleHeight = 7;
			
			var triangleMid = Math.floor(triangleHeight / 2);

			var x0 = y0 =0;
			var triangleLeft = x0 + Math.floor((arrowWidth - triangleWidth) / 2);
			var triangleTop = y0 + Math.floor((arrowHeight - triangleHeight) / 2);
			
			for (var di = triangleMid; di >= 0; di--) {
				gfx.newPath();
				gfx.rectPath(triangleLeft + (triangleMid - di), triangleTop + di, 1, triangleHeight - 2 * di);
				gfx.fillPath(triangleBrush);
			}
		
			//draw down-arrow	
			gfx.newPath();
			fillRect = {left: w - arrowWidth, top: 0, width: arrowWidth, height: arrowHeight};
			bgGray = arrowBrush.color[0];
			startGray = bgGray , midGray = bgGray - .04, endGray = bgGray - .08; 
			theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			gfx.newPath();
			gfx.rectPath(w - arrowWidth, 0 , 1, arrowHeight);
			gfx.fillPath(arrowEdgeBrush);

			//draw up-triangle
			x0 = w - arrowWidth;
			y0 = 0;
			triangleLeft = x0 + Math.floor((arrowWidth - triangleWidth) / 2);
			triangleTop = y0 + Math.floor((arrowHeight - triangleHeight) / 2);
			
			for (var di = 0; di <= triangleMid; di++) {
				gfx.newPath();
				gfx.rectPath(triangleLeft + di, triangleTop + di, 1,  triangleHeight - 2 * di);
				gfx.fillPath(triangleBrush);
			}
		}
	} catch(e) {
		AOM.CS.Log.writeError("drawScrollbar():" + e);
	}
}



//draw statictext 
AOM.AOMUITheme.prototype.drawStaticText = function(drawingState) {	
	try {
		var theme = this.uiTheme;
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		var title = this.text;
        
        if (this.gsEnabled == undefined || this.gsEnabled == true) {
		  var textPen = theme.getPen(theme.color.foregroundColor);
		} else {
		  var textPen = theme.getPen(theme.color.gsDisableTextPen);
        }
		var textSize = gfx.measureString(title);
		var textX = (w - textSize.width) / 2;
		var textY = (h - textSize.height) / 2;
		gfx.drawString(title, textPen, textX, textY);
		
		//this.enabled = true;
	} catch(e) {
		AOM.CS.Log.writeError("drawStaticText():" + e);
	}
}

AOM.AOMUITheme.prototype.drawSPLine = function(drawingState) {
	var theme = this.uiTheme;
		
	var gfx = this.graphics;
	var w = this.size.width;
	var h = this.size.height;
	
	gfx.newPath();
	gfx.rectPath(0, 0, w, h);
	gfx.fillPath(theme.getBrush(theme.color.darkGrayBrush));
}


//draw open close button
AOM.AOMUITheme.prototype.drawDrawerOpenCloseButton = function(drawingState) {
	try {
		var theme = this.uiTheme;
		
		var btn = this;
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		
		//draw top border
		gfx.newPath();
		gfx.moveTo(-1, 0);
		gfx.lineTo(w, 0);
		gfx.lineTo(w, 1);
		gfx.lineTo(0, 1);
		gfx.closePath();
		btn.topBorderPath = gfx.currentPath;
			
		//draw top highlight border
		gfx.newPath();
		gfx.moveTo(-1, 1);
		gfx.lineTo(w, 1);
		gfx.lineTo(w, 2);
		gfx.lineTo(0, 2);
		gfx.closePath();
		btn.hltopBorderPath = gfx.currentPath;
			
		//draw bottom border
		gfx.newPath();
		gfx.moveTo(-1, h);
		gfx.lineTo(w, h);
		gfx.lineTo(w, h-1);
		gfx.lineTo(0, h-1);
		gfx.closePath();
		btn.bottomBorderPath = gfx.currentPath;
			
		//draw bottom highlight border
		gfx.newPath();
		gfx.moveTo(-1, h-1);
		gfx.lineTo(w, h-1);
		gfx.lineTo(w, h-2);
		gfx.lineTo(0, h-2);
		gfx.closePath();
		btn.hlbottomBorderPath = gfx.currentPath;
		
		//fill  rect
		gfx.newPath();
		var fillRect = {left:0, top:1, width:w, height:h};
		var bgGray = theme.getBrush(theme.color.middleGrayBrush).color[0];
		var startGray = bgGray , midGray = bgGray - .07, endGray = bgGray - .14;
		if (drawingState.mouseOver) {
			if (drawingState.leftButtonPressed) {
				startGray = bgGray - .05, midGray = bgGray - .12, endGray = bgGray - .17;
			} else {
				startGray = bgGray + .05, midGray = bgGray -.02, endGray = bgGray -.07 ;
			}
		}
		theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);
		
		var borderBrush = theme.getBrush(theme.color.darkGrayBrush);
		var highlightBrush = theme.getBrush(theme.color.highlightBrush);
		//add top border effect(real line and highlight line)
		gfx.fillPath(borderBrush, btn.topBorderPath);
		gfx.fillPath(highlightBrush, btn.hltopBorderPath);
		//add bottom border effect(real line and highlight line)
		gfx.fillPath(borderBrush, btn.bottomBorderPath);
		gfx.fillPath(highlightBrush, btn.hlbottomBorderPath);

		//add triangle
		var triangleHt = this.isOpen ? AOM.kTriWid : AOM.kTriHt;
		theme.drawDisclosureTriangle (this, 7, (h - triangleHt) / 2, this.isOpen);
			
		//add text
		var textPen = theme.getPen(theme.color.foregroundColor);
		var title = btn.text;
		var textSize = gfx.measureString (title);
		var textX = 20;
		var textY = (this.size.height - textSize.height) / 2;
		gfx.drawString (title, textPen, textX, textY);
	} catch(e) {
		AOM.CS.Log.writeError("drawOpenCloseButton():" + e);
	}
}


//draw color panle
AOM.AOMUITheme.prototype.drawColorPanel = function(drawingState) {
	try {
		var theme = this.uiTheme;
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		
		gfx.newPath();
		gfx.rectPath(1, 1, w-2, h-2);
		gfx.fillPath(this.graphics.customBgColor);
		
		gfx.newPath();
		gfx.rectPath(0, 0, w-1, h-1);
		gfx.strokePath(theme.getPen(theme.color.tintGrayPen));
	} catch(e) {
		AOM.CS.Log.writeError("drawColorPanel():" + e);
	}
}

//drop another drop down list
AOM.AOMUITheme.prototype.drawSelectionButton = function(drawingState) {	
	var theme = this.uiTheme;

	var gfx = this.graphics;
	var w = this.size.width;
	var h = this.size.height;
	
	var title = "";
	if (this.selection != null)
		title = this.selection.text;
		
	var kRectW = kRectH = h;
	var left = w - kRectW;
	var top = 0;
		
	//fill background
	gfx.newPath();
	gfx.moveTo(0, 0);
	gfx.lineTo(left, 0);
	gfx.lineTo(left, h);
	gfx.lineTo(0, h);
	gfx.closePath();
	gfx.fillPath(theme.getBrush(theme.color.blackBrush));
		
	//add text
	var textPen = theme.getPen(theme.color.foregroundColor);
	var textSize = gfx.measureString(title);
	var textX = 5;
	var textY = (h - textSize.height) / 2;
	gfx.drawString(title, textPen, textX, textY);
		
	//fill after kRectLeft 
	gfx.newPath();
	var fillRect = {left: left, top:1, width: w-left +1, height: h-2};
	var bgGray = theme.getBrush(theme.color.middleGrayBrush).color[0];
	var startGray = bgGray , midGray = bgGray - .07, endGray = bgGray - .14;
	if (drawingState.mouseOver) {
		if (drawingState.leftButtonPressed) {
			startGray = bgGray - .05, midGray = bgGray - .12, endGray = bgGray - .17;
		} else {
			startGray = bgGray + .05, midGray = bgGray -.02, endGray = bgGray -.07 ;
		}
	}
	theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);
		
	//draw after kRectLeft border line
	gfx.newPath();
	gfx.moveTo(left, 0);
	gfx.lineTo(w-1, 0);
	//gfx.lineTo(w-1, 1);
	gfx.lineTo(w-1, h-1);
	//gfx.lineTo(w-2, h-1);
	gfx.lineTo(left, h-1);
	gfx.strokePath(theme.getPen(theme.color.darkGrayPen));
		
	//add triangle shape
	var triangleHt = AOM.kTriWid;
	theme.drawDisclosureTriangle(this, w-15, (h-triangleHt) / 2, true);		
}


AOM.AOMUITheme.prototype.drawSaveAsButton = function(drawingState) {
	try {
		var theme = this.uiTheme;
		
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		var title = this.text;
		
		gfx.newPath();
		gfx.rectPath(0, 0, w, h);
		gfx.fillPath(theme.getBrush(theme.color.backgroundColor));

		//draw border line
		gfx.newPath();
		gfx.moveTo(1, 0); gfx.lineTo(w-1, 0);
		gfx.lineTo(w, 2); gfx.lineTo(w, h-2);
		gfx.lineTo(w-2, h); gfx.lineTo(2, h);
		gfx.lineTo(0, h-2); gfx.lineTo(0, 2);
		gfx.closePath();
		gfx.fillPath(theme.getBrush(theme.color.saveBtnBrush));

		//add text
		var textPen =theme.getPen(theme.color.foregroundColor)
		var textSize = gfx.measureString(title);
		var textX = (w - textSize.width) / 2;
		var textY = (h - textSize.height) / 2;
		gfx.drawString(title, textPen, textX, textY);		
	} catch(e) {
		AOM.CS.Log.writeError("drawSaveAsButton():" + e);
	}
}


//draw text button
AOM.AOMUITheme.prototype.drawTextButton = function(drawingState) {
	try{
		var theme = this.uiTheme;
			
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		var title = this.text;

		if (this.gsEnabled == undefined || this.gsEnabled == true) {
			gfx.newPath();
			gfx.rectPath(0, 0, w, h);
			gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
			
			//draw border line
			gfx.newPath();
			gfx.moveTo (1, 0); gfx.lineTo (w-1, 0);
			gfx.lineTo (w, 2); gfx.lineTo (w, h-2);
			gfx.lineTo (w-2, h); gfx.lineTo (2, h);
			gfx.lineTo (0, h-2); gfx.lineTo (0, 2);
			
			gfx.closePath();
			gfx.fillPath(theme.getBrush(theme.color.darkGrayBrush));
			
			//fill the button
			gfx.newPath();
			var fillRect = {left:1, top:1, width:w-2, height:h- 2};
			var bgGray = theme.getBrush(theme.color.middleGrayBrush).color[0];
			var startGray = bgGray , midGray = bgGray - .07, endGray = bgGray - .14;
			if (drawingState.mouseOver) {
				if (drawingState.leftButtonPressed) {
					startGray = bgGray - .05, midGray = bgGray - .12, endGray = bgGray - .17;
				} else {
					startGray = bgGray + .05, midGray = bgGray -.02, endGray = bgGray -.07 ;
				}
			}
			theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);

			//add text
			var textPen = theme.getPen(theme.color.foregroundColor);
			var textSize = gfx.measureString(title);
			var textX = (w - textSize.width) / 2;
			var textY = (h - textSize.height) / 2;
			gfx.drawString(title, textPen, textX, textY);
		} else {
			gfx.newPath();
			gfx.rectPath(0, 0, w, h);
			gfx.fillPath(theme.getBrush(theme.color.gsDisableBrush));
			gfx.newPath();
			gfx.rectPath(1, 1, w-2, h-2);
			gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
			
			var disableTextPen = theme.getPen(theme.color.gsDisableTextPen);
			var textSize = gfx.measureString(title);
			var textX = (w - textSize.width) / 2;
			var textY = (h - textSize.height) / 2;
			gfx.drawString(title, disableTextPen, textX, textY);
		}
	} catch(e) {
		AOM.CS.Log.writeError("drawTextButton():" + e);
	}
}

//add an swap image button
AOM.AOMUITheme.prototype.drawSwapImageButton = function(drawingState) {
	try {
		var theme = this.uiTheme;
		
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		
		var normalImagePath = this.normalImagePath;
		var rolloverImagePath = this.rolloverImagePath;
		var disableImagePath = this.disableImagePath;
		gfx.newPath();
		gfx.rectPath(0, 0, w, h);
		gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
		
		var imagePath = normalImagePath;
		if (this.enabled == undefined || this.enabled == true) {
		    if (drawingState.mouseOver) {
                imagePath = rolloverImagePath;
	       	} else if (drawingState.hasFocus) {
		      	imagePath = rolloverImagePath;
	       	}
        } else {
			imagePath = disableImagePath;
		}

		var image = ScriptUI.newImage(imagePath);
		var imageX = (w - image.size.width) / 2;
		var imageY = (h - image.size.height) / 2 + 2;
		gfx.drawImage(image, imageX, imageY);
	} catch(e) {
		AOM.CS.Log.writeError("drawSwapImageButton():" + e);
	}
}


//Add an image button
AOM.AOMUITheme.prototype.drawImageButton = function(drawingState) {
	try {
		var theme = this.uiTheme;
		
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		var title = this.text;
		var imagePath = this.imagePath;
		
		gfx.newPath();
		gfx.rectPath(0, 0, w, h);
		gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
			
		if (this.btPressed) {
			//draw the border line
			gfx.newPath();
			gfx.moveTo(1, 0); gfx.lineTo(w-1, 0);
			gfx.lineTo(w, 2); gfx.lineTo(w, h-2);
			gfx.lineTo(w-2, h); gfx.lineTo(2, h);
			gfx.lineTo(0, h-2); gfx.lineTo(0, 2);
			gfx.closePath();
			gfx.fillPath(theme.getBrush(theme.color.darkGrayBrush));
			
			//fill the button
			gfx.newPath();
			var fillRect = {left:1, top:1, width:w-2, height:h-2};
			var bgGray = theme.getBrush(theme.color.middleGrayBrush).color[0];
			var startGray = bgGray , midGray = bgGray - .07, endGray = bgGray - .14;
			if (drawingState.mouseOver) {
				if (drawingState.leftButtonPressed) {
					startGray = bgGray - .05, midGray = bgGray - .12, endGray = bgGray - .17;
				} else {
					startGray = bgGray + .05, midGray = bgGray -.02, endGray = bgGray -.07 ;
				}
			}
			theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);

			//add image and text on the button
			if (title == "") {
				//add image
				var image = ScriptUI.newImage(imagePath);
				var imageX = (w - image.size.width) / 2;
				var imageY = (h - image.size.height) / 2;
				gfx.drawImage(image, imageX, imageY);
				var imageWidth = image.size.width;
			} else {
				//add image
				var image = ScriptUI.newImage(imagePath);
				var textPen = theme.getPen(theme.color.foregroundColor);
				var textSize = gfx.measureString(title);
				
				var offset = (w - (image.size.width + textSize.width + 5)) / 2;
				gfx.drawImage(image, offset, 5);
					
				//add text on the button
				var textX = offset + image.size.width + 5;
				var textY = (h - textSize.height) / 2;
				gfx.drawString(title, textPen, textX, textY);
			}
		} else {
			//add image and text on the button
			if (title == "") {
				var image = ScriptUI.newImage(imagePath);
				var imageX = (w - image.size.width) / 2;
				var imageY = (h - image.size.height) / 2;
				gfx.drawImage(image, imageX, imageY);
				var imageWidth = image.size.width;
			} else {
				var image = ScriptUI.newImage(imagePath);
				var textPen = theme.getPen(theme.color.foregroundColor);
				var textSize = gfx.measureString(title);
				
				var offset = (w - (image.size.width + textSize.width + 5)) / 2;
				gfx.drawImage(image, offset,5);
					
				var textX = offset + image.size.width + 5;
				var textY = (h - textSize.height) / 2;
				gfx.drawString(title, textPen, textX, textY);
			}
		}
	} catch(e) {
		AOM.CS.Log.writeError("drawImageButton():" + e);
	}
}

//draw radiobutton
AOM.AOMUITheme.prototype.drawRadioButton = function(drawingState) {
	try {
		var theme = this.uiTheme;
		
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		var title = this.text;
		
		gfx.newPath();
		gfx.rectPath(0, 0, w, h);
		gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
		
		if (this.gsEnabled == undefined || this.gsEnabled == true) {
			if (File.fs == "Macintosh") {
				var kBoxWid = kBoxHt = 12;
				var x0 = 1, y0 = 2;
				//stroke outline
				gfx.newPath();
				gfx.ellipsePath(x0, y0, kBoxWid, kBoxHt);
				gfx.strokePath(theme.getPen(theme.color.blackPen));
				//fill
				var startGray = theme.getBrush(theme.color.middleGrayBrush).color[0];
				var dotGray = theme.getPen(theme.color.foregroundColor).color[0];
				
				gfx.newPath();
				gfx.rectPath(x0 + 4, y0 + 1, 4, 1);
				gfx.fillPath(theme.getBrush(startGray));
				
				startGray = startGray - 0.01;
				gfx.newPath();
				gfx.rectPath(x0 + 2, y0 + 2, 8, 1);
				gfx.fillPath(theme.getBrush(startGray));
				
				for (var i = 0; i < 6; i++) {
					startGray = startGray - 0.01;
					gfx.newPath();
					if (i % 5 == 0) {
						gfx.rectPath(x0 + 2, y0 + 3 + i, 8, 1);
					} else {
						gfx.rectPath(x0 + 1, y0 + 3 + i, 10, 1);
					}
					gfx.fillPath(theme.getBrush(startGray));
				}
			
				startGray = startGray - 0.01;
				gfx.newPath();
				gfx.rectPath(x0 + 2, y0 + 9, 8, 1);
				gfx.fillPath(theme.getBrush(startGray));
				
				startGray = startGray - 0.01;
				gfx.newPath();
				gfx.rectPath(x0 + 4, y0 + 10, 4, 1);
				gfx.fillPath(theme.getBrush(startGray));
				//draw dot
				if (this.value) {
					gfx.newPath();
					gfx.rectPath(x0 + 4, y0 + 5,  4, 2);
					gfx.fillPath(theme.getBrush(dotGray));
					gfx.newPath();
					gfx.rectPath(x0 + 5, y0 + 4,  2, 4);
					gfx.fillPath(theme.getBrush(dotGray));
				}
				//add text
				var textPen = theme.getPen(theme.color.foregroundColor);
				var textSize = gfx.measureString (title);
				var textX = x0 + kBoxWid + 3;  //3 is spacing
				var textY = y0 + ((kBoxHt - textSize.height) / 2) - 1;
				gfx.drawString (title, textPen, textX, textY);
			} else {
				var kBoxWid = kBoxHt = 11;
				var x0 = 1, y0 = 2;
				
				//stroke outline
				gfx.newPath();
				gfx.ellipsePath(x0, y0, kBoxWid, kBoxHt);
				gfx.strokePath(theme.getPen(theme.color.blackPen));
			
				//fill
				var startGray = theme.getBrush(theme.color.middleGrayBrush).color[0];
				var dotGray = theme.getPen(theme.color.foregroundColor).color[0];
				
				gfx.newPath();
				gfx.rectPath(x0 + 4, y0 + 1, 4, 1);
				gfx.fillPath(theme.getBrush(startGray));
			
				for (var i = 0; i < 2; i++) {
					startGray = startGray - 0.01;
					gfx.newPath();
					gfx.rectPath(x0 + 2, y0 + 2 + i, 8, 1);
					gfx.fillPath(theme.getBrush(startGray));
				}
				for (var i = 0; i < 4; i++) {
					startGray = startGray - 0.02;
					gfx.newPath();
					gfx.rectPath(x0 + 1, y0 + 4 + i, 10, 1);
					gfx.fillPath(theme.getBrush(startGray));
				}
				for (var i = 0; i < 2; i++) {
					startGray = startGray - 0.01;
					gfx.newPath();
					gfx.rectPath(x0 + 2, y0 + 8 + i, 8, 1);
					gfx.fillPath(theme.getBrush(startGray));
				}
				startGray = startGray - 0.01;
				gfx.newPath();
				gfx.rectPath(x0 + 4, y0 + 10, 4, 1);
				gfx.fillPath(theme.getBrush(startGray));
				
				//draw dot
				if (this.value) {
					gfx.newPath();
					gfx.rectPath(x0 + 4, y0 + 5,  4, 2);
					gfx.fillPath(theme.getBrush(dotGray));
					gfx.newPath();
					gfx.rectPath(x0 + 5, y0 + 4,  2, 4);
					gfx.fillPath(theme.getBrush(dotGray));
				}
			
				//add text
				var textPen = theme.getPen(theme.color.foregroundColor);
				var textSize = gfx.measureString (title);
				var textX = x0 + kBoxWid + 3;  //3 is spacing
				var textY = y0 + ((kBoxHt - textSize.height) / 2) - 1;
				gfx.drawString (title, textPen, textX, textY);
			}
		} 
	} catch(e) {
		AOM.CS.Log.writeError("drawRadioButton():" + e);
	}
}

//drawCheckbox
AOM.AOMUITheme.prototype.drawCheckbox  = function(drawingState) {
	try {
		var theme = this.uiTheme;
			
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		var title = this.text;
			
		var kBoxWid = 13, kBoxHt = kBoxWid;
		
		//	Erase the background 
		gfx.newPath();
		gfx.rectPath (0, 0, w, h);
		gfx.fillPath (theme.getBrush (theme.color.backgroundColor));
		
		if (this.gsEnabled == undefined || this.gsEnabled == true) {
			//draw border line
			gfx.newPath();
			gfx.moveTo(1, 0); gfx.lineTo(kBoxWid-1, 0);
			gfx.lineTo(kBoxWid, 2); gfx.lineTo(kBoxWid, kBoxHt-2);
			gfx.lineTo(kBoxWid-2, kBoxHt); gfx.lineTo(2, kBoxHt);
			gfx.lineTo(0, kBoxWid-2); gfx.lineTo(0, 2);
			gfx.closePath();
			gfx.fillPath(theme.getBrush(theme.color.darkGrayBrush));
			
			//fill the button
			gfx.newPath();
			var fillRect = {left:1, top:1, width:kBoxWid-2, height:kBoxHt- 2};
			var bgGray = theme.getBrush(theme.color.middleGrayBrush).color[0];
			var startGray = bgGray , midGray = bgGray - .07, endGray = bgGray - .14;
			if (drawingState.mouseOver) {
				if (drawingState.leftButtonPressed) {
					startGray = bgGray - .05, midGray = bgGray - .12, endGray = bgGray - .17;
				} else {
					startGray = bgGray + .05, midGray = bgGray -.02, endGray = bgGray -.07 ;
				}
			}
			theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			//if is checked
			if (this.value) {
				gfx.newPath();
				gfx.moveTo (2, 5);
				gfx.lineTo (6, 9);
				gfx.lineTo (10, 2);
				gfx.strokePath (theme.getPen(theme.color.hookPen));
			}
			
			//add text
			var textPen = theme.getPen(theme.color.foregroundColor);
			var textSize = gfx.measureString (title);
			var textX = kBoxWid + 3;  //3 is spacing
			var textY = ((kBoxHt - textSize.height) / 2) - 1;
			gfx.drawString (title, textPen, textX, textY);
		} else {
			var disablePen = theme.getPen(theme.color.gsDisablePen);
			var disableTextPen = theme.getPen(theme.color.gsDisableTextPen);
			
			gfx.newPath();
			gfx.rectPath(0, 0, kBoxWid, kBoxHt );
			gfx.fillPath(theme.getBrush(theme.color.gsDisableBrush));
			gfx.newPath();
			gfx.rectPath(1, 1, kBoxWid-2, kBoxHt-2);
			gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
			
			//if is checked
			if (this.value) {
				gfx.newPath();
				gfx.moveTo (2, 5);
				gfx.lineTo (6, 9);
				gfx.lineTo (10, 2);
				gfx.strokePath (theme.getPen(theme.color.gsDisableBoldPen));
			}
			
			var textSize = gfx.measureString (title);
			var textX = kBoxWid + 3;  //3 is spacing
			var textY = ((kBoxHt - textSize.height) / 2) - 1;
			gfx.drawString (title, disableTextPen, textX, textY);
		}
	} catch(e) {
		AOM.CS.Log.writeError("drawCheckbox():" + e);
	}
}


//draw DropDownList
AOM.AOMUITheme.prototype.drawDropDownList = function(drawingState)
{
	try{
		var theme = this.uiTheme;
		if (theme == undefined) { return;}
			
		var gfx = this.graphics;
		var w = this.size.width;
		var h = this.size.height;
		var title = "";
		if (this.selection != undefined || this.selection != null) {
			title = this.selection.text;
		}
	
		//draw before kRectLeft border line
		if (this.gsEnabled == undefined || this.gsEnabled == true) {
			gfx.newPath();
			gfx.rectPath(0, 0, w, h);
			gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
	
			gfx.newPath();
			gfx.moveTo(1, 0); gfx.lineTo(w-1, 0);
			gfx.lineTo(w, 2); gfx.lineTo(w, h-2);
			gfx.lineTo(w-2, h); gfx.lineTo(2, h);
			gfx.lineTo(0, h-2); gfx.lineTo(0, 2);
			gfx.closePath();
			gfx.fillPath (theme.getBrush (theme.color.darkGrayBrush));

			gfx.newPath();
			var fillRect = {left: 1, top:1, width: w-2, height: h-2};
			var bgGray = theme.getBrush(theme.color.middleGrayBrush).color[0];
			var startGray = bgGray , midGray = bgGray - .07, endGray = bgGray - .14;
			if (drawingState.mouseOver) {
				if (drawingState.leftButtonPressed) {
					startGray = bgGray - .05, midGray = bgGray - .12, endGray = bgGray - .17;
				} else {
					startGray = bgGray + .05, midGray = bgGray -.02, endGray = bgGray -.07 ;
				}
			}
			theme.gradientFillPath(gfx, fillRect, startGray, midGray, endGray);
			
			//draw text
			if (this.selectionTextSuffix != undefined) {
				title += this.selectionTextSuffix;
			}
			var textPen = theme.getPen(theme.color.foregroundColor);
			var textSize = gfx.measureString(title);	
			title = theme.getTruncatedTitle(title, textSize.width, (w - h - 1), gfx);
			var textX = 5;
			var textY = (h - textSize.height) / 2;                                           
			gfx.drawString(title, textPen, textX, textY);
		} else {
			gfx.newPath();
			gfx.rectPath(0, 0, w, h);
			gfx.fillPath(theme.getBrush(theme.color.gsDisableBrush));
			gfx.newPath();
			gfx.rectPath(1, 1, w-2, h-2);
			gfx.fillPath(theme.getBrush(theme.color.backgroundColor));
		}
		
		var triangleHt = AOM.kTriWid;
		theme.drawDisclosureTriangle(this, w-15, (h-triangleHt) / 2, true, this.gsEnabled);
	} catch(e) {
		AOM.CS.Log.writeError("drawDropDownList() throw an exception:" + e);
	}
}


//add an triangle shape
AOM.AOMUITheme.prototype.drawDisclosureTriangle = function(element, x, y, open, gsEnabled) {
	var gfx = element.graphics; 
	var highlightPen = this.getPen(this.color.trianglePen); 
	
	var bgBrush;
	if (gsEnabled == undefined || gsEnabled == true) {
		bgBrush = this.getBrush(this.color.triangleBrush);
	} else {
		//gsDisable = true;
		bgBrush = this.getBrush(this.color.gsDisableTriangleBrush);
	}
	
	var w, h;
	if (open) {
		x = Math.floor(x);
		y = Math.floor(y);
		
		var left = x + 1;
		var mid = left + Math.floor(AOM.kTriHt / 2);
		var right = left + AOM.kTriHt ;
		var top = y + 1;
		var bottom = top + AOM.kTriWid +1 ;
		
		gfx.newPath();
		gfx.moveTo(left, top);
		gfx.lineTo(right, top);
		gfx.lineTo(mid, bottom);
		gfx.closePath();
		gfx.fillPath(bgBrush);
		
		//add an highline
		gfx.newPath();
		gfx.moveTo(right, top);
		gfx.lineTo(mid, bottom);
		gfx.strokePath(highlightPen);
		
		gfx.newPath();
		gfx.moveTo(mid, bottom);
		gfx.lineTo(left, top);
		gfx.strokePath(highlightPen);
				
	} else {
		x = Math.floor(x);
		y = Math.floor(y);

		var left = x + 1;
		var top = y + 1;
		var bottom = left + AOM.kTriHt;
		var mid = left + (AOM.kTriHt / 2)  - 1;
		var right = top + AOM.kTriWid + 1;
		
		gfx.newPath();
		gfx.moveTo(left, top);
		gfx.lineTo(right, mid);
		gfx.lineTo(left, bottom);
		gfx.closePath();
		gfx.fillPath(bgBrush);
		
		//add an highline
		gfx.newPath();
		gfx.moveTo(left, top);
		gfx.lineTo(right, mid);
		gfx.strokePath(highlightPen);
		
		gfx.newPath();
		gfx.moveTo(right, mid);
		gfx.lineTo(left, bottom);
		gfx.strokePath(highlightPen);
	}
}


AOM.AOMUITheme.prototype.vgradientFillPath = function(gfx, pathRect, startGray, midGray, endGray) {
	var left = pathRect.left;
	var top = pathRect.top;
	var right = left + pathRect.width;
	var bottom = top + pathRect.height;
	
	var nShadesToMid = pathRect.width / 2;
		
	var line, shade, gray;
	var deltaGray = (midGray - startGray) / nShadesToMid;
	
	for (line = left, shade = 0, gray = startGray; line < right; line++, shade++) {
		gfx.newPath();
		gfx.moveTo(line, top);
		gfx.lineTo(line, bottom);
		gfx.lineTo(line+1, bottom);
		gfx.lineTo(line+1, top);
		gfx.closePath();
		
		gfx.fillPath(this.getBrush(gray));
		
		if (shade == nShadesToMid) {
			deltaGray = (endGray - midGray) / nShadesToMid;
			gray = midGray;
		} else {
			gray += deltaGray;
		}
	}
}


AOM.AOMUITheme.prototype.gradientFillPath = function(gfx, pathRect, startGray, midGray, endGray)
{
	midGray = (midGray > 1) ? 1 : midGray;
	midGray = (midGray < 0) ? 0 : midGray;
	endGray = (endGray > 1) ? 1 : endGray;
	endGray = (endGray < 0) ? 0 : endGray;
	
	var left = pathRect.left;
	var top = pathRect.top;
	var right = left + pathRect.width;
	var bottom = top + pathRect.height;
	
	var nShadesToMid = pathRect.height / 2;
	
	var line, shade, gray;
	var deltaGray = (midGray - startGray) / nShadesToMid;
	
	for (line = top, shade = 0, gray = startGray; line < bottom; line++, shade++) {
		gfx.newPath();
		gfx.moveTo(left, line);
		gfx.lineTo(right, line);
		gfx.lineTo(right, line+1);
		gfx.lineTo(left, line + 1);
		gfx.closePath();
		
		gfx.fillPath (this.getBrush(gray));
		
		if (shade == nShadesToMid) {
			deltaGray = (endGray - midGray) / nShadesToMid;
			gray = midGray + deltaGray;
		} else {
			gray += deltaGray;
		}
	}
}

AOM.AOMUITheme.prototype.trianglePath= function(gfx, x, y, length, orientation) {
	//make sure length is odd number
	if( (length & 1) == 0) length = length + 1; 
				
	var mid = Math.floor(length / 2);
	var newPath = gfx.newPath();	
				
	switch(orientation) {
		case "left" :
			for (var di = 0; di <= mid; di++) {
				gfx.rectPath(x+ di,y + di, 1,  length - 2 * di);
			}
			break;
		case "right": 
			for (var di = mid; di >= 0; di--) {
				gfx.rectPath(x + (mid - di), y + di, 1, length - 2 * di);
			}
			break;
		case "bottom" :
			for (var di = 0; di <= mid; di++) {
				gfx.rectPath(x + di, y + di, length - 2 * di, 1);
			}
			break;
		case "top" :
			for (var di = mid; di >= 0; di--) {
				gfx.rectPath(x+ (mid - di), y + di, length - 2 * (mid - di), 1);
			}
			break;
		default :
			break;
	}
}
