Both sides previous revisionPrevious revision | Next revisionBoth sides next revision |
custom:javascript:lib:ddlightbarmenu.js [2019/05/12 20:13] – Renamed menuTitle to topBorderText, and added a bottomBorderText propery. nightfox | custom:javascript:lib:ddlightbarmenu.js [2020/04/01 11:49] – Added information about the scrollbar feature nightfox |
---|
dd_lightbar_menu.js is a loadable JavaScript file that provides a lightbar menu class for use in JavaScript scripts for Synchronet. The DDLightbarMenu class supports single item selection and multiple item selection. For one example of how to use DDLightbarMenu, you can look at the code for ''[[howto:door:slyvote]]''.\\ | dd_lightbar_menu.js is a loadable JavaScript file that provides a lightbar menu class for use in JavaScript scripts for Synchronet. The DDLightbarMenu class supports single item selection and multiple item selection. For one example of how to use DDLightbarMenu, you can look at the code for ''[[howto:door:slyvote]]''.\\ |
\\ | \\ |
The user can navigate the list using the up & down arrows, PageUp, PageDown, Home, and End keys. The enter key selects an item. The ESC key will exit the menu and return null. This menu library requires the use of an ANSI terminal. By default, this menu library does not display a border around the menu. If you want this library to draw a border around the menu, you can set the borderEnabled property to true. Without a border, the menu gains 2 characters of width and 2 lines of height. | The user can navigate the list using the up & down arrows, PageUp, PageDown, Home, and End keys. The enter key selects an item. The ESC key will exit the menu and return null. This menu library requires the use of an ANSI terminal. By default, this menu library does not display a border around the menu. If you want this library to draw a border around the menu, you can set the borderEnabled property to true. Without a border, the menu gains 2 characters of width and 2 lines of height. Also, a scrollbar can be optionally displayed, which provides a visual indicator for how far the user is through the list of items. The scrollbar is disabled by default. |
| |
dd_lightbar_menu.js provides a class, DDLightbarMenu. To create a new DDLightbarMenu object: new DDLightbarMenu(x, y, width, height); | dd_lightbar_menu.js provides a class, DDLightbarMenu. To create a new DDLightbarMenu object: new DDLightbarMenu(x, y, width, height); |
| colors | object | An object that contains color codes (as strings) for various things. Contains the following properties: itemColor, selectedItemColor, itemTextCharHighlightColor, borderColor | | | colors | object | An object that contains color codes (as strings) for various things. Contains the following properties: itemColor, selectedItemColor, itemTextCharHighlightColor, borderColor | |
| borderEnabled | boolean | Whether or not to draw a border around the menu items | | | borderEnabled | boolean | Whether or not to draw a border around the menu items | |
| | scrollbarEnabled | boolean | Whether or not to enable the scrollbar. Defaults to false. | |
| wrapNavigation | boolean | Whether or not to wrap around to the beginning/end when using the down/up arrows. Defaults to true. | | | wrapNavigation | boolean | Whether or not to wrap around to the beginning/end when using the down/up arrows. Defaults to true. | |
| hotkeyCaseSensitive | boolean | Whether or not hotkeys are case-sensitive. Defaults to false. | | | hotkeyCaseSensitive | boolean | Whether or not hotkeys are case-sensitive. Defaults to false. | |
To enable borders, set the borderEnabled property to true. Example: | To enable borders, set the borderEnabled property to true. Example: |
lbMenu.borderEnabled = true; | lbMenu.borderEnabled = true; |
| |
| To enable the scrollbar, set the scrollbarEnabled property to true. Example: |
| lbMenu.scrollbarEnabled = true; |
| If borders are enabled, the scrollbar will appear just inside the right border. Also, if the scrollbar is enabled but all the items would fit in a single "page" in the menu, then the scrollbar won't be displayed.\\ |
| The scrollbar uses block characters to draw the scrollbar: ASCII character 176 for the background and ASCII 177 for the block that moves on the scrollbar. If you want to change those characters, you can change the scrollbarInfo.BGChar and scrollbarInfo.blockChar properties in the menu object.\\ |
| By default, the scrollbar colors are high (bright) black for the background and high (bright) white for the moving block character. If desired, those can be changed with the colors.scrollbarBGColor and colors.scrollbarScrollBlockColor properties in the menu object. |
| |
The menu object has an object called borderChars, which stores the characters used to draw the border. you can change the characters used to draw the border by setting the following properties of the borderChars object: | The menu object has an object called borderChars, which stores the characters used to draw the border. you can change the characters used to draw the border by setting the following properties of the borderChars object: |