Menu widget and tabs

Hi! I’m very surprised about the improvements of this project!!! Thanks a lot!
I need a little help about new menu widget.

  1. Is it possible to use it to show/hide a tab element and go on it automatically?
  2. How to set all the tabs hide except one on startup?

How to do it?

Thanks a lot!
Walter

Hi,

Tab selection is defined by the value of the parent container (0 = first tab, 1 = second tab, etc). A tab can be completely hidden by setting its visible property to false.

Changing tab selection with a menu can be done using its script property (see docs) :

if (value == "some_menu_value") {
  set("tab_parent_id", DESIRED_TAB_INDEX)
}

If the menu’s values are ordered numbers we can use the value directly:

  set("tab_parent_id", value - 1) // assuming lowest value is 1

Handling the visibility can be done many ways, here’s one: we can make each tab’s visibility depend on the parent’s value:

  • tab 1: #{@{parent} == 0} (will return true if the first tab is selected, false otherwise)
  • tab 2: #{@{parent} == 1} (will return true if the second tab is selected, false otherwise)
  • etc

Another solution would be to simply hide the panel’s tab navigation with css and use text widgets as labels in tabs (thus making tabs visible only when selected).

Here is a session file that demonstrates both cases: tab_menu.json (17.6 KB)
Relevant properties:

  • case 1
    • menu_1.script
    • tab_1.visible, tab_2.visible, etc
  • case 2
    • menu_2.script
    • panel_2.css
1 Like

ok thanks.
but what is the correct syntax of following code?

if (value == “1”) {
tab_1.visible=true;
tab_2.visible=true;
tab_3.visible=false
}

There is no correct syntax for this, you can’t set a property directly from a script, you need to create a variable widget, set its value (using set()) and use its value in the property with the @{} syntax.

Thanks so much for this example, really illuminating! In the case_2 example you posted above, how would you go about making this still work if you wanted menu labels such as ‘Osc’, ‘Seq’ etc instead of ‘1’, ‘2’ and ‘3’. Apologies if this is a really basic question to answer, new to Open Stage Control (fantastic software, just discovered it yesterday!) and not much of a scripter!

You can change the tab’s label property without changing anything else, the tab container’s value will always be an integer between 0 and the number of tabs minus one.

I was able to change the tab label okay, it was the menu itself that seemed to break the code if I changed it from anything other than numerics. I tried something like this (after changing the menu values from '1, 2 and 3):

if (value == “OSC”) {
set(“panel_2”, value 0 )}

etc

in the script parameter of the menu in place of:

set(“panel_2”, value - 1)

but I clearly have got this wrong, as this broke the working code you had set up initially!

I actually managed to do this okay on the case 1 example, but had some strange behaviour when adding widgets; whenever I changed the tab, all of the faders would dissapear unless they were clicked on (this doesn’t happen on the case 2 example.

I obviously have a great deal to learn about how to use this software properly! Thanks very much for any assistance with this!

You can set the menu's label to "%key" and its values as follow:

{
  "osc": 1,
  "seq": 2,
  "etc": 3
} 

Otherwise, the solution you tried could work with a bit of syntax cleaning:

if (value == "OSC") { // careful: case-sensitive
  set(“panel_2”, 0) // not "value 0" which doesn't make sense in javascript
} else if (value == "SEQ") {
  // etc
}

I actually managed to do this okay on the case 1 example, but had some strange behaviour when adding widgets; whenever I changed the tab, all of the faders would dissapear unless they were clicked on (this doesn’t happen on the case 2 example.

Sorry but the issue is not clear to me, maybe try explaining it differently ?

1 Like

Thanks so much for the help with this, top support! I had read about %key but hadn’t really understood it properly until now, this is working a treat, excited to get building a template using this now!

I probably haven’t explained the second issue I had (with case 1 you suggested), but I will attach the json on here if you have time to have a look. I have a matrix with five faders on the tab labelled ‘SEQ’ and every time I change tab and then go back, all the faders disappear (until you click them again). I am sure I am just missing something really obvious, but couldn’t work it out! Many thanks

TabVisibilitytest.json (30.3 KB)

That's a bug :slight_smile: (edit: fixed in sources)

That’s good to know I hadn’t necessarily set something up wrong there at least! Case 2 works perfectly anyway so I am really happy with this solution, so thanks very much for all your help!