https://github.com/mwbrooks/cordova-plugin-menu

Native Menu Plugin for Apache Cordova and PhoneGap.
https://github.com/mwbrooks/cordova-plugin-menu

Last synced: 2 months ago
JSON representation

Native Menu Plugin for Apache Cordova and PhoneGap.

• Host: GitHub
• URL: https://github.com/mwbrooks/cordova-plugin-menu
• Owner: mwbrooks
• License: mit
• Created: 2011-04-25T23:59:56.000Z (over 13 years ago)
• Default Branch: master
• Last Pushed: 2012-12-04T22:00:45.000Z (about 12 years ago)
• Last Synced: 2024-05-02T05:38:27.515Z (8 months ago)
• Language: JavaScript
• Homepage:
• Size: 6.66 MB
• Stars: 67
• Watchers: 12
• Forks: 33
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Native Menu Plugin for Apache Cordova

## Overview

The cordova-plugin-menu provides an HTML interface to define a

menu types. Each Cordova platform will then render the appropriate

native menu from the HTML.

The implementation is loose polyfill of the [W3C HTMLMenuElement](http://dev.w3.org/html5/spec/single-page.html#the-menu-element).

## Platform Support

- Android

- BlackBerry 10

- iOS

## Example

    

        

        

    

    

        

        

        

        

    

## HTML API

Menus and commands are defined in the DOM and represented as HTML.

Similar to other HTML elments, you can define the role of the menu and commands

with HTML attributes. During runtime, you can interact with the menu and commands

using JavaScript.

<menu> API

------------------

__<menu type="toolbar">__

Create a toolbar menu.

- Android: Creates a title bar.

- BlackBerry: @DISCUSS

- iOS: Creates a native ToolBar. The Cordova webview is repositioned below the toolbar.

__<menu type="context">__

Create a context menu. This menu is typically invoked by the device's menu button.

- Android: Creates an Android menu that is invoked by the menu button.

- BlackBerry: Creates a BlackBerry menu that is invoked by the menu button.

- iOS: Creates a native TabBar. The Cordova webview is repositioned above the TabBar.

__<menu label="Home">__

Add a title to the menu. The title will behave differently for a `type="toolbar"` and `type="context"` menu.

- Android: Ignored because context menus do not have titles.

- BlackBerry: Ignored because context menus do not have titles.

- iOS: A title is added to the ToolBar but ignored for the TabBar.

<command> API

----------------------

__<command label="toolbar">__

Add a title to a command button.

__<command icon="context">__

Add an icon image to a command button.

__<command disabled="true">__

Enable or disabled a command button.

- Android: Disabled commands are hidden.

- BlackBerry: Disabled commands are hidden.

- iOS: Disabled commands are faded.

__<command action="Home">__

Attach callback function or JavaScript expression to a command.

Inline HTML can use a JavaScript expression such as:

    

    

JavaScript can attach callback functions as such:

    // get a handle to a command element

    var cmd = document.getElementById('someCommandId');

    // anonymous function

    cmd.setAttribute('action', function() {

        console.log('hello from an anonymous function!');

    });

    // function handle

    var callback = function() {

        console.log('hello from a callback function!');

    });

    cmd.setAttribute('action', callback);

JavaScript API

--------------

Similar to other HTML elements, you can create and manipulate `` and `` using JavaScript.

HTML:

    

        

    

JavaScript:

    var menu = document.createElement('menu');

    menu.setAttribute('type', 'toolbar');

    document.body.appendChild(menu);

    var command = document.createElement('command');

    command.setAttribute('label', 'Home');

    command.setAttribute('action', function() {

        console.log('Home');

    });

    menu.appendChild(command);

Want to contribute?

-------------------

### Report or fix an issue

We use [GitHub Issues](https://github.com/mwbrooks/cordova-plugin-menu/issues)

By the way, you rock! Thanks for helping us improve cordova-plugin-menu!

### Pull Requests

Pull requests are welcome!

We appreciate the use of topic branches.

    git checkout -b issue_23

    # code

    git commit -m "Issue 23: Fix a bad bug."

    git push origin issue_23

    # send pull request from branch issue_23 to mwbrooks:master