markup.push({

	"LabelView": {
		nsClass: "GXLabelView",
		gxForePainter: "LabelFore",
		gxDefaultValue: "12345",  	// just so it has a size and something visible
		gxIntrinsicHeight: 16
	},

	"DescriptionLabelView": {   
		"+": "LabelView.left.top.size11.wrap",
		axIsIgnored: false
	},

	// MARK: label fore painter

	"LabelFore": {
		nsClass: "GXStringPainter",
		gxFontSize: 13,
		gxFontColor: "name:primary",		// default to primary
		gxFontShadow: "[0, 0, 0, 0], [0, 1], 1",
		gxHAlign: 0.5,
		gxVAlign: 0.5,

		// alignment styles
		"left": 		{ gxHAlign: 0 },
		"centerx": 	{ gxHAlign: 0.5 },
		"right": 	{ gxHAlign: 1 },
		"top": 		{ gxVAlign: 0 },
		"centery": 	{ gxVAlign: 0.5 },
		"bottom": 	{ gxVAlign: 1 },

		// weight (font weights match apple's naming)
		"light":     { gxFontWeight: -0.4 },
		"regular":   { gxFontWeight: 0 },
        "medium":   { gxFontWeight: 0.23 },
		"bold":      { gxFontWeight: 0.4 },

		// new font colors
		"white":     	    { gxFontColor: "name:white" },
		"black":     	    { gxFontColor: "name:black" },
		"primary":          { gxFontColor: "name:primary" },
		"secondary":        { gxFontColor: "name:secondary" },
        "secondaryBluish":  { gxFontColor: "name:secondaryBluish" },
        "tertiary":         { gxFontColor: "name:tertiary" },
		
	    "tileTint" :       { gxFontColor: "name:tileTint" },
		"tileTintPale" :   { gxFontColor: "name:tileTintPale" },
		"tileTintDark" :   { gxFontColor: "name:tileTintDark" }, 

		"hiliteActive":     { gxFontColor: "name:hiliteActive" },
        "hiliteLCD":     { gxFontColor: "name:hiliteLCD" },

		"on":  		  { gxFontColor: "name:disabled" },
		"disabled":   { gxFontColor: "name:disabled" },

		// word wrap
		"wrap":    { gxLineBreakMode: 0 },

		// sizes
		"size9":   { gxFontSize: 9 },
		"size95":  { gxFontSize: 9.5 },
		"size10":  { gxFontSize: 10 },
		"size105": { gxFontSize: 10.5 },
		"size11":  { gxFontSize: 11 },
		"size115": { gxFontSize: 11.5 },
		"size12":  { gxFontSize: 12 },
		"size125": { gxFontSize: 12.5 },
		"size13":  { gxFontSize: 13 },
		"size135": { gxFontSize: 13.5 },
		"size14":  { gxFontSize: 14 },
		"size145": { gxFontSize: 14.5 },
		"size15":  { gxFontSize: 15 },
		"size16":  { gxFontSize: 16 },
		"size17":  { gxFontSize: 17 },
		"size18":  { gxFontSize: 18 },
		"size20":  { gxFontSize: 20 },
		"size22":  { gxFontSize: 22 }
	},

	// MARK: image painters

	"ImagePainter": {
		nsClass: "GXImagePainter",

		// tints for different states suited to light background
		"tintDark": {
            gxTintColor: "name:primary",
            "disabled": { gxTintColor: "name:disabled" },
            "pressed":    {
                "gxAddStyles": ["pressed"],
                gxTintColor: "name:white",
            },
            "invertOn": {
                "on": { gxTintColor: "name:white" },
            },
		},

		// tints for different states suited to dark background
		"tintLight": {
			gxTintColor: "name:white",
			"disabled": { gxTintColor: "name:lcdDisabled" },
			"pressed":	{ gxTintColor: "name:tertiary" },
            "on":       { gxTintColor: "name:tertiary" },
            "invertOn": {
                "on": { gxTintColor: "name:primary" },
            },
		},

	},

	"StretchHImagePainter": {
		"+": "ImagePainter",
		gxVertical: false
	},

	"StretchVImagePainter": {
		"+": "ImagePainter",
		gxVertical: true
	},

	// MARK: base control painters
	// a common base shared by painters for buttons, popup menus etc

	"ControlFore": {
		"+": "LabelFore",
		gxEdgeInsets: "2, 0, 2, 0",
		gxIconSpacing: 5,
		gxFontColor: "name:secondary",
		"on": 		{ gxFontColor: "name:secondary" },
		"pressed": 	{ gxFontColor: "name:primary" },
		"disabled": 	{ gxFontColor: "name:disabled" }
	},

	"ControlBack": {
		nsClass: "GXRoundRectPainter",
		gxCornerRadius: 3.5,
		gxFrameColor: "name:secondary",
		gxFillColor: "name:backgroundTile",
		gxHiliteColor: "gray:255,5",
		"on": 	{
			gxFillColor: "name:hiliteActive"
		},
		"pressed": {
			gxFrameColor: "name:primary",
			"on": {
				gxFillColor: "name:hiliteActive"
			}
		},
		"disabled": {
			gxFrameColor: "name:disabled",
			gxFillColor: "name:backgroundAlt",
			gxHiliteColor: "gray:255,5",
		},
		"leftSegment":   { gxCornerRadii: "3.5, 0, 0, 3.5" },
		"middleSegment": { gxCornerRadii: "0.5, 0.5, 0.5, 0.5" },
		"rightSegment":  { gxCornerRadii: "0, 3.5, 3.5, 0" }
	},

	// MARK: button view

	"ButtonView": {
		nsClass: "GXButtonView",
		gxIntrinsicHeight: 22,
		gxForePainter: "ButtonFore.size12",
		gxBackPainter: "ButtonBack",
		gxLabelTemplate: "LabelView.secondary.size11",
		gxViewFlipped: false // Fixes focus ring
	},

	// MARK: button painters

	"ButtonFore": {
		"+": "ControlFore.center"
	},

	"ButtonBack": {
		"+": "ControlBack"
	},

	// button background that only shows minimal fill when pressed
	"InvisibleButtonBack": {
		nsClass: "GXRoundRectPainter",
		gxCornerRadius: 3.5,
		"pressed": { gxFillColor: "gray:0,20" }
	},

	// MARK: popup menu view

	"PopupMenuView": {
		nsClass: "GXPopupMenuView",
		gxIntrinsicHeight: 22,
		gxForePainter: "PopupFore",
		gxBackPainter: "PopupBack",
		gxExtraPainter: "PopupArrows",
		gxLabelTemplate: "LabelView.right",
		gxDisableOnNil: false		// menu item with repObject of nil is valid, but doesn't mix with this setting. choose one.
	},
			
	"StyledButton" : {
		"+" : "ButtonView",
		gxBaselineOffset: 5,
		gxIntrinsicHeight: 24,
		gxBackPainter: "StyledButtonBack",
		gxLabelTemplate: "InspectorLabel.top.right.secondary.size11",
		gxForePainter: "StyledButtonFore.left"
	},
			
	"StyledButtonPopup" : {
		"+" : "StyledButton",
		nsClass: "GXPopupMenuView",
		gxExtraPainter: "PopupArrows",
		gxIntrinsicHeight: 26,
		gxLayout: [
			"V:[selfLabel(18)]"
		],
		gxForePainter: {
			"+" : "StyledButtonFore.left",
			gxEdgeInsets: "6,0,0,0",
		},
		gxDisableOnNil: false,
	},
			
	"StyledButtonFore" : {
		"+" : "InspectorBarButtonFore",
	},
			
	"StyledButtonBack" : {
		"+" : "InspectorBarButtonBack",
		"pressed":{ },
	},

	// MARK: popup menu painters

	"PopupFore": {
		"+": "ControlFore",
		gxHAlign: 0,
		gxEdgeInsets: "10, 0, 22, 0"		// extra space on right for arrows
	},

	"PopupBack": {
		"+": "ControlBack"
	},

	"PopupArrows": {
		nsClass: "GXImagePainter",
		gxEdgeInsets: "0, 0, 8, 0",	// inset from right
		gxHAlign: 1,					// aligned right
		gxVAlign: 0.5,
		gxImage: "popup.arrows",
		gxTintColor: "name:tileTintDark",
		"disabled" : {
			gxTintColor: "name:disabled"
		}
	},

	// MARK: checkbox view

	"CheckboxView": {
		nsClass: "GXButtonView",
		gxIntrinsicHeight: 22,
		gxForePainter: "CheckboxFore",
		gxBackPainter: "CheckboxBack",
		axCheckboxRole: true,
		gxViewFlipped: false // Fixes focus ring
	},

	// MARK: checkbox painters

	"CheckboxFore": {
		"+": "ControlFore.left.secondary.size115",
		gxEdgeInsets: "24, 0, 0, 0",	// inset from left to leave room for box
	},

	"CheckboxBack": {
		nsClass: "GXImagePainter",
		gxEdgeInsets: "2, 0, 0, 0",
		gxHAlign: 0,					// aligned right
		gxVAlign: 0.5,
		gxImage: "checkbox",
        //gxShadow: "{0.0, 0.5}, {0.0, -0.10000000149011612}, 1.0",
        "colored" : {
            gxTintColor: "name:secondary",
            "on": {
                gxTintColor: "name:tileTint",
                "gxAddStyles": [ "on" ],
                "pressed": {
                    gxTintColor: "name:tileTintDark",
                },
            },
            "mixed": {
                gxTintColor: "name:tileTint",
                "gxAddStyles": [ "mixed" ],
                "mixed": {
                    gxTintColor: "name:tileTintDark",
                },
            },
            "pressed": {
                gxTintColor: "name:tertiary",
                "gxAddStyles": [ "on" ],    // use 'on' artwork
            },
        },
        "disabled": {
            gxTintColor: "name:disabled",
        }
	},

	// MARK: radio view

    "RadioButtonView": {
        nsClass: "GXButtonView",
        gxIntrinsicHeight: 22,
        gxForePainter: "RadioButtonFore",
        gxBackPainter: "RadioButtonBack",
        gxLabelTemplate: "LabelView.secondary.size11",
        axCheckboxRole: true,
		gxViewFlipped: false // Fixes focus ring
    },

    // MARK: radio painters

    "RadioButtonFore": {
        "+": "ControlFore.left.tertiary.size11",
		"on" : {
			gxFontColor: "name:secondary",
		},
        gxEdgeInsets: "24, 0, 0, 0",    // inset from left to leave room for box
    },

    "RadioButtonBack": {
        nsClass: "GXImagePainter",
        gxEdgeInsets: "2, 0, 0, 0",
        gxHAlign: 0,                    // aligned right
        gxVAlign: 0.5,
        gxImage: "radio",
        //gxShadow: "{0.0, 0.5}, {0.0, -0.10000000149011612}, 1.0",
        "colored": {
            gxTintColor: "name:tertiary",
            "on": {
                gxTintColor: "name:tileTint",
                "gxAddStyles": [ "on" ],
                "pressed": {
                    gxTintColor: "name:tileTintDark",
                },
            },
            "pressed": {
                gxTintColor: "name:tertiary",
                "gxAddStyles": [ "on" ],    // use 'on' artwork
            },
        },
        "disabled": {
            gxTintColor: "name:disabled",
        }
    },

	// MARK: slider view

	"SliderView": {
		nsClass: "GXSliderView", 
		gxIntrinsicHeight: 23,
		gxBaselineOffset: 7,
		gxEndGap: 7,   
        gxDrawsFocused: true,
		gxDisableOnNil: false,
		"gxAllowNumericEntry": false,
		gxTrackPainter: "SliderTrack",
		gxKnobPainter: "SliderKnob",
		gxLabelTemplate: "SliderLabel",
		gxReadoutTemplate: "SliderReadout"
	},

	// standard label for a slider
	"SliderLabel": {
		"+": "LabelView.left.secondary.size11",
	},

	// standard readout for a slider
	"SliderReadout": {
		"+": "LabelView",
		gxForePainter : {
			"+": "LabelFore.right.secondary.size10",
			"disabled" : {
				// prevent drawing when disabled by making empty rect
				gxEdgeInsets: "999,999,999,999"
			}
		},
		"seconds" : {
			gxFormatter: { nsClass: "GXScaledFormatter", "format": "%.1fs" },
		},
		gxDefaultValue: "",
		gxIntrinsicWidth: 48,
		gxIntrinsicHeight: 19,
		gxVAlign: 1,
		gxClickValue: 0
	},

	// MARK: slider painters

	"SliderTrack":
	{
		nsClass: "GXRoundRectPainter",
		gxDefaultSize: "3,3",	// default size of track determines track width!
		gxCornerRadii: "1.5, 1.5, 1.5, 1.5", 
		gxFillColor: "name:sliderTrack",
		"on": { 
			gxFillColor: "name:tileTint"
		},
		"disabled": {
			gxFillColor: "name:sliderTrack",
		},
        "active" : { 
            gxFillColor: "name:sliderTrack",
        },
	},

	"SliderKnob":
	{
		nsClass: "GXRoundRectPainter",
		gxDefaultSize: "13, 13",
		gxCornerRadius: 6.5,
		gxFrameColor: "name:draggableFrame",
		gxFillColor: "name:draggableFill",
		//gxHiliteColor: "gray:255,100",
		gxShadow: "{0.0, 0.0, 0.0 0.5}, {0.0, -1.0}, 2", 
		"focused": {
            gxStrokeWidth: 2,
			gxFillColor: "name:tileTintPale"
		},
		"disabled": {
            // prevent drawing using zero size when disabled
			gxDefaultSize: "0, 0",
		},
	},

	// MARK: list view

	"ListView": {
		nsClass: "GXListView",
		gxLayoutSubviews: true,
		gxCollapsible: false,
		gxLayoutHorizontally: false,
		gxCollapsed: false
	},

	// MARK: scrollbar view

	"ScrollBarView":
	{
		nsClass: "GXScroller",
		gxKnobPainter: "ScrollBarKnob",
		gxMinKnobLength: 20
	},

	// MARK: scrollbar painters 

	"ScrollBarKnob":
	{
		nsClass: "GXRoundRectPainter",
		gxCornerRadius: 2.5,
		gxFillColor: "name:toolbarBottom",
		"vertical": {
			gxEdgeInsets: "4, 4, 5, 3"
		},
		"horizontal": {
			gxEdgeInsets: "6, 3, 6, 3"
		}
	},

	// MARK: text view

	"TextView": {
		"+": "BaseTextField",
		nsClass: "GXTextView",
		gxDrawsFocusRing: true,
		gxForePainter: "TextFieldFore",
		gxTextStyle: {
			nsClass: "GXStyledString",
			gxFontSize: 12.5, 
		},
		gxLinkDetectionEnabled: true,
	},

	// MARK: textfield view

	"BaseTextField": {	// note: code depends on the name 'BaseTextField' when looking up gxSelectionColor
		nsClass: "GXTextField",
		gxBaselineOffset: 2,
		//gxDisabledAlphaColor: "gray:255,28", // placed over everything when disabled
		gxInsertionPointColor: "name:primary",
		gxSelectionColor: "rgba:167,201,255,100",	// overrides system hilite color for user selection
		gxLabelTemplate: "LabelView.right.primary.size13",
		gxBackPainter: "TextFieldBack",
		gxPlaceholderStyle: "PlaceholderStyle",
        "gxTextPainter": "TextFieldFore",
	},

	"TextField": {
		"+": "BaseTextField"
	},

	"TextFieldFore": {
		"+": "LabelFore.left.top.size125", 
		gxFontColor: "name:primary",
		gxBackColor: "name:backgroundTile", 
	},

	"TextFieldBack": {
		nsClass: "GXRoundRectPainter",
		gxCornerRadius: 0,
		gxFillColor: "name:backgroundTile"
		//disabled: [
		//]
		//gxHiliteColor: "name:hiliteActive"
	},

	"PlaceholderStyle": {
		nsClass: "GXStyledString",
		gxFontSize: 12.3,
		gxFontColor: "name:secondary"
	},

	// MARK: window bits

	"WindowTitle": {
		"+": "LabelView.light.size135",
		gxValueKeyPath: "window.title",
		gxIntrinsicWidth: -1,
		gxLayout: [ "H:|-75-[self]-75-|", "V:|-3-[self]" ],
		axIsIgnored: true
	},

	"WindowTitleBar": {
		nsClass: "GXSettingsView",
		gxViewName: "titleBarView",
		gxBackPainter: "WindowTitleBarBack",
		gxIntrinsicWidth: -1,
		gxIntrinsicHeight: 23,
		gxCanDrawSubviewsIntoLayer: true,	// important for drawn text quality of title
		gxLayout: [ "H:|[self]|",
					"V:|-(0@900)-[self]" ],
						// constraint priority set so code can override. see GXWindow setupCustomTitlebar
		gxChildViews: {
			"trialButton": "TrialButton",
			"title": "WindowTitle"
		},
		"noTrial": {
			gxChildViews: {		// omit trial button
				"title": "WindowTitle"
			}
		}
	},

	"WindowTitleBarBack": {
		nsClass: "GXRoundRectPainter",
        gxEdgeInsets: "-1.5,-2.5,-1.5,0",
		gxCornerRadii: "3, 3, 0, 0",
		gxFrameColor: "name:toolbarBorder",
        gxFillColor: "name:toolbarTop",
		gxFillEndColor: "name:toolbarBottom",	// use gradient
		gxHiliteColor: "name:toolbarBorder"
	},

	// MARK: formatters

    "PercentageFormatter": { nsClass: "GXScaledFormatter", "scale": 100, "format": "% .0f%%" },
 

});
