Posts Tagged ‘command menu’

webOS command menu icons

The list of standard icons for the command menu buttons aren’t found anywhere in the developer documentation.

webOS command menu

h/t to Jason Robitaille for his post on the precentral.net forums with the list of icons pulled from /usr/palm/frameworks/mojo/submissions/175.7/stylesheets/global-menus.css

/* Example Icons */

.palm-menu-icon.back { background-image: url(../images/menu-icon-back.png); }
.palm-menu-icon.forward { background-image: url(../images/menu-icon-forward.png); }
.palm-menu-icon.refresh { background-image: url(../images/menu-icon-refresh.png); }
.palm-menu-icon.search { background-image: url(../images/menu-icon-search.png); }
.palm-menu-icon.new { background-image: url(../images/menu-icon-new.png); }
.palm-menu-icon.stop { background-image: url(../images/menu-icon-stop.png); }
.palm-menu-icon.attach { background-image: url(../images/menu-icon-attach.png); }
.palm-menu-icon.compose { background-image: url(../images/menu-icon-compose.png); }
.palm-menu-icon.conversation { background-image: url(../images/menu-icon-conversation.png); }
.palm-menu-icon.delete { background-image: url(../images/menu-icon-delete.png); }
.palm-menu-icon.file { background-image: url(../images/menu-icon-file.png); }
.palm-menu-icon.forward-email { background-image: url(../images/menu-icon-forward-email.png); }
.palm-menu-icon.info { background-image: url(../images/menu-icon-info.png); }
.palm-menu-icon.priority { background-image: url(../images/menu-icon-priority.png); }
.palm-menu-icon.reply-all { background-image: url(../images/menu-icon-reply-all.png); }
.palm-menu-icon.reply { background-image: url(../images/menu-icon-reply.png); }
.palm-menu-icon.save { background-image: url(../images/menu-icon-save.png); }
.palm-menu-icon.send { background-image: url(../images/menu-icon-send.png); }
.palm-menu-icon.sync { background-image: url(../images/menu-icon-sync.png); }
.palm-menu-icon.edit-profile { background-image: url(../images/menu-icon-edit-profile.png); }
.palm-menu-icon.make-vip { background-image: url(../images/menu-icon-make-vip.png); }
.palm-menu-icon.new-contact { background-image: url(../images/menu-icon-new-contact.png); }
.palm-menu-icon.remove-vip { background-image: url(../images/menu-icon-remove-vip.png); }
.palm-menu-icon.down { background-image: url(../images/menu-icon-down.png); }

Use the name after “.palm-menu-icon.” when setting up the command menu model.

this.cmdMenuModel = {
visible: true,
items: [
{items:[{label: $L('Add'), icon:'new', command:'
cmd-add'}]},
{items:[{label: $L('Refresh'), icon:'refresh', command:'
cmd-refresh'}]}
]
};