Versions Compared

Old Version 18

changes.mady.by.user Kimberly Cruz (Unlicensed)

Saved on

compared with

New Version 19

changes.mady.by.user Kimberly Cruz (Unlicensed)

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Sample Right menu Image

...

Menu-Items

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.

Code Block
"My Menu Item"

appId

string

""

““


Used to identify the menu-item and highlighting.

Code Block
"myMenuItem"

action

string

""

““


The action to take when the user has clicked on the menu item. This string will be ran as JavaScript.

Code Block
"window.app.ObtainMenu('su', '{{targetRef}}', 'myMenu', "+ setttingsDict.toAxonCode+")"
Code Block
"window.app.LoadApplication('someUriPath')
Code Block
"finstack.eval('myForm()')"

icon

string

""

““


Icon that will appear to the left of the displayName.

Code Block
"icon-battery-full"

iconType

string

"class"


Type of icon. This will typically be "class".

Code Block
"class"

iconClass

string

""

““




rightIcon

string

""

““

Icon that will appear to the right of the displayName, between the displayName and badge.

Code Block
"icon-battery-full"

rightIconType

string

"class"


Type of icon.

Code Block
"class"

rightIconTooltip

string

""

““


Tooltip that will appear when the mouse cursor hovers over the icon.

Code Block
"This is an icon."

hasBadge

bool

false

Code Block
<true|false>

Adds a badge to the right of the displayName

Code Block
true

badgeValue

string or int

""

““


The value that will be displayed within the badge. Can be a number or a string.

Code Block
"In fault" or 10

badgeType

string

"normal"

Code Block
"<normal|error|success|focus>"

Adds color to the badge. Normal is no color, error is red, success is green, focus is blue.

Code Block
"normal"

badgeTooltip

string

""

““


Tooltip that will appear when the mouse cursor hovers over the badge.

Code Block
"This is a badge."

keepOpen

bool

false

Code Block
<true|false>

Keeps the right-side menu open after clicking on menu item.


classes

string

““

""
Code Block
"<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.

Code Block
"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

Code Block
<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

Code Block
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.

Code Block
{ 


  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.

Code Block
[{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:

...

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()')"

Anchor
submenuDetails
submenuDetails
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

Anchor
progressBarDetails
progressBarDetails
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.

Code Block
"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,

Code Block
"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.

Code Block
"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

Code Block
<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

""

Code Block
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.

Code Block
"openMenu:'su', '{{targetRef}}', 'myApp', {funcCall: 'openMyMenu()', display:...} "
Code Block
"openApp:someAppUriPath"
Code Block
"func:myRandomFunc()"

displayFunc






orderFunc






levelFunc






iconTypeFunc






iconFunc






iconTooltipFunc






iconClassFunc






rightIconFunc






rightIconTypeFunc






rightIconTooltipFunc






keepOpenFunc






hasBadgeFunc






badgeTooltipFunc






badgeValueFunc






badgeTypeFunc






progressbarFunc






submenuFunc






classesFunc