Script Panel Properties Related with Popup Menu

[Evan C.]

Hello, guys!

I am going to show popup list with selected check marks and split lines. I have tried to find such properties for ScriptPanel and I have just found following codes in ScriptingApiContent.cpp.

propertyIds.add("borderSize");					ADD_AS_SLIDER_TYPE(0, 20, 1);
propertyIds.add("borderRadius");				ADD_AS_SLIDER_TYPE(0, 20, 1);
propertyIds.add("opaque");					ADD_TO_TYPE_SELECTOR(SelectorTypes::ToggleSelector);
propertyIds.add("allowDragging");				ADD_TO_TYPE_SELECTOR(SelectorTypes::ToggleSelector);
propertyIds.add("allowCallbacks");				ADD_TO_TYPE_SELECTOR(SelectorTypes::ChoiceSelector);
propertyIds.add("popupMenuItems");			ADD_TO_TYPE_SELECTOR(SelectorTypes::MultilineSelector);
propertyIds.add("popupOnRightClick");			ADD_TO_TYPE_SELECTOR(SelectorTypes::ToggleSelector);
propertyIds.add(Identifier("popupMenuAlign"));	ADD_TO_TYPE_SELECTOR(SelectorTypes::ToggleSelector);
propertyIds.add(Identifier("selectedPopupIndex"));
propertyIds.add(Identifier("stepSize"));		

Here you can see "selectedPopupIndex" property and it is just related with selected item in popup list.
But this property doesn't work.

	Content.setPropertiesFromJSON(name, {
	"saveInPreset": 1,
	"width": 500,
	"height": 500,
	"allowCallbacks": "Clicks, Hover & Dragging",
	"popupMenuItems": fx_effect_lists.length > 1 ? fx_effect_lists.join("\n") : "",
	"selectedPopupIndex": 1,
	"opaque": true,
	});

I tried to use "1" as the value of this property but it didn't work neither.
Please help me if anyone knows about this.
And also let me know how to add separate line in popup list.

Thanks.

[Christoph Hart]

Welcome Hasan,

you came pretty far without asking :)

The selectedPopupIndex is not supposed to be a static property, but you can use it in the mouse callback to set the selected item:

const var Panel = Content.addPanel("Panel", 15, 9);
// [JSON Panel]
Content.setPropertiesFromJSON("Panel", {
  "width": 161,
  "height": 31,
  "allowCallbacks": "Context Menu",
  "popupMenuItems": "A\nB\nC\nD",
  "popupOnRightClick": false,
  "popupMenuAlign": true
});
// [/JSON Panel]

Panel.setMouseCallback(function(event)
{
	if(event.result)
	{
                // the index is zero based, but event.result == zero means no selection so you need to subtract 1
		Panel.set("selectedPopupIndex", event.result-1); 
	}
});

As for separate line, do you mean the thing created with PopupMenu::addSeparator()? This isn't possible yet, but I'll add support for this if you need it.

[Evan C.]

Hello Christoph Hart,

I have tried according to you, but it does not show selected item in menu list.
It just shows following error...

Script Processor:! onInit: Line 644, column 16: the property does not exist

These are my codes.

const var PanelTemp = Content.addPanel("PanelTemp", 15, 9);
// [JSON PanelTemp]
Content.setPropertiesFromJSON("PanelTemp", {
  "width": 161,
  "height": 31,
  "allowCallbacks": "Context Menu",
  "popupMenuItems": "A\nB\nC\nD",
  "popupOnRightClick": false,
  "popupMenuAlign": true
});
// [/JSON PanelTemp]

PanelTemp.setMouseCallback(function(event)
{
	if(event.result)
	{
	        // the index is zero based, but event.result == zero means no selection so you need to subtract 1
		PanelTemp.set("selectedPopupIndex", event.result-1); 
	}
});

Please let me know why it shows such error.
And PopupMenu::addSeparator() is just what I want. And also I want to add the feature to enable/disable menu item in popup menu list.

Thanks for your support.

[Evan C.]

My HISE version is 0.99 and build version of it is 647.

I think you can easily add the feature of separator, something like using "-" as the separator string in the string list.

[Christoph Hart]

Are you using the most recent version on GitHub? I just added this feature a few days ago.

And I'll add separators and deactivated items.
I propose using ___ (three underscores) as separator string and ~~deactivated Item~~ for deactivated items (that's strikethrough in Markdown).

I don't know if you need it but you can already make nested popup menus with the syntax SubMenu::Item

[Christoph Hart]

Didn't read your last post. Let me know if you need a current build (also which OS you are working on).

[Evan C.]

Yes, I knew how to add SubMenu as well. I found such codes in GitHub sources. And I am just using most recent version on GitHub and also HISE standalone as well.
I prefer to know how to build HISE standalone with sources of GitHub repository.
Otherwise, I will be appreciate if you provide me recent Win8.1 x64 and macOS Sierra builds.
Thanks a lot.

[Christoph Hart]

There are build instructions in the GitHub Readme

[Christoph Hart]

Alright, I pushed these changes to GitHub. You can now do this:

const var Panel = Content.addPanel("Panel", 55, 0);
// [JSON Panel]
Content.setPropertiesFromJSON("Panel", {
  "width": 153,
  "height": 30,
  "allowCallbacks": "Context Menu",
  "popupMenuItems": "**This is a header**\n___\nA\nB\n~~Not active~~\nC",
  "popupOnRightClick": 0,
  "popupMenuAlign": 1
});
// [/JSON Panel]

I also added the section headers - just use the Markdown Syntax for **bold**. Be aware that Section Headers and Separators don't have an index (deactivated items still do).

[Christoph Hart]

This is a small helper function that deactivates items in a ScriptPanel:

/** Deactivates an item in a custom popup. */
inline function deactivatePopupItem(widget, index, isDeactivated)
{
	local list = widget.get("popupMenuItems").split("\n");
	if(isDeactivated)
	{
		if(list[index].indexOf("~~") != -1)
			return;
			
		list[index] = "~~" + list[index] + "~~";
	}
	else
	{
		list[index] = list[index].replace("~~", "");
	}
	
	widget.set("popupMenuItems", list.join("\n"));
}

deactivatePopupItem(Panel, 1, true);

[Evan C.]

Those are really nice and easy to implement. Now I made a nice popup menu by using above stuffs.
Many appreciate, Christoph!

[Evan C.]

I also added the section headers - just use the Markdown Syntax for **bold**. Be aware that Section Headers and Separators don't have an index (deactivated items still do).

I have added Section Header with bold but it is having an index. Would you check and fix it?

[Christoph Hart]

Yeah I'll take a look.