Search code examples
javascriptfunctionpebble-js

Pebble.JS: Acces a menu object created in a function


In breef:

I have created a menu object in a function, but I cannot access that menu object in the main script.

The full explanation:

In the function createMyMenu() I do create a menu object with some items and the menu is shown. This works fine and the user can move up/down in the menu by using the buttons on the Pebble smartwatch.

Problem is that the user cannot select any items, just navigate in the menu.

If I create the menu object in the main script, I (of course) works just fine, but if I create the menu object in a function, the user can not select any menu item.

Question: How can I create a menu in a function and then use that menu object in the main script the same way as if the menu was created in the main script?

The code:

function createMyMenu()
{
// Some code to create the menu object myMenu. Works fine.
  myMenu.show();  // Also works fine, the menu and it contents are displayed.
  return myMenu; // No errors
}

And the script

mainMenu = createMyMenu(); // Create the menu.
mainMenu.on('select', function(e) // This does not seem to be executed. 
{
  // Code to execute when the user selects a menu item.
}

Solution

  • I solved the problem myself, så here is some working code:

    var UI = require('ui');
    
    function createMyMenu()
    {
    // Some code to create the menu object myMenu. Works fine.
    var myMenu = new UI.Menu({
      backgroundColor: 'black',
      textColor: 'white',
      highlightBackgroundColor: 'white',
      highlightTextColor: 'black',
      sections: [{
        title: 'My Menu',
        items: [{
          title: 'First Item',
          subtitle: 'first subtitle'
        }, { 
          title: 'second Item',
          subtitle: 'Second subtitle'
        }, {
          title: 'Third Item',
          subtitle: 'Third subtitle'
        }]
      }]
    }); 
    
     myMenu.show();  // Also works fine, the menu and it contents are displayed.
      return myMenu; // No errors
    }
    
    //***** THE SCRIPT ******
    
    var mainMenu = createMyMenu(); // Create the menu.
    mainMenu.on('select', function(e) // This does not seem to be executed. 
    {
      // Code to execute when the user selects a menu item.
        console.log('Button pressed');
        console.log('Selected item #' + e.itemIndex + ' of section #' + e.sectionIndex);
      console.log('The item is titled "' + e.item.title + '"');
    });