Javascript menu for iPhone, Android and iPad

Create a javascript UI keyboard/Menu for iPhone, Android and iPad

## Deliverables

Create a javascript UI keyboard/Menu for iPhone, Android and iPad

Specs:

Menu is located on the top part of the device.

Menu will always have the same size regardless of screen zoom ??" see enclosed working demo, use it.

Menu will resize icons automatically (see enclosed code)

Menu is opened by pressing a status icon that is located on the top left side of the screen, this icon is 50% transparent and opens only after 1 second of touch (see the enclosed code)

Adjust menu for iPhone, iPad and Android .

On clicking a menu item:

1.? ? ? ? ? ? Menu buttons are lit with glow when pressed

2.? ? ? ? ? ? Event function called after 0.5 seconds (programmable, see enclosed code) ??" this creates a comfortable feeling for the user.

Menu buttons are located on a semi-transparent background ??" see example

When menu opens it: Fades in + Slides in 0.5 seconds (programmable)

When menu closes : Fades out + Slides out in 0.5 seconds (programmable)

On screen dragging ??" make menu’s disappear with CLOSE effects and re-appear when dragging stopped with OPEN effects. (see enclosed code)

Menu is programmable:

**MenuX = CreateMenu(x,y)**? // 5 columns and 4 rows ??" see example (5x4)

**SetMenuButton** (

**X,Y**, // place in the grid

**Icon**, // normal icon png

**glowIcon**, // glow icon png

**KeyID**, // ID for key identification

**Sticky,** // Boolean, this is to allow pressing CTRL and ALT and DEL. Means that the button is pressed BUT the OnSelected is not called. If a stick key hit twice then onSelected is called. If CTRL is hit it glows, ALT is hit and it glows too and a not stick DEL is hit the onSelected function returns (CTRL,ALT,DEL)

**CloseOnHit.** // if true - close AFTER onSelected, so that when new menu opens this one closes creating a nice effect.

**onSelected**, ß Function(keys) {…} , this function will be called on selection, after the 0.5 waiting period. Pass the selected keys (one or more)

**)**

**SetStatusIcon**(// set image for status icon and description

**img**, // img to show

**desc** // description to show for 2 seconds, i.e. “Mouse Hover Selected??);

**CloseAllMenus ()** ??" close all menus …

**OpenMenu(n)** ??" opens a specific menu

**CloseMenu(n)** ??" closes a specific menu

**TESTS** ??" please conduct thorough tests of the javascript on iPhone, iPad and Android phones.

**Provide with a working html example as well**

## Platform

android, iphone, ipad

iPhone JavaScript Käyttöliittymä/informaatioarkkitehtuuri

Projektin tunnus: #2992584

Tietoa projektista