Tooltips for MenuItem and use arrow key to navigate MenuButton

[ESherbakova]

1. v83p_2014-01-17

2. Firefox 12.

Question:

isc.Menu.create({
    ID: "menu",
    autoDraw: false,
    showShadow: true,
    shadowDepth: 10,
    data: [
        {title: "New", keyTitle: "Ctrl+N", icon: "icons/16/document_plain_new.png"},
        {title: "Open", keyTitle: "Ctrl+O", icon: "icons/16/folder_out.png"}
    ]
});

isc.MenuButton.create({
    ID: "menuButton",
    title: "File",
    width: 100,
    menu: menu
});

Is there any way to add tooltip to the menuItem New and Open? I have tried showHover and HoverHtml but they dont work.

isc.Menu.create({
    ID: "menu",
    autoDraw: false,
    showShadow: true,
    shadowDepth: 10,
    data: [
        {title: "New", keyTitle: "Ctrl+N", icon: "icons/16/document_plain_new.png"},
        {title: "Open", keyTitle: "Ctrl+O", icon: "icons/16/folder_out.png"}
    ]
});

isc.HStack.create({
    ID:"starsLayout",
    top:50, membersMargin:10, layoutMargin:10, showEdges:true,
    animateMembers:true,
    members:[
        isc.MenuButton.create({
    ID: "menuButton1",
    title: "File1",
    width: 100,
menu: menu

}),
       isc.MenuButton.create({
    ID: "menuButton2",
    title: "File2",
    width: 100,
menu: menu
})
    ]
})

If we have focus on menuButton2, is there anyway to press the left arrow key to navigate to the menuButton1?

[Isomorphic]

Menu inherits from ListGrid, so you can use cellHoverHTML (plus canHover:true and showHover:true) to show a custom hover prompt.

isc.Menu.create({
    ID: "menu",
    autoDraw: false,
    showShadow: true,
    shadowDepth: 10,
    canHover:true, showHover:true,
    cellHoverHTML:function (record) {
      if (record && record.title=="New") return "Create a New Thing";
      return null;
    },
    data: [
        {title: "New", keyTitle: "Ctrl+N", icon: "icons/16/document_plain_new.png"},
        {title: "Open", keyTitle: "Ctrl+O", icon: "icons/16/folder_out.png"}
    ]
});
... other code

On the Arrow key navigation - you could add an explicit keyPress handler to your button and check for isc.EventHandler.getKey() being "Arrow_Left".

You may also be interested in using the built in MenuBar class, which supports this, as well as other common menu-bar user interactons, like down-arrow to open menus, rollover to change open menus etc.

Regards
Isomorphic Software