markup.push({
			  
	"BoardWindow": {
		nsClass: "Farrago.IBBoardWindow",
		gxWindowTitle: "Farrago",
		gxCanFullScreen: true,
		gxWindowMaxSize: "3000,2000",
		gxWindowMinSize: `${Constants.minWindowWidth}, ${Constants.minWindowHeight}`,
		gxInitialWindowSize: "1360,600",
		gxInitialWindowPosition: "0.5,0.22",
		gxBackColor: "name:white",
		gxSavedWindowStateKey: "boardWindow",
		"gxFullSizeContentView": true,
		gxContentView: "BoardWindowContentView",
		"waveformColor": "name:primary",			// temporary
		dividerColor: "name:backgroundAlt",
	},

	// --------------------------------------------------------

	"BoardWindowContentView": {
		nsClass: "GXDrawView", 
		gxWantsLayer: true,
		gxLayout: [
            // The inspector panel is moved off the right edge of the window
            // by code. sets panel is moved off the left. Don't attach them to the
            // edges here, code adds contraints needed to complete the layout
            // The trial bar's height is set by code
			"V:|-0-[toolbar(46)]",
			"H:|-0-[toolbar(>=0)]-0-|",
			"H:|-0-[trialbar]-0-|",
			`H:|-0-[splitView]-0-|`,
			`V:[toolbar]-0-[trialbar]-0-[splitView(>=${Constants.minBoardHeight})]-0-|`,
			 
		],
		gxChildViews: {
			"toolbar": { "+": "Toolbar", gxViewName: "toolbar" },
            "trialbar": { "+": "Trialbar", gxViewName: "trialbar" },
			"splitView" : {
				nsClass: "GXSplitView",  
				gxIntrinsicWidth: -1, 
				gxAutoSaveName: "BoardViewSplitPositions",
				gxDividerColor: "name:panelDividerColor",
				gxLayout: [
					"V:|-0-[setsPanel]-0-|",
					"V:|-0-[tileScrollContainer]-0-|",
					"V:|-0-[inspectorPanel]-0-|",
					"H:[inspectorPanel]-0-|",
					"H:|-0-[setsPanel]",   
				],
				gxChildViews: {
					"setsPanel" : {
						"+" : "SetsPanel",
						gxLayerZPosition: 0,
						gxHoldingPriority: 400,
						gxFrameRect: "0,0,170,0", // Set up the initial width for this panel.
						gxIntrinsicWidth: Constants.minSetsWidth,
						gxCollapsible: true,
						gxCollapsePanelOnKey: "hideSetsList"
					},
					"tileScrollContainer" : {
						"+" : "TilesScrollViewContainer",
						gxLayerZPosition: 1,
						gxIntrinsicWidth: Constants.minBoardWidth,
						gxFrameRect: `0,0,${Constants.minBoardWidth},0`, // Set up the initial width for this panel.
						gxHoldingPriority: 50,
					},
					"inspectorPanel" : {
						"+" : "InspectorPanel",
						gxLayerZPosition: 2,
						gxIntrinsicWidth: Constants.minInspectorWidth,
						gxHoldingPriority: 440,
						gxFrameRect: `0,0,${Constants.minInspectorWidth},0`, // Set up the initial width for this panel.
						gxCollapsible: true,
						gxCollapsePanelOnKey: "hideInspector"
					}
				}
			}
		}
	},
			 
	"SetsPanel": {
		nsClass: "GXSettingsView", 
		gxWantsLayer: true,
		gxIntrinsicHeight: -1,
		gxBackPainter: {
			nsClass: "GXRoundRectPainter",
			gxEdgeInsets: "-1,-1,0,-1",
			gxFillColor: "name:setsListBackground", 
		},
		gxLayout: [
			"V:|-0-[self]-0-|",
			"H:|-0-[setsTitle(40)]",
			`H:|-0-[setsScrollView(>=${Constants.minSetsWidth})]-0-|`,
			`V:|-10-[setsTitle]-0-[setsScrollView]-${Constants.footerHeight}-|`,
			"V:[addSet(21)]-11-|",
			"V:[deleteSet(21)]-11-|",  
			"H:|-12-[addSet(80)]-(>=0)-[deleteSet(25)]-12-|",
		],
		gxChildViews: {
			"setsTitle" : {
				"+" : "LabelView.size12.tertiary",
				gxIntrinsicHeight: 13,
				gxDefaultValue: "Sets"
			},
			"setsScrollView": {
				nsClass: "GXScrollView",
				gxConsumeMouseClick: true,	// stop clicks deselecting the list
				gxBackColor: "name:setsListBackground",
				gxScrollbarWidth: 11,
				gxVScrollbar: "ScrollBarView",
				gxAutohidesScrollers: true,
				gxDocumentView: {
					nsClass: "GXListView",
					gxIntrinsicWidth: -1, // Very important for split view resizing - esp after system theme changes
					gxViewName: "setsView",
					gxCollapsible: false,
					"listTopHeight": 5,
					"listBottomHeight": Constants.footerHeight,
					gxLayout: [ "H:|-0@400-[self]-0-|"],
					axRoleDescription: "Sets List",
					axHelp: "A list of Audio Sets",
				}
			}, 
			"addSet": {
				"+" : "SetButton",
				gxBackPainter: "SetButtonBack.setsPlus",
				gxValueKeyPath : "newSet",
				gxTitle: "New Set",
			},
			"deleteSet": {
				"+" : "SetButton",
				gxBackPainter: "SetButtonBack.setsMinus",
				gxValueKeyPath : "deleteSet",
				axTitle: "Delete Set",
			},
		},
	},
	"SetButton" : {
		"+": "ButtonView",
		gxBackPainter: "SetButtonBack",
		gxForePainter: {
			"+": "ControlFore.left.primary.regular.size12",
			gxEdgeInsets: "26, 1, 0, 0",
		},
	},
	"SetButtonBack" : {
		"+": "ImagePainter",
		"darkMode" : {
			gxTintColor: "name:white",
			"pressed" : {
				gxTintColor: "gray:200,100"
			}
		},
		gxEdgeInsets: "2, 0, 0, 0",
		gxHAlign: 0,
	},
	"TilesScrollViewContainer": {
		nsClass: "GXDrawView",
		gxIntrinsicWidth: -1,
		gxIntrinsicHeight: -1,
		gxLayout: [
			`H:|-0-[tilesScrollView]-0@300-|`,
			"H:|-0-[footer]-0-|",
			`V:|-0-[tilesScrollView]-0-[footer(>=0)]-0-|`
		],
		gxChildViews: {
			"tilesScrollView" : {
				nsClass: "Farrago.IBScrollView",
				gxNotifySubviewsOfVisibilityChanges: true,
				gxBackColor: "name:boardBackground",
				gxIntrinsicWidth: -1,
				gxScrollbarWidth: 15,
				gxVScrollbar: "ScrollBarView",
				gxAutohidesScrollers: false,
				gxDocumentView: {
					nsClass: "Farrago.IBBoardView",
					gxViewName: "boardView",
					gxIntrinsicWidth: -1,
					gxLayoutHorizontally: true,
					axRoleDescription: "Audio Board",
					axHelp: "Contains audio Tiles for the current Set",
					gxLayout: [
							   "H:|-0-[self]-0-|",
								"H:|-0-[ghostView]-0-|",
								"V:|-0-[ghostView]-0-|",
							],
					gxChildViews: {
						"ghostView": { nsClass: "NSView" },
						"emptySetView": { "+": "EmptySetView" },
					}
				}
			},
			"footer" : { "+" : "Footer" }
		}
	},
			
	"Footer" : {
		nsClass: "GXSettingsView",
		gxConsumeMouseClick: true,
		gxIntrinsicWidth: -1,
		gxValueKeyPath: "",
		gxBackPainter: {
			nsClass: "GXRoundRectPainter",
			gxEdgeInsets: "-1,0,-1,-1",
			gxStrokeWidth: 1,
			gxFillColor: "name:boardBackground",
			gxFrameColor: "name:panelDividerColor"
		},
		gxLayout: [
		
			"H:|-10-[playbackModeLabel]-8-[playbackMode(115)]&alignCenterY",
		
			"H:[playbackMode]-16-[crossfadeSliderLabel(80)]-17-[crossfadeSlider(150)]-(-16)-[crossfadeSliderReadout]-(>=10)-[resetList(100)]-10-|&alignCenterY", 
			
			"V:[playbackMode]-10-|",
			
		],
		gxChildViews: {
			"playbackMode" : {
				"+" : "PlaybackBarButton",
				nsClass: "GXPopupMenuView",
				gxForePainter: {
					"+" : "PlaybackBarButtonFore.left",
					gxEdgeInsets: "10,0,0,0"
				},
				gxExtraPainter: {
					"+" : "PopupArrows",
					gxTintColor: "name:secondary",
				},
				gxIntrinsicWidth: 150,
				gxMenuItems: [{ gxTitle: "Queued", gxValue: 1 }, { gxTitle: "Continuous", gxValue: 2 }],
				gxDefaultValue: 1,
				gxLabelTemplate: "LabelView.secondary.size115",
				gxLabelText: "Playback Mode:",
				gxValueKeyPath: "playbackMode"
			},
			"crossfadeSlider": {
				"+": "FadeTimeSlider",
				gxDefaultValue: 0.0,
				gxIntrinsicHeight: 50,
				axHelp: "Crossfade time in seconds",
				gxReadoutKeyPath : "crossfadeDuration",
				gxValueKeyPath : "crossfadeDuration",
				gxDisableOnKey: null,
				gxTrackPainter: {
					"+" : "SliderTrack",
					gxFrameColor: "name:disabled",
					gxFillColor: "name:disabled",
					"on": {
						gxFrameColor: "name:tileTint",
						gxFillColor: "name:tileTint", 
						gxCornerRadius: "1, 0, 0, 1",
					},
					"disabled" : {
						gxFrameColor: "name:disabled",
						gxFillColor: "name:disabled",
					},
				},
				gxKnobPainter: {
					"+" : "FadeTimeSliderKnob",
					"focused": {
						gxTintColor: "name:tileTint",
					},
				},
				gxReadoutTemplate: {
					"+" : "SliderReadout.seconds",
					gxForePainter: {
						"+" : "LabelFore.right.secondary.size10",
						gxEdgeInsets: "0,2,0,0",
					}
				},
				gxLabelTemplate: {
					"+": "InspectorLabel.top.left.secondary.size115",
					gxIntrinsicHeight: 12
				},
				gxLabelText: "Fade Duration:",
				gxEnableOnKey: "playbackModeContinuous"
			},
			"resetList" : {
				"+" : "PlaybackBarButton",
				gxValueKeyPath: "resetPlaybackState",
				gxDisableOnKey: "resetButtonDisabled",
				gxTitle: "Reset List",
			},
		}
	}, 
	"PlaybackBarButton" : {
		"+" : "IconBarButton",
		gxIntrinsicWidth: 130,
		gxIntrinsicHeight: 26,
		gxBackPainter: {
			"+" : "IconBarButtonBack",
			gxFillColor: "name:resetListButtonFill",
			"disabled" : { },
			gxFrameColor: null,
			
		},
		gxForePainter: "PlaybackBarButtonFore",
	},
	"PlaybackBarButtonFore" : {
		"+" : "StyledButtonFore.center",
		gxFontColor: "name:primary",
		"pressed": { },
		gxEdgeInsets: "0,0,0,0"
	}
})
