Sample Right menu Image

These are possible properties for all menu-items. These properties should be applied to static menu items. Each property listed can also take a function as long as it returns the type listed.

property	type	default value	restricted values	description	example
displayName	string			Text that will be displayed in the menu item.	"My Menu Item"
appId	string	""		Used to identify the menu-item and highlighting.	"myMenuItem"
action	string	""		The action to take when the user has clicked on the menu item. This string will be ran as JavaScript.	"window.app.ObtainMenu('su', '{{targetRef}}', 'myMenu', "+ setttingsDict.toAxonCode+")" "window.app.LoadApplication('someUriPath') "finstack.eval('myForm()')"
icon	string	""		Icon that will appear to the left of the displayName.	"icon-battery-full"
iconType	string	"class"		Type of icon. This will typically be "class".	"class"
iconClass	string	""
rightIcon	string	""		Icon that will appear to the right of the displayName, between the displayName and badge.	"icon-battery-full"
rightIconType	string	"class"		Type of icon.	"class"
rightIconTooltip	string	""		Tooltip that will appear when the mouse cursor hovers over the icon.	"This is an icon."
hasBadge	bool	false	<true\|false>	Adds a badge to the right of the displayName	true
badgeValue	string or int	""		The value that will be displayed within the badge. Can be a number or a string.	"In fault" or 10
badgeType	string	"normal"	"<normal\|error\|success\|focus>"	Adds color to the badge. Normal is no color, error is red, success is green, focus is blue.	"normal"
badgeTooltip	string	""		Tooltip that will appear when the mouse cursor hovers over the badge.	"This is a badge."
keepOpen	bool	false	<true\|false>	Keeps the right-side menu open after clicking on menu item.
classes	string	""	"<mobile-hidden\|tablet-hidden\|desktop-hidden>"	Hides a menu item on certain devices. Based after pixel length. NOTE: "tablet-hidden" hides on tablet screens and larger.	"mobile-hidden"
level	int	0		The level of indentation of a menu item.
order	int	99		The order in which menu-items are sorted before being sorted alphabetically. On the main menu: The "End User Apps" divider is -1000, the "System Integrator Apps" divider is 10, the "Advanced Apps" is 9990. In all menu's that include the pre-defined back button, the main divider is set to -1000 and the back button to -1100.
isDivider	bool	false	<true\|false>	If set to true, the menu item will be rendered as a divider. In this case only a displayName is required.
ignoreSettings	marker	null	no value	If this tag is present, the menu items will not be apply the passed settings to the menu item. (See settings properties below)
submenu	JSON formatted string	""	A dict with 2 properties: startOpen: <true\|false> items: List of dicts where each dict is a submenu-item.	Adds a sliding feature that houses a submenu. In axon, This will be a dict that is run through the toJSON() function. NOTE: On desktops this can fit up to 4 sub-menu items before closing the slider becomes difficult. On smaller devices such as phones, 3 is the max.	{ startOpen: false, items:[ { label:"Item 1", icon: "icon-tags", tooltip: "SubMenu item 1", action: "finstack.eval('myForm()'), keepOpen: true } ] }.toJSON()
progressBar	JSON formatted string	""	A list of dics.	Adds a bar that is filled based of a percentage. In axon this will be a list of dicts that is ran through the toJSON() function.	[{percent:48, label: "Amount Used" }].toJSON()
body	string	""	string	The contents of the string get added into the menu item as embedded HTML. NOTE: This requires that the ignoreSettings tag is on the menu item.	"<p>This is a paragraph with an image <img src=\"image.png\"></p>"

Additional Notes

Here are some additional notes on the more complex properties stated above:

action

With the action property three different possible actions exist: opening a new menu, running a function, opening a new app. Each of these action must be a string.

To open a new menu use the FinStack JS function ObtainMenu, formatted as "window.app.ObtainMenu('username', 'recId', 'appName', settings)"
1. username is the current user logged in. can be found using context() function.
2. recId is the id of a record as a string. The current location can be used by setting this parameter as '{{targetRef}}'
3. appName is name of the menu to be opened. Typically the same as the appId of the menu-item.
4. settings is a dict of properties that will be applied to each menu-item in the new menu.
To open an app in the main content window use the FinStack JS function LoadApplication, formatted as "window.app.LoadApplication('url')"
To open a form or run a axon function use finstack.eval, formated as "finstack.eval('myForm()')"

submenu

Possible properties for submenus include:

label: equivalent to displayName property for menu-items
icon: same as icon property for menu-items
tooltip: equivalent to iconTooltip property for menu-items
action: same as action property for menu-items
keepOpen: same as keepOpen property for menu-items

progressBar

Both properties for progressBars can also be a function as long as they return the correct type:

percent: Sn integer that will also fill in the progress bar.
label: A string that appears above the progress bar.

Settings Properties

The following properties are genereric propties to be include in the settings dictionary when creating a menu item that navigates to a new menu. Generally speaking, funcCall and display are required.

property	type	default value	restricted values	description	example
funcCall	string			This should be a function or query that will create/find items that will become menu-items.	"mySubMenuItems()"
header	string	""		Every new menu has a header and a back-button that takes the user back to the main menu. This holds the string that will be displayed in the default header,	"My Menu"
display	string		properties on the records found with funcCall	If used instead of displayName, this contain the name of a string property that will found on the menu-items created/ queried by funcCall.	"name"
paginateCount	int	25		Indicates how many items will be shown before a menu is split into several pages.
folderPathCount	int	10		How many items will show below
hideBackButton	bool	false	<true\|false>	Every new menu has a header and a back-button that takes the user back to the main menu. Setting this property will hide both the back button and header.

The following properties are not required. These properties are used to apply the corresponding property to all items returned in the funcCall (either by a function or a query).

property	type	default value	restricted values	description	example
action	string	""	starts with: "<func:\|openMenu:\|openApp:>"	The action the menu-item takes when it is clicked. "func:" signifies a function to be ran, "openMenu:" signifies a new menu to be opened, "openApp:" signifies another app to open in the main window.	"openMenu:'su', '{{targetRef}}', 'myApp', {funcCall: 'openMyMenu()', display:...} " "openApp:someAppUriPath" "func:myRandomFunc()"
displayFunc
orderFunc
levelFunc
iconTypeFunc
iconFunc
iconTooltipFunc
iconClassFunc
rightIconFunc
rightIconTypeFunc
rightIconTooltipFunc
keepOpenFunc
hasBadgeFunc
badgeTooltipFunc
badgeValueFunc
badgeTypeFunc
progressbarFunc
submenuFunc
classesFunc

Right-Side Menu Properties