﻿
/*************************************************************************
*
* ADOBE CONFIDENTIAL
* ___________________
*
*  Copyright 2011 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: $
*
* Adobe Output Module 4.0
*
* MediaGallery Originally Written by Quality Process Incorporated, Enhanced by
* Adobe Systems China. Contact Sheet written by Adobe Systems China.
* 
*
**************************************************************************/


/**
 *  Define SysFontGroupHelper Class
 */
AOM.SysFontGroupHelper = function(group, userInput, isLazyInitialized, document) {
	this.createObject(group, userInput, isLazyInitialized);
	this.document = document;
}

/**
 *  SysFontGroupHelper constant definition.
 */
AOM.SysFontGroupHelper.COLOR_BLACK = "Black";
AOM.SysFontGroupHelper.COLOR_WHITE = "White";
AOM.SysFontGroupHelper.COLOR_RED = "Red";
AOM.SysFontGroupHelper.COLOR_YELLOW = "Yellow";
AOM.SysFontGroupHelper.COLOR_GREEN = "Green";
AOM.SysFontGroupHelper.COLOR_CYAN = "Cyan";
AOM.SysFontGroupHelper.COLOR_BLUE = "Blue";
AOM.SysFontGroupHelper.COLOR_MAGENTA = "Magenta";
AOM.SysFontGroupHelper.COLOR_CUSTOM = "Custom";
AOM.SysFontGroupHelper.DEFAULT_BASE_SPACING = 6;
AOM.SysFontGroupHelper.DEFAULT_BASE_SIZE = [180, 22];
AOM.SysFontGroupHelper.DEFAULT_MIN_FONTSIZE = 4;
AOM.SysFontGroupHelper.DEFAULT_MAX_FONTSIZE = 240;
AOM.SysFontGroupHelper.DEFAULT_FONT_FAMILY = "Arial";
AOM.SysFontGroupHelper.DEFAULT_FONT_FACE = "Regular";
AOM.SysFontGroupHelper.DEFAULT_FONT_SIZE = "10";
AOM.SysFontGroupHelper.DEFAULT_FONT_COLOR = "Black";
AOM.SysFontGroupHelper.DEFAULT_FONT_COLOR_PICKER = "[0,0,0]";
AOM.SysFontGroupHelper.FONT_FACE = "FontFace";
AOM.SysFontGroupHelper.FONT_FAMILY = "FontFamily";
AOM.SysFontGroupHelper.FONT_SIZE = "FontSize";
AOM.SysFontGroupHelper.FONT_COLOR = "FontColor";
AOM.SysFontGroupHelper.FONT_COLOR_PICKER = "FontColorPicker";
AOM.SysFontGroupHelper.FONT_COLOR_TITLE = "$$$/ContactSheet/javascript/title/fontColor=Color:";
AOM.SysFontGroupHelper.UNIT_POINTS_ABBR = "$$$/ContactSheet/javascript/abbreviation/points=pt";


AOM.SysFontGroupHelper.fontGroupList = new Array();

AOM.SysFontGroupHelper.removeFontGroupForDocument = function(document)
{
	var newList = new Array();
	for(var i = 0; i < AOM.SysFontGroupHelper.fontGroupList.length; ++i) {
		var current = AOM.SysFontGroupHelper.fontGroupList[i];
		if(current.document != document)
			newList.push(current);
	}
	AOM.SysFontGroupHelper.fontGroupList = newList;
}

AOM.SysFontGroupHelper.DEFAULT_COLOR_LIST =
[
	{
		value: AOM.SysFontGroupHelper.COLOR_BLACK,
		text: AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgBlack=Black"),
		color: [0, 0, 0]
	},
	{
		value: AOM.SysFontGroupHelper.COLOR_WHITE,
		text:AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgWhite=White"),
		color: [1, 1, 1]
	},
	{
		value: AOM.SysFontGroupHelper.COLOR_RED,
		text:AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgRed=Red"),
		color: [1, 0, 0]
	},
	{
		value: AOM.SysFontGroupHelper.COLOR_YELLOW,
		text:AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgYellow=Yellow"),
		color: [1, 1, 0]
	},
	{
		value: AOM.SysFontGroupHelper.COLOR_GREEN,
		text:AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgGreen=Green"),
		color: [0, 1, 0]
	},
	{
		value: AOM.SysFontGroupHelper.COLOR_CYAN,
		text:AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgCyan=Cyan"),
		color: [0, 1, 1]
	},
	{
		value: AOM.SysFontGroupHelper.COLOR_BLUE,
		text:AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgBlue=Blue"),
		color: [0, 0, 1]
	},
	{
		value: AOM.SysFontGroupHelper.COLOR_MAGENTA,
		text:AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgMagenta=Magenta"),
		color: [1, 0, 1]
	},
	{
		value: AOM.SysFontGroupHelper.COLOR_CUSTOM,
		text:AOM.localize("$$$/ContactSheet/javascript/dropdownlist/bgCustom=Custom")
	}
];

/**
 *  SysFontGroupHelper class functions.
 */
AOM.SysFontGroupHelper.getSysFontFamilyList = function() {
	if (AOM.SysFontGroupHelper.sysFontFamilyList == undefined) {
		var sysFontFamilyList = AOM.PDFGenerator.getSystemFontFamilies(); 
		if (sysFontFamilyList != undefined) {
			AOM.SysFontGroupHelper.sysFontFamilyList = sysFontFamilyList.sort();
		}
	}
	return AOM.SysFontGroupHelper.sysFontFamilyList;
}

/**
 *  Remove a font family or a font face from the AOM system font list. If the
 *  system font list has not yet been intialized, the function initialize it
 *  first and then ensure the deleted font family is not included, and at last
 *  remove all lazy-initializer from the font family/face dropdown list.
 *
 *  Parameter:
 *      family   The font family to be deleted. Value "undefined" is passed if
 *               only a font face is deleted but the belonged family still available.
 */
AOM.SysFontGroupHelper.removeItemFromSysFontFamilyList = function(family) {
	if(family) {
		// Remove the unavailable family from the in-memory system font
		// family list. We do this rather than refresh the whole list
		// through CoolType.
		
		// Initialize the in-memory list if it is not yet done through CoolType.	
		var sysFontFamilyList = AOM.SysFontGroupHelper.getSysFontFamilyList();
		
		// Remove the family on-question by a conditional copy.
		var newList = new Array();
		for(var i = 0; i < sysFontFamilyList.length; ++i) {
			var currentFamily = sysFontFamilyList[i];
			currentFamily = currentFamily.split("|||")[1];
			if(currentFamily != family)
				newList.push(currentFamily);
		}
		AOM.SysFontGroupHelper.sysFontFamilyList = newList;
	}
	
	for(var i = 0; i < AOM.SysFontGroupHelper.fontGroupList.length; ++i) {
		var current = AOM.SysFontGroupHelper.fontGroupList[i];
		var fontFamily = current.targetGroup.familyGroup.fontFamily;
		var fontFace = current.targetGroup.familyGroup.fontFace;
		
		current.loadSysFontsList(fontFamily, fontFace);
		fontFamily.removeEventListener("mousedown", AOM.SysFontGroupHelper.lazyLoadFontFamilyList);
		fontFamily.removeEventListener("keydown", AOM.SysFontGroupHelper.lazyLoadFontFamilyList);
		fontFace.removeEventListener("mousedown", AOM.SysFontGroupHelper.lazyLoadFontFaceList);
		fontFace.removeEventListener("keydown", AOM.SysFontGroupHelper.lazyLoadFontFaceList);
	}
}


AOM.SysFontGroupHelper.getSysFontFaceList = function(family) {
	if (family == undefined)  return undefined;
	var faces = AOM.PDFGenerator.getSystemFontFaces(family);
	if (faces == undefined) {
		return faces;
	} else {
		return faces.sort();
	}
}

AOM.SysFontGroupHelper.isEmptySysFontFamilyList = function() {
	if (AOM.SysFontGroupHelper.sysFontFamilyList == undefined) {
		return true;
	} else {
		return false;
	}
}

AOM.SysFontGroupHelper.lazyLoadFontFamilyList = function(event) {
	var fontFamily = event.target;
	var fontFace = fontFamily.parent.fontFace;
	
	AOM.SysFontGroupHelper.lazyLoadSysFontsList(event, fontFamily, fontFace);
}

AOM.SysFontGroupHelper.lazyLoadFontFaceList = function(event) {
	var fontFace = event.target;
	var fontFamily = fontFace.parent.fontFamily;
	
	AOM.SysFontGroupHelper.lazyLoadSysFontsList(event, fontFamily, fontFace);
}

AOM.SysFontGroupHelper.lazyLoadSysFontsList = function(event, fontFamily, fontFace) {
	/*
	 * Workaround. 
	 * When fontFamily or fontFace is disabled, the mouse down event is still triggered on Mac.
	 */
	if (!(fontFamily.enabled && fontFace.enabled)) {
		return;
	}

	//set status description.
	var currentDocument = app.document;
	currentDocument.status = AOM.localize("$$$/ContactSheet/javascript/lazyLoadSysFont=Loading system fonts ...");
	
	//load fontFamilyList and fontFaceList into controls items.
	var defaultSelectedFamily = undefined;
	if (fontFamily.selection) { defaultSelectedFamily = fontFamily.selection.value; }
	var familyList = AOM.SysFontGroupHelper.getSysFontFamilyList();
	var selectedFamily = AOM.CS.UIUtils.setDropDownList(fontFamily, familyList, defaultSelectedFamily, true, true);
	var defaultSelectedFace = undefined;
	if (fontFace.selection) { defaultSelectedFace = fontFace.selection.value;}
	var faceList =AOM.SysFontGroupHelper.getSysFontFaceList(selectedFamily);
	AOM.CS.UIUtils.setDropDownList(fontFace, faceList, defaultSelectedFace, true, true);
	
	/*
	 * Fix a bug:System use the default font which is not exist to generate PDF.
	 * If the loaded system font list didn't include the default font, 
	 * the selected item will be changed to the first item.
	 * Need to persist the new selected font item.
	 * 
	 */
	fontFamily.lazyUserInput.setElement(fontFamily);
	fontFamily.lazyUserInput.setElement(fontFace);
	
	
	//if sysfont load successfully, reset status description.
	currentDocument.status = "";
	fontFamily.lazyUserInput = undefined;
	fontFamily.removeEventListener("mousedown", AOM.SysFontGroupHelper.lazyLoadFontFamilyList);
	fontFamily.removeEventListener("keydown", AOM.SysFontGroupHelper.lazyLoadFontFamilyList);
	fontFace.removeEventListener("mousedown", AOM.SysFontGroupHelper.lazyLoadFontFaceList);
	fontFace.removeEventListener("keydown", AOM.SysFontGroupHelper.lazyLoadFontFaceList);
}

AOM.SysFontGroupHelper.loadSysFontSizeList = function(fontSize, selectedValue) {
	if (AOM.SysFontGroupHelper.sysFontSizeList == undefined) {
		AOM.SysFontGroupHelper.sysFontSizeList = 
			[
				{value:"4", text:"4"},
				{value:"6", text:"6"},
				{value:"8", text:"8"},
				{value:"9", text:"9"},
				{value:"10", text:"10"},
				{value:"11", text:"11"},
				{value:"12", text:"12"},
				{value:"14", text:"14"},
				{value:"16", text:"16"},
				{value:"18", text:"18"},
				{value:"20", text:"20"},
				{value:"22", text:"22"},
				{value:"24", text:"24"},
				{value:"26", text:"26"},
				{value:"28", text:"28"},
				{value:"36", text:"36"},
				{value:"48", text:"48"},
			];
	}
	AOM.CS.UIUtils.setDropDownList(fontSize, AOM.SysFontGroupHelper.sysFontSizeList, selectedValue, true);
}


AOM.SysFontGroupHelper.loadSysFontColorList = function(fontColor, selectedValue) {
	AOM.CS.UIUtils.setDropDownList(fontColor, AOM.SysFontGroupHelper.DEFAULT_COLOR_LIST, selectedValue, true);
}

AOM.SysFontGroupHelper.isEmptyString = function(str){
	if (str == undefined || str == "undefined" || str.length == 0) {
		return true;
	} else {
		return false;
	}
}


/**
 * SysFontGroupHelper Object Functions.
 *     Public functions
 */
AOM.SysFontGroupHelper.prototype.createObject = function(group, userInput, isLazyInitialized) {
	this.baseAlignment = group.alignChildren;
	this.baseEnabled = group.enabled;
	this.baseSpacing = AOM.SysFontGroupHelper.DEFAULT_BASE_SPACING;
	if (group.basePreferredSize == undefined) {
		this.basePreferredSize = AOM.SysFontGroupHelper.DEFAULT_BASE_SIZE;
	} else {
		this.basePreferredSize = group.basePreferredSize;
	}
	this.baseName = group.name;
	if (group.isApplyFSSlider == undefined) {
		this.isApplyFSSlider = false;
	} else {
		this.isApplyFSSlider = group.isApplyFSSlider;
	}
	if (group.colorTitle == undefined) {
		this.fontColorTitle = AOM.SysFontGroupHelper.FONT_COLOR_TITLE;
	} else {
		this.fontColorTitle = group.colorTitle;
	}
	this.isLazyInitialized = isLazyInitialized;
	this.targetGroup = group;
	this.userInput = userInput;
	this.container= {};
}

AOM.SysFontGroupHelper.prototype.createUI = function() {
	this.addFont();
	this.addFontSize();
	this.addFontColor();
	
	// Only system font group need to register itself.
	AOM.SysFontGroupHelper.fontGroupList.push(this);
}

AOM.SysFontGroupHelper.prototype.createColorUI = function() {
	this.addFontColor();
}


AOM.SysFontGroupHelper.prototype.find = function(id) {
	return this.container[id];
}

/**
 * Load latest datas from userInput object, change all controls selected value.
 */
AOM.SysFontGroupHelper.prototype.refreshValues = function() {
	var userInput = this.userInput;
	
	//set fontfamily and fontface values.
	if (this.find(AOM.SysFontGroupHelper.FONT_FAMILY)) {
		var familyName = this.getName(AOM.SysFontGroupHelper.FONT_FAMILY);
		var faceName = this.getName(AOM.SysFontGroupHelper.FONT_FACE);
		this.setFontFamilyValue(userInput.get(familyName), userInput.get(familyName + "_display"));
		this.setFontFaceValue(userInput.get(faceName), userInput.get(faceName + "_display"));
	} 

	//set fontsize value.
	if (this.find(AOM.SysFontGroupHelper.FONT_SIZE)) {
		this.setFontSizeValue(userInput.get(this.getName(AOM.SysFontGroupHelper.FONT_SIZE)));
	}
	
	//set fontcolor value.
	if (this.find(AOM.SysFontGroupHelper.FONT_COLOR)) {
		this.setFontColorValue(userInput.get(this.getName(AOM.SysFontGroupHelper.FONT_COLOR)));
		this.setFontColorPickerValue(userInput.get(this.getName(AOM.SysFontGroupHelper.FONT_COLOR_PICKER)));
	}
}

AOM.SysFontGroupHelper.prototype.setFontFamilyValue = function(value, text) {
	if (AOM.SysFontGroupHelper.isEmptyString(value)) return;
	if (AOM.SysFontGroupHelper.isEmptyString(text)) text = value;
	
	var fontFamily = this.find(AOM.SysFontGroupHelper.FONT_FAMILY);	
	if (fontFamily.selection.value != value) { 
		if (this.isLazyInitialized && fontFamily.items.length == 1) {
			//if system fonts are lazy initialized and aren't loaded now, replace old items with new items.
			AOM.CS.UIUtils.setDropDownList(fontFamily, [{text:text, value:value}], undefined, true);
			this.userInput.setElement(fontFamily);
		} else {
			var selectedFamily = AOM.CS.UIUtils.setDropDownListSelection(fontFamily, value, true);
			this.userInput.setElement(fontFamily);
			
			//set new fontFace items.
			var fontFace = this.find(AOM.SysFontGroupHelper.FONT_FACE);
			var faceList = AOM.SysFontGroupHelper.getSysFontFaceList(selectedFamily);
			var persistedFontFaceValue = this.userInput.get(fontFace.name);
			AOM.CS.UIUtils.setDropDownList(fontFace, faceList, persistedFontFaceValue, true, true);
			this.userInput.setElement(fontFace);
		}
	}	
}


AOM.SysFontGroupHelper.prototype.setFontFaceValue = function(value, text) {
	if (AOM.SysFontGroupHelper.isEmptyString(value)) return;
	if (AOM.SysFontGroupHelper.isEmptyString(text)) text = value;

	var fontFace = this.find(AOM.SysFontGroupHelper.FONT_FACE);
	if (this.isLazyInitialized && fontFace.items.length == 1) {
		//One value can map to some different texts, such as "Regular" -> "R" or "Regular". 
		if (fontFace.selection.value != value || fontFace.selection.text != text) {
			AOM.CS.UIUtils.setDropDownList(fontFace, [{text:text, value:value}], undefined, true);
			this.userInput.setElement(fontFace);
		}
	} else {
		if (fontFace.selection.value != value) {
			var selectedFamily = AOM.CS.UIUtils.setDropDownListSelection(fontFace, value, true);
			this.userInput.setElement(fontFace);
		}
	}
}


AOM.SysFontGroupHelper.prototype.setFontSizeValue = function(value) {
	if (AOM.SysFontGroupHelper.isEmptyString(value)) return;
	
	var fontSize = this.find(AOM.SysFontGroupHelper.FONT_SIZE);
	if (this.isApplyFSSlider) {
		var intVal = parseInt(value);
		fontSize.numericStepper.setValue(intVal);
		this.userInput.set(fontSize.name, intVal.toString());
	} else {
		var selectedValue = AOM.CS.UIUtils.setDropDownListSelection(fontSize, value, true);
		this.userInput.setElement(fontSize);
	}
}

AOM.SysFontGroupHelper.prototype.setFontColorValue = function(value) {
	if (AOM.SysFontGroupHelper.isEmptyString(value)) return;

	var fontColor = this.find(AOM.SysFontGroupHelper.FONT_COLOR);
	var selectedValue = AOM.CS.UIUtils.setDropDownListSelection(fontColor, value, true);
	this.userInput.setElement(fontColor);
}

AOM.SysFontGroupHelper.prototype.setFontColorPickerValue = function(value) {
	if (AOM.SysFontGroupHelper.isEmptyString(value)) return;

	var fontColorPicker = this.find(AOM.SysFontGroupHelper.FONT_COLOR_PICKER);
	var rgb = eval(value);
	var gfx = fontColorPicker.graphics;
	gfx.customBgColor = gfx.newBrush(gfx.BrushType.SOLID_COLOR, rgb);
	fontColorPicker.notify("onDraw");
	this.userInput.set(fontColorPicker.name, rgb.toSource());
}


AOM.SysFontGroupHelper.prototype.getName = function(id) {
	var name = this.baseName + id;
	return name;
}


AOM.SysFontGroupHelper.prototype.onFontFamilyChange = function(event, target) {};
AOM.SysFontGroupHelper.prototype.onFontFaceChange = function(event, target) {};
AOM.SysFontGroupHelper.prototype.onFontSizeChange = function(event, target) {};
AOM.SysFontGroupHelper.prototype.onFontColorChange = function(event, target) {};
AOM.SysFontGroupHelper.prototype.onFontColorPickerChange = function(event, target) {};

/**
 * SysFontGroupHelper Object Functions.
 *     Private functions
 */
AOM.SysFontGroupHelper.prototype.addFont = function() {
	var baseWidth = this.basePreferredSize[0];
	var baseHeight = this.basePreferredSize[1];
	var familyBaseWidth = Math.floor(baseWidth * 0.55);
	
	//add font family and font face
	var familyGroupRes = 
	"group{\
		alignChildren:'"+this.baseAlignment+"', spacing:'"+this.baseSpacing+"',\
		st:StaticText{text:'"+AOM.localizeEsc("$$$/ContactSheet/javascript/title/font=Font:")+"', preferredSize:[-1, 18]},\
		fontFamily:DropDownList{\
			preferredSize:'"+[familyBaseWidth, baseHeight]+"',name:'"+this.getName(AOM.SysFontGroupHelper.FONT_FAMILY) +"',\
		},\
		fontFace:DropDownList{\
			preferredSize:'"+[(baseWidth - familyBaseWidth - this.baseSpacing), baseHeight]+"', name:'"+this.getName(AOM.SysFontGroupHelper.FONT_FACE) +"',\
		},\
	}";
	var familyGroup = this.targetGroup.familyGroup = this.targetGroup.add(familyGroupRes);
	
	//load items
	var fontFamily = familyGroup.fontFamily;
	var fontFace = familyGroup.fontFace;
	if (this.isLazyInitialized && AOM.SysFontGroupHelper.isEmptySysFontFamilyList()) {
		this.loadDefaultSelectedSysFonts(fontFamily,fontFace);
		fontFamily.lazyUserInput = this.userInput;
		fontFamily.addEventListener("mousedown", AOM.SysFontGroupHelper.lazyLoadFontFamilyList);
		fontFamily.addEventListener("keydown", AOM.SysFontGroupHelper.lazyLoadFontFamilyList);
		fontFace.addEventListener("mousedown", AOM.SysFontGroupHelper.lazyLoadFontFaceList);
		fontFace.addEventListener("keydown", AOM.SysFontGroupHelper.lazyLoadFontFaceList);
	} else {
		this.loadSysFontsList(fontFamily, fontFace);
	}
	
	//add event handler.
	fontFamily.helper = fontFace.helper = this;
	fontFamily.onChange = function(event) {
		if (!AOM.CS.hasProgramInteract) {
			if (this.selection != undefined) {
			    var selectedValue = this.selection.value;
				this.helper.userInput.setElement(this);
				
				//change fontFace dropdownlist items.
				var fontFace = this.parent.fontFace;
				var faceList =AOM.SysFontGroupHelper.getSysFontFaceList(selectedValue);
				AOM.CS.UIUtils.setDropDownList(fontFace, faceList, undefined, true, true);
				this.helper.userInput.setElement(fontFace);
				
				this.helper.onFontFamilyChange(event, this);
			}
		}
	}
	fontFace.onChange = function(event) {
		if (!AOM.CS.hasProgramInteract) {
			if (this.selection != undefined) {
				this.helper.userInput.setElement(this);
				this.helper.onFontFaceChange(event, this);
			}
		}
	}
	
	//last add the controls to container
	this.container[AOM.SysFontGroupHelper.FONT_FAMILY] = fontFamily;
	this.container[AOM.SysFontGroupHelper.FONT_FACE] = fontFace;
}

AOM.SysFontGroupHelper.prototype.addFontSize = function() {
	var baseWidth = this.basePreferredSize[0];
	var baseHeight = this.basePreferredSize[1];
	var halfBaseWidth = Math.floor(baseWidth / 2);
	
	if (this.isApplyFSSlider) {
		var sizeGroupRes = 
		"group{\
			alignChildren:'"+this.baseAlignment+"', spacing:'"+this.baseSpacing+"',\
			st:StaticText{text:'"+AOM.localizeEsc("$$$/ContactSheet/javascript/title/size=Size:")+"', preferredSize:[-1, 18]},\
			fontSize:Group{\
				alignChildren:'"+this.baseAlignment+"', spacing:'"+this.baseSpacing+"',\
				themeType:'hslider', name:'"+this.getName(AOM.SysFontGroupHelper.FONT_SIZE) +"',\
				},\
		}";
		var sizeGroup = this.targetGroup.sizeGroup = this.targetGroup.add(sizeGroupRes);
		var fontSize = sizeGroup.fontSize;
		fontSize.numericStepper = new AOM.AmgNumericStepper(fontSize);
		/**
		 * slider width = baseWidth - (edittext width(35) + footLabel width(35) 
		 * 		+ spacing between slider and edittext(12) + spacing between edittext and footLabel(3))
		 *
		 */
		fontSize.numericStepper.setSlider({
			preferredSize:[(baseWidth - 85), baseHeight], 
			minvalue:AOM.SysFontGroupHelper.DEFAULT_MIN_FONTSIZE, 
			maxvalue:AOM.SysFontGroupHelper.DEFAULT_MAX_FONTSIZE, 
			stepdelta:1});
		fontSize.numericStepper.setFootLabel({text:AOM.localize(AOM.SysFontGroupHelper.UNIT_POINTS_ABBR)});
		fontSize.numericStepper.setEditText({preferredSize:[35, 18]});	
		fontSize.numericStepper.name = fontSize.name;

		//load datas
		this.loadSysFontSizeSlider(fontSize);
		
		//add event handler
		fontSize.numericStepper.sysFontHelper = this;
		fontSize.numericStepper.onChange = function(event) {
			this.sysFontHelper.userInput.set(this.name, this.value);
			this.sysFontHelper.onFontSizeChange(event, this);
		}
		
		this.container[AOM.SysFontGroupHelper.FONT_SIZE] = fontSize;
	} else {
		var sizeGroupRes = 
		"group{\
			alignChildren:'"+this.baseAlignment+"', spacing:'"+this.baseSpacing+"',\
			st:StaticText{text:'"+AOM.localizeEsc("$$$/ContactSheet/javascript/title/size=Size:")+"', preferredSize:[-1, 18]},\
			fontSize:DropDownList{\
				preferredSize:'"+[halfBaseWidth, baseHeight]+"', \
				name:'"+this.getName(AOM.SysFontGroupHelper.FONT_SIZE)+"'},\
			sp:StaticText{text:'', \
				preferredSize:'"+[(baseWidth - halfBaseWidth - this.baseSpacing), baseHeight]+"'}, \
		}";
		var sizeGroup = this.targetGroup.sizeGroup = this.targetGroup.add(sizeGroupRes);
		var fontSize = sizeGroup.fontSize;
		fontSize.selectionTextSuffix = " " + AOM.localize(AOM.SysFontGroupHelper.UNIT_POINTS_ABBR);
		
		//load items
		this.loadSysFontSizeList(fontSize);
		
		//add event handler
		fontSize.helper = this;
		fontSize.onChange = function(event) {
			if (!AOM.CS.hasProgramInteract) {
				if (this.selection != undefined) {
					this.helper.userInput.setElement(this);
					this.helper.onFontFaceChange(event, this);
				}
			}
		}
		
		this.container[AOM.SysFontGroupHelper.FONT_SIZE] = fontSize;
	}
}

AOM.SysFontGroupHelper.prototype.addFontColor = function() {
	var baseWidth = this.basePreferredSize[0];
	var baseHeight = this.basePreferredSize[1];
	var halfBaseWidth = Math.floor(baseWidth / 2);
	
	var colorGroupRes = 
	"group{\
		alignChildren:'"+this.baseAlignment+"', spacing:'"+this.baseSpacing+"',\
		st:StaticText{text:'"+AOM.localizeEsc(this.fontColorTitle)+"', preferredSize:[-1, 18]},\
		fontColor:DropDownList{\
			preferredSize:'"+[halfBaseWidth, baseHeight]+"', \
			name:'"+this.getName(AOM.SysFontGroupHelper.FONT_COLOR)+"'},\
		fontColorPicker:Custom{\
            type:'customBoundedValue',\
			helptip:'"+AOM.localizeEsc("$$$/ContactSheet/javascript/tooltip/colorpicker=More Colors")+"',\
			preferredSize:'"+[30, baseHeight]+"', \
			themeType:'colorpnl', \
			name:'"+this.getName(AOM.SysFontGroupHelper.FONT_COLOR_PICKER)+"'},\
		sp:StaticText{text:'', \
			preferredSize:'"+[(baseWidth - halfBaseWidth - 30 - 2*this.baseSpacing), baseHeight]+"'}, \
	}";
	var colorGroup = this.targetGroup.colorGroup = this.targetGroup.add(colorGroupRes);
	var fontColor = colorGroup.fontColor;
	var fontColorPicker = colorGroup.fontColorPicker;
    var wrappedObject = new AOM.CustomIconButton(fontColorPicker);
	
	//add items
	this.loadSysFontColorList(fontColor, fontColorPicker);

	//add basicEventHandler
	fontColor.helper = fontColorPicker.helper = this;
	fontColor.onChange = function(event) {
		if (!AOM.CS.hasProgramInteract) {

			if (this.selection != undefined) {
				var selectedValue = this.selection.value;			
				var fontColorPicker = this.parent.fontColorPicker;
				var gfx = fontColorPicker.graphics;
				
				if(selectedValue == AOM.SysFontGroupHelper.COLOR_CUSTOM) {
					if(fontColorPicker.currentCustomRGB != undefined) {
						gfx.customBgColor = gfx.newBrush(
							gfx.BrushType.SOLID_COLOR, fontColorPicker.currentCustomRGB);
					}
				} else {
					for(var i = 0; i < AOM.SysFontGroupHelper.DEFAULT_COLOR_LIST.length; ++i) {
						if(AOM.SysFontGroupHelper.DEFAULT_COLOR_LIST[i].value == selectedValue) {
							gfx.customBgColor = gfx.newBrush(
													gfx.BrushType.SOLID_COLOR,
													AOM.SysFontGroupHelper.DEFAULT_COLOR_LIST[i].color);
							break;
						}
					}
				}
				fontColorPicker.notify("onDraw");
				
				this.helper.userInput.setElement(this);
				this.helper.userInput.set(fontColorPicker.name, gfx.customBgColor.color.toSource());
				
				this.helper.onFontColorChange(event, this);
			}
		}
	}
	fontColorPicker.onMouseDown = function(event) {
	    var gfx = this.graphics;
		var oldRGB = eval(this.helper.userInput.get(this.name));
		var oldColorValue = AOM.CS.UIUtils.setColorToColorPicker(oldRGB);
		var selectedColor = $.colorPicker(oldColorValue);
		if (selectedColor == undefined || selectedColor == -1) return;
		var rgb= AOM.CS.UIUtils.getColorFromColorPicker(selectedColor);
		gfx.customBgColor = gfx.newBrush(gfx.BrushType.SOLID_COLOR, rgb);
		
		var fontColor = this.parent.fontColor;
		AOM.CS.UIUtils.setDropDownListSelection(fontColor, AOM.SysFontGroupHelper.COLOR_CUSTOM, true);
		fontColorPicker.currentCustomRGB = rgb;
		
		this.helper.userInput.setElement(fontColor);
		this.helper.userInput.set(this.name, gfx.customBgColor.color.toSource());
		
		this.helper.onFontColorPickerChange(event, this);
		this.notify("onDraw");
	}
	
	this.container[AOM.SysFontGroupHelper.FONT_COLOR] = fontColor;
	this.container[AOM.SysFontGroupHelper.FONT_COLOR_PICKER] = fontColorPicker;
}


/**
 * Required by lazy initialization.
 * Add one item into system fonts control,  which has designated as selected item.
 */
AOM.SysFontGroupHelper.prototype.loadDefaultSelectedSysFonts = function(fontFamily,fontFace) {
	var defaultSelectedFamilyValue = this.userInput.get(fontFamily.name);
	var defaultSelectedFamilyText = this.userInput.get(fontFamily.name + "_display");
	if (AOM.SysFontGroupHelper.isEmptyString(defaultSelectedFamilyValue)) {
		defaultSelectedFamilyValue = AOM.SysFontGroupHelper.DEFAULT_FONT_FAMILY;
	}
	if (AOM.SysFontGroupHelper.isEmptyString(defaultSelectedFamilyText)) {
		defaultSelectedFamilyText = AOM.SysFontGroupHelper.DEFAULT_FONT_FAMILY;
	}

	var defaultSelectedFaceValue = this.userInput.get(fontFace.name);
	var defaultSelectedFaceText = this.userInput.get(fontFace.name + "_display");
	if (AOM.SysFontGroupHelper.isEmptyString(defaultSelectedFaceValue)) {
		defaultSelectedFaceValue = AOM.SysFontGroupHelper.DEFAULT_FONT_FACE;
	}
	if (AOM.SysFontGroupHelper.isEmptyString(defaultSelectedFaceText)) {
		defaultSelectedFaceText = AOM.SysFontGroupHelper.DEFAULT_FONT_FACE;
	}

	var newItem = fontFamily.add("item", defaultSelectedFamilyText);
	newItem.value = defaultSelectedFamilyValue;
	fontFamily.selection = 0;
	this.userInput.setElement(fontFamily);

	newItem = fontFace.add("item", defaultSelectedFaceText);
	newItem.value = defaultSelectedFaceValue;
	fontFace.selection = 0;
	this.userInput.setElement(fontFace);
}

