Control.Menu

Before proceeding you may want to read our getting started page.

What does this control do?

This control lets the user interact with customized drop-down menus.

How to use it

In order to use this control, paste this line of javascript right at the beginning of your script tag:

Meteora.uses('Control.Menu');

You need to setup a div that will act as a container for the Menu.

<div id="div_id"></div>

You may then by able to create the Menu this way:

new Menu(
 
  // ELEMENT
  // The Menu will be nested inside this element.
  // You may use an element's id or an HTML element's reference here.
  'div_id',

  // ITEMS
  // An array of menu items
  [
    {
      // First item
      'label': 'First item',
      'onClick': function() { firstElementClick() },
      'items': [
        {
          // SUBITEM
          // Subitems have the same syntax, they can even
          // have their own subitems
          'label': 'Subitem'
        }
      ]
    },
    {
      // Second item
    },
    {
      // Third item
    }
  ]
);
Here goes another example:
var menu1 = new Menu(

  'placeholder_id',

  // An array of menu elements
  [
    // this tuple is a menu element
    {
      'label': 'File...',
      // each menu element can have its own nested submenus
      'items': [
        {
        'label': 'Open',
        // and there is no limit for nested submenus
        'items': [
            {
              'label': 'Recent',
              'onClick': openRecent.bind()
            },
            {
              'label': 'New',
              'onClick': openNew.bind()
            }
          ]
        }
      ]
    },
    ...
    more menu elements
    ...
  ]
);