ts.ThemeManager.register("Facebook", {
	button: {
	    _baseTemplate_: {
			name: "New Button", 
			style: "roundRect", 
			rectangle:[0,0,95,26], 
			textAlign: "center", 
			textFont: "Helvetica", 
			textStyle:["bold"], 
			textSize: 11, 
			selectedLine: 0, 
			titleWidth: 0, 
			showName: true, 
			enabled: true
		},
		_common_: {
			type: 0,
			_common_: { 
				textSize: 11, 
				textColor: "#3B5998",
				color: "-1,-1,-1"
			},

			//these are just here to indicate what mode names we want
			enabled: { },
			enabled_mouseEnter: { },
			enabled_mouseDown: { },
						
			enabled_hilite: { },
			enabled_hilite_mouseEnter: { },
			enabled_hilite_mouseDown: { },
			
			disabled: { },
			disabled_hilite: { }

		},
		transparent: {
			enabled_hilite: { color: "#627AAD", textColor: "white" }
		},
		opaque: {
			_common_: {
                color: "#D8DFEA",
				textSize: 13,
				textStyle: ["bold"],
			    textColor: "#3B5998"
			},
			enabled: {
                color: "#D8DFEA"
			},
			enabled_mouseEnter: {
			    color: "#D8DFEA"
			},
			enabled_hilite: {
			    color: "#3B5998",
			    textColor: "#D8DFEA"
			},
            enabled_hilite_mouseEnter: {
                color: "#3B5998",
                textColor: "#D8DFEA"
            }
		},
		rectangle: {
			_common_: { 
				textColor: "#333333",
				textStyle: ["bold"],
				//textShadow: "0 1px 0 #FFFFFF"
				border: [2, "image", ["Rectangle-Up.png", 22, 22], 2]
			},
			enabled_hilite: {
			    border: [2, "image", ["Rectangle-Down.png", 22, 22], 2]
			},
            enabled_hilite_mouseEnter: {
			    border: [2, "image", ["Rectangle-Down.png", 22, 22], 2]
            }
		},
		roundRect: {
			_common_: { 
				border: [[4,8,4,8], "image", ["ButtonRoundRect.png", 24, 24], [4,8,4,8]],
				textColor: "#333333",
				textStyle: ["bold"]
				//textShadow: "0 1px 1px #FFFFFF"
			},
			enabled_hilite: {
			    border: [[4,8,4,8], "image", ["ButtonRoundRect-Down.png", 24, 24], [4,8,4,8]]
			},
            enabled_hilite_mouseEnter: {
			    border: [[4,8,4,8], "image", ["ButtonRoundRect-Down.png", 24, 24], [4,8,4,8]]
            }
		},
		shadow: {
			_common_: { 
				border: [2, "image", ["Shadow-Up.png", 6, 6], 2],
				textSize: 12,
				textStyle: ["bold"],
				textColor: "white"
			},
			enabled_hilite: {
			    border: [2, "image", ["Shadow-Down.png", 6, 6], 2]
			},
            enabled_hilite_mouseEnter: {
			    border: [2, "image", ["Shadow-Down.png", 6, 6], 2]
            }
		},
		standard: {
			_common_: { 
				border: [2, "image", ["ButtonStandard.png", 12, 12], 2],
				textColor: "white",
				textSize: 13,
				textStyle: ["bold"]
			},
			enabled_hilite: {
			    border: [2, "image", ["ButtonStandard-Down.png", 12, 12], 2]
			},
            enabled_hilite_mouseEnter: {
			    border: [2, "image", ["ButtonStandard-Down.png", 12, 12], 2]
            }
		},
		"default": {
			_common_: { 
				color: "#3B5998",
				border: [1, "image", ["Default-Up.png", 4, 4], 1],
				textColor: "white"
			},
			enabled_hilite: {
			    border: [1, "image", ["Default-Down.png", 4, 4], 1]
			},
            enabled_hilite_mouseEnter: {
			    border: [1, "image", ["Default-Down.png", 4, 4], 1]
            }
		},
		checkBox: {
			type: 1,
			_common_: {
			    textAlign: "left",
				boxImage: ["ButtonCheckBox.png", 15, 15]
			},
			enabled_hilite: {
			    boxImage: ["ButtonCheckBoxHilite.png", 15, 15]
			},
			enabled_hilite_mouseEnter: {
			    boxImage: ["ButtonCheckBoxHilite.png", 15, 15]
			}

		},
		radioButton: {
			type: 1,
			_common_: {
				boxImage: ["ButtonRadioButton.png", 15, 15]
			},
			enabled_hilite: {
			    boxImage: ["ButtonRadioButtonHilite.png", 15, 15]
			},
			enabled_hilite_mouseEnter: {
			    boxImage: ["ButtonRadioButtonHilite.png", 15, 15]
			}
		},
		popup: {
			type: 2,
			_common_: { 
				border: [4, "image", ["FieldShadow.png", 12, 12], 4],
				boxImage: ["FieldPopupArrow.png", 15, 6]
				
			}
		}
	},
	field: {
		_baseTemplate_: { name: "New Field", style: "rectangle", rectangle:[0,0,200,85], textFont: "Verdana", textSize: 12, selectedLine: 0, fixedLineHeight: true, scroll: 0, textHeight: 16},
		_common_: {
			type: 0,
			_common_: { 
				textColor: "0,0,0",
				//textHeight: 12,
				border: [1, "solid", "transparent"],
				color: "-1,-1,-1" 
			},
			focus: { }, //just here to indicate we want a standard style mode
			blur: { } //just here to indicate we want a standard style mode
		},
		transparent: {
			textHeight: 12
		},
	    opaque: {
			_common_: { 
			    color: "255,255,255"
			}
		},
		rectangle: {
			_common_: { 
			    border:[1, "solid", "black"],
			    color: "255,255,255"
			}
		},
		shadow: {
			_common_: {
                textHeight: 12,
                border: [4, ["image", "FieldShadow.png", 12, 12], 4]
			}
		},
		scrolling: {
			type: 1,
			_common_: { 
			    border:[1, "solid", "black"], 
			    color: "255,255,255"
			}
		}
	},
    objects: [
        { name: "Buttons", icon: "", type: "section" },
        {
    	    name: "Button", icon: "ui-button.png", type: "button",
    	    desc: "A button receives the <u><i>mouseUp</i></u> system message when clicked. Add a script or task to respond.",
    	    props: {rectangle: [0,0,83,22], style: "roundRect", autoHilite: true}
    	},
        {
    	    name: "Sign Up Button", icon: "ui-button.png", type: "button",
    	    desc: "A button styled like Facebook's Sign Up button.",
    	    props: {name:"Sign Up", rectangle: [0,0,70,22], style: "shadow", autoHilite: true}
    	},
    	{
    	    name: "Check Box", icon: "ui-checkbox.png", type: "button",
    	    desc: "A checkbox is used to turn an option on and off. Use the <u><i>hilite</i></u> property to toggle the checkbox.",
    	    props: {rectangle: [0,0,110,22], style: "checkBox", autoHilite: true, textAlign:"left"}
    	},
    	{
    	    name: "Radio Button", icon: "ui-radio-button.png", type: "button",
    	    desc: "A radio button is used to select between one or more options. Use the <u><i>family</i></u> property to connect multiple radio buttons.",
    	    props: {rectangle: [0,0,118,22], style: "radioButton", autoHilite: true, textAlign:"left"}
    	},
    	{
    	    name: "Popup Menu", icon: "ui-popup-menu.png", type: "button",
    	    desc: "A pop-up menu displays a menu and sets both the <u><i>selectedText</i></u> and <u><i>selectedLine</i></u> properties when a selection is changed.",
    	    props: {rectangle: [0,0,120,23], style: "popup", contents: "Line 1\nLine 2\nLine 3"}
    	},
    	{
    	    name: "Transparent Button", icon: "ui-transparent-button.png", type: "button",
    	    desc: "A transparent button is used to overlay a clickable area on a tile or background.",
    	    props: {style: "transparent", showName: false}
    	},
        { name: "Fields", icon: "", type: "section" },
    	{
    	    name: "Field", icon: "ui-field.png", type: "field",
    	    desc: "A field is for entering a large amount of text. When added to a background the field contents is unique per tile.",
    	    props: {rectangle: [0,0,200,85], style:"rectangle"}
    	    
    	},
    	{
    	    name: "Single Line Field", icon: "ui-single-line-field.png", type: "field",
    	    desc: "A single line field is for entering a small amount of text. When added to a background the field contents is unique per tile.",
    	    props: {rectangle: [0,0,150,22], autoTab: true}
    	},
    	{ 
    	    name: "List Field", icon: "ui-list-field.png", type: "field",
    	    desc: "A list field is used to select between one or more options. Use the <u><i>multipleLines</i></u> property to toggle multiple selection.",
    	    props: {autoTab: false, autoSelect: true, lockText:true, selectedLines: [1], contents:"Line 1 Item 1, Item 2, Item 3\nLine 2 Item 1, Item 2, Item 3\nLine 3 Item 1, Item 2, Item 3\nLine 4 Item 1, Item 2, Item 3"}
    	},
    	{
    	    name: "Label", icon: "ui-label.png", type: "field",
    	    desc: "A label is used to display one or more lines of text. They receive mouse messages such as <u><i>mouseUp</i></u>.",
    	    props: {rectangle: [0,0,80,22], lockText: true, style: "transparent", contents: "New Label"}
    	},
        { name: "Part Containers", icon: "", type: "section" },
    	{
    	    name: "Tile", icon: "ui-tile.png", type: "tile",
    	    desc: "A tile is a part container that holds other buttons and fields. Use scripts or tasks to create interactions between tiles."
    	},
    	{
    	    name: "Background", icon: "ui-background.png", type: "background",
    	    desc: "A background is a part container that behaves like a template for one or more tiles. Tiles that are added to it will share the backgrounds parts."
    	}
	]
});