// MARK: Base

markup.push({


PresetIconBase: {
    "+": "LabelView.foreColor1.left.clip.useMarkup",
    gxValueKey: "iconMarkup",
},


PresetNameBase: {
    "+": "BaseTextField",
    gxValueKey: "name",
    gxEditingKeyPath: "isEditing",
    gxTextPainter: { "+": "ControlFore", gxHAlign: 0, gxFontSize: 13 },
    gxEdgeInsets: "2, 4, 2, 3",
    gxPencilForePainter: "PencilForePainter",
    gxPencilBackPainter: "PencilBackPainter",
    gxFocusRingPainter: "ControlBack",
    gxIntrinsicWidth: -1,
},


PresetsScrollerBase: {
    nsClass: "GXScrollView",
    gxBackColor: "SidebarBackColor2",
    gxVScrollbar: "ScrollBarView",    // vertical scroller only
},


PresetsScrollContentBase: {
    gxViewName: "presetsList",
    nsClass: "GXListView",
    gxItemHeight: 31,
    gxInterItemHeight: 1,
    gxTopHeight: 6,
    gxBottomHeight: 6,
    gxValueKey: "presetsListValue",
    axTitle: "Presets List",
    axHelp: "Edit preset names or delete them from this list. Presets are used on individual Blocks within Sessions",
},


PresetItemBase: {
    nsClass: "GXListItemView",
    gxIntrinsicWidth: 300,
    gxBackPainter: {
        "+": "ListItemBack.altRow",
        gxFillColor: "",    // skip fill until selected
        gxEdgeInsets: "7, 0, 2, 0",
    },
    gxSelectable: 1, // single select
},


// MARK: - presets sheet


PresetsSheet: {
    nsClass: "GXWindow",
    gxWindowTitle: "Presets",
    gxWindowMaxSize: "320, 2000",
    gxWindowMinSize: "320, 104",
    gxInitialWindowSize: "320, 168",
    nkWindowSizeKey: "NodeKitPresets_%@",
    gxBackColor: "BackColor2",
    gxContentView: "PresetsSheetContentView"
},

	
// MARK: content view


PresetsSheetContentView: {
	nsClass: "GXDrawView",
	gxLayout: [
		"H:[self(320)]",
		
		"V:[titleBarView]-0-[presetsScroller]-0-[bottomBar(36)]-0-|",

		"H:|-0-[presetsScroller]-0-|",
		"H:|-0-[presetsList]-0-|",
	],
	gxChildViews: {
		titleBarView: {
			"+": "TitleBarView",
			gxChildViews:
			{
				windowTitle: {
					"+": "WindowTitle",
                    gxValueKey: "windowTitle",
				},
			},
		},
		presetsScroller: {
            "+": "PresetsScrollerBase",
			gxDocumentView: {
                "+": "PresetsScrollContentBase",
				gxListItemView: "PresetsSheetItemView",
			}
		},
		bottomBar: {
			nsClass: "GXDrawView",
			gxBackPainter: "BottomBarBack",
			gxLayerZPosition: 1,
			gxLayout: [ 
                "H:|-0-[self]-0-|",
                "H:[doneButton(100)]-12-|",
                "H:[self]-(<=0)-[doneButton]&alignCenterY" ],  // center vertically
			gxChildViews: {
				doneButton: {
                    "+": "ButtonView",
                    gxTitle: "Done",
					gxValueKey: "doneBtn",
					gxDisableOnNil: true,
					axDescription: "Done editing presets",
				}
			}
		}
	}
},

	
// MARK: preset item


PresetsSheetItemView: {
	"+": "PresetItemBase",
	gxLateLayout: [
		"V:|-(-999)-[self(31)]",	// vertical position set by parent

        "H:[deleteButton(24)]",
		"H:|-8-[presetIcon]-2-[presetName]-2-[deleteButton]-8-|",
		"V:|-(2@999)-[presetName(24)]-(2@999)-|",
		"V:|-(>=2)-[presetIcon(24)]-(>=2)-|",
        "V:|-(>=2)-[deleteButton(24)]-(>=2)-|",
	],
	gxChildViews: {
		presetIcon: {
			"+": "PresetIconBase",
			gxValueKey: "iconMarkup",
		},
		presetName: {
			"+": "PresetNameBase",
		},
        deleteButton: {
            "+": "MinusButton",
            gxValueKey: "deleteBtn",
            axDescription: "Delete preset",
        }
	}
},
})


markup.push({


// MARK: - presets window

    PresetsWindow: {
        nsClass: "GXWindow",
        gxWindowTitle: "Presets",
        gxWindowMaxSize: "320, 2000",
        gxWindowMinSize: "320, 230",
        gxInitialWindowSize: "320, 250",
        gxInitialWindowPosition: "0.3, 0.3",
        nkWindowSizeKey: "NodeKitSharedPresetsWindow",
        gxBackColor: "BackColor2",
        gxContentView: "PresetsWindowContentView"
    },


    // MARK: content view

    PresetsWindowContentView: {
        nsClass: "GXDrawView",
        gxLayout: [
            "H:[self(320)]",

            "V:[titleBarView]-0-[titleGroup(38)]-0-[presetsScroller]-0-[bottomBar(36)]-0-|",

            "H:|-0-[titleGroup]-0-|",
            "H:|-0-[presetsScroller]-0-|",
            "H:|-0-[presetsList]-0-|",
        ],
        gxChildViews: {
            titleBarView: {
                "+": "TitleBarView",
                gxChildViews: {
                    windowTitle: {
                        "+": "WindowTitle",
                        gxDefaultValue: "Presets",
                    },
                },
            },
            titleGroup: {
                "+": "GroupView",
                gxLayout: [
                        "H:|-15-[groupTitle]-0-|",
                        "V:|-10-[groupTitle]",
                    ],
                gxChildViews: {
                    groupTitle: {
                        "+": "LabelView.useMarkup.left",
                        gxValueKey: "displayName",
                    },
                }
            },
            presetsScroller: {
                "+": "PresetsScrollerBase",
                gxDocumentView: {
                    "+": "PresetsScrollContentBase",
                    gxDeleteKey: "deleteBtn",
                    gxListItemView: "PresetsWindowItemView",
                }
            },
            bottomBar: {
                nsClass: "GXDrawView",
                gxBackPainter: "BottomBarBack",
                gxLayerZPosition: 1,
                gxLayout: [ "H:|-0-[self]-0-|",
                            "H:[deleteBtn(24)]-14-|",
                            "H:[self]-(<=0)-[deleteBtn]&alignCenterY" ],  // center vertically
                gxChildViews: {
                    deleteBtn: {
                            "+": "MinusButton",
                            gxTitle: "<minusButton/>",
                            gxValueKey: "deleteBtn",
                            gxDisableOnNil: true,
                            axDescription: "Delete selected sessions",
                        }
                    }
            }
        }
    },


    // MARK: preset item


PresetsWindowItemView: {
    "+": "PresetItemBase",
    gxLateLayout: [
        "V:|-(-999)-[self(31)]",    // vertical position set by parent

        "H:|-10-[presetIcon]-2-[presetName]-8-|",
        "V:|-3-[presetName(24)]",
        "V:|-3-[presetIcon(24)]",
    ],
    gxChildViews: {
        presetIcon: {
            "+": "PresetIconBase",
        },
        presetName: {
            "+": "PresetNameBase",
        }
    }
},


})


// MARK: - popover presets menu


function presetsGroup(styles)
{
    styles = styles || "useMarkup";

    return {
        nsClass: "GXDrawView",
        gxLayout: [
            "H:[self]-8-|",
            "V:[self]-8-|",
            "H:|-4-[presetsLabel(55)]-8-[presets(202)]-4-|&alignBaseline",
            "V:|-4-[presets(25)]-4-|"
        ],
        gxChildViews: {
            presets: {
                "+": "PopupMenuView." + styles,
                gxFaceModel: {
                    nsClass: "NKPresetsViewModel",
                },
                gxViewName: "presets",
                axTitle: "Presets",
                axHelp: "Create or use pre-sets for this effect",
            },
            presetsLabel: labelView("Presets:", "right")
        }
    };
}