AOM.SysFontGroupHelper.prototype.loadSysFontsList = function(fontFamily, fontFace) {
	//load selected item from userinput
	var selectedFontFamily = this.userInput.get(fontFamily.name);
	var selectedFontFace = this.userInput.get(fontFace.name);
	if (AOM.SysFontGroupHelper.isEmptyString(selectedFontFamily)) {
		selectedFontFamily = AOM.SysFontGroupHelper.DEFAULT_FONT_FAMILY;
	}
	if (AOM.SysFontGroupHelper.isEmptyString(selectedFontFace)) {
		selectedFontFace = AOM.SysFontGroupHelper.DEFAULT_FONT_FACE;
	}
	
	var familyList = AOM.SysFontGroupHelper.getSysFontFamilyList();
	var selectedFamily = AOM.CS.UIUtils.setDropDownList(fontFamily, familyList, selectedFontFamily, true, true);
	var faceList = AOM.SysFontGroupHelper.getSysFontFaceList(selectedFamily);
	AOM.CS.UIUtils.setDropDownList(fontFace, faceList, selectedFontFace, true, true);
	
	//perist current selected item.
	this.userInput.setElement(fontFamily);
	this.userInput.setElement(fontFace);
}


AOM.SysFontGroupHelper.prototype.loadSysFontSizeList = function(fontSize) {
	//load selected value from userinput
	var selectedFontSize = this.userInput.get(fontSize.name);
	if (AOM.SysFontGroupHelper.isEmptyString(selectedFontSize)) {
		selectedFontSize = AOM.SysFontGroupHelper.DEFAULT_FONT_SIZE;
	}
	
	AOM.SysFontGroupHelper.loadSysFontSizeList(fontSize, selectedFontSize);
	
	//persist selected item
	this.userInput.setElement(fontSize);
}


AOM.SysFontGroupHelper.prototype.loadSysFontSizeSlider = function(fontSize) {
	//load value from userInput
	var persistedFontSize = this.userInput.get(fontSize.name);
	var value;
	if (AOM.SysFontGroupHelper.isEmptyString(persistedFontSize)) {
		value = AOM.SysFontGroupHelper.DEFAULT_FONT_SIZE;
	} else {
		value = parseInt(persistedFontSize);
	}
	fontSize.numericStepper.setValue(value);
	
	//persisted value
	this.userInput.set(fontSize.numericStepper.name, fontSize.numericStepper.value);
}

AOM.SysFontGroupHelper.prototype.loadSysFontColorList = function(fontColor, fontColorPicker){
	//load fontColor
	var selectedFontColor = this.userInput.get(fontColor.name);
	if (AOM.SysFontGroupHelper.isEmptyString(selectedFontColor)) {
		selectedFontColor = AOM.SysFontGroupHelper.DEFAULT_FONT_COLOR;
	}
	AOM.SysFontGroupHelper.loadSysFontColorList(fontColor, selectedFontColor);
	
	//load fontColorPicker
	var selectedFontColorPicker = this.userInput.get(fontColorPicker.name);
	var rgb;
	if (AOM.SysFontGroupHelper.isEmptyString(selectedFontColorPicker)) {
		rgb = eval(AOM.SysFontGroupHelper.DEFAULT_FONT_COLOR_PICKER);
	} else {
		rgb = eval(selectedFontColorPicker);
	}
	var gfx = fontColorPicker.graphics;
	gfx.customBgColor = gfx.newBrush(gfx.BrushType.SOLID_COLOR, rgb);
	if (selectedFontColor == AOM.SysFontGroupHelper.COLOR_CUSTOM) {
		fontColorPicker.currentCustomRGB = rgb;
	}
	
	//perist
	this.userInput.setElement(fontColor);
	this.userInput.set(fontColorPicker.name, rgb.toSource());
}
