ACP Style Library

The Analytica Cloud Platform (ACP) offers a variety of user-interface styles useful for web applications that aren't available in desktop Analytica. These include navigation styles with tabs across the top or down the left side, node styles, and Frame nodes and Tall nodes that embed tables and graphs in a Diagram. The ACP Style Library makes it much easier to select and explore these styles than setting special codes in the AcpStyles attributes of the model. You use the library from inside ACP and see their effects.You can then select options in the library in desktop Analytica which shows previews of their effects in ACP.

You can see a video of the ACP Style library in use in the Analytica Cloud Player (ACP) Webinar.

To use the ACP Style library

The easiest way to use the ACP Style library is from inside ACP. Start the model in ACP and from the Hamburger menu on the top right, select ACP Style library

(You can also ACP Style Library#Install the ACP Style library in Desktop Analytica as described below, although it's rare you would need to do that.)

When loading the ACP Style library into your model

If the model contains no previous model level AcpStyle settings, it shows this dialog:

Answer:

• Yes: To use the standard default settings-- outline style, tool tabs, no shadow on nodes
• No: To use the recommended settings -- top tabs, shadowed nodes.

Either way, you can modify all the settings afterwards.

If your model already contains one or more model level AcpStyles, which is likely if you used the ACP Style library before, it shows a slightly different dialog. You will be prompted to either change to the recommended defaults, or to keep the AcpStyles already present in the model.

Answer:

• Yes: To retain its existing settings
• No: To use the recommended settings -- top tabs, shadowed nodes.
  • Again, you can modify all the settings afterwards.
  • If you choose to retain existing settings, it will ask you to confirm...
    

If you answer yes, the Acp style library will reflect the existing settings. styles -- e.g. if your model contains the AcpStyle show_description:10, the relevant choice menu in the Acp style library will reflect this.

How to set ACP styles

After loading the ACP Style library, it will look like this:

You can see what each input does in the usual way: Move the mouse cursor over any input control to see a tooltip balloon explaining what it does.

Or, even simpler, you can just modify an input --(un)check a box or select from a menu-- to see its effect immediately. The default styles for tables and graphs show in the "Preview result" just to the right. Some options and icons, like the "Fly-in" option for Index menus, only appear when you move your cursor over Preview styles for results.

Make the ACP Style library ready for Import into another model

More details coming soon....

Install the ACP Style library in Desktop Analytica

Instead of loading the ACP style library from inside ACP, you can add it to your model in Desktop Analytica before uploading to ACP. You may rarely find a reason to do that. The ACP Style library is included as a standard Analytica library, but we recommend using the most recent ACP Style library version which you can download here: ACP style library.ana, since there have been major enhancements recently.

After downloading the library into a folder, you can read it into your model:

1. Make sure you are in edit mode.
2. Click File menu > Add Library...
3. Select ACP Styles.ana' from the folder into which you saved the file and click Open

The 'ACP Styles library' will appear in the diagram:

How to use the ACP Style library

After installing the library into your model, double-click the ACP Style library node to view its main control panel:

Click one of these buttons to open a dialog to select those styles and options:

• #Navigation styles: For tab styles, expandable module outline, window size, and other options to navigate the model in ACP.
• #Node styles:For styles to display nodes, balloon help.
• #Frame nodes: To select text nodes that display edit and result tables and graphs embedded in a user-interface diagram.

See below for details on each dialog.

Set ACP styles in Analytica, and view them in ACP

You use the ACP Style library to set styles in Analytica on the desktop, but you can only see their effect in ACP. (The ACP Style library does show some examples of what the styles look like.) After setting some ACP styles, you can see their full effect by uploading your model into ACP. You can do this quickly by selecting Publish to cloud... from the File menu. It lets you upload and run the model in your free individual ACP account, or in an ACP Group account if you have one.

The library is invisible in ACP. Once you have selected the ACP styles you want, you can delete the ACP Styles Library from your model. Your selections model will remain. The library file size is over 1 MB, so removing it from your model saves a little time when uploading and running the model in ACP.

Navigation styles

This dialog lets you configure the navigation style using the outline view, hierarchy header as in Analytica, or tabs across the top or down the left. You can also control the display of some elements such as those in the banner shown above the diagram. Click the Navigation styles button to get started.

The Navigation styles dialogue window opens...

The Navigation style pulldown menu selects ways to navigate the model: The Preview pane beneath the menus shows an example ACP interface with the options you have selected:

The Navigation style options are:

• Outline: With an expandable module hierarchy (see example below) that lets you quickly find the module you want to see, similar to the Outline window in Analytica on the desktop.

• Top diagram only: Shows in ACP as a single diagram, with no Outline or hierarchy or tabs. This is useful when creating a simple Web application with a single UI, and no need for any navigation. Prevents opening other diagrams with the AcpStyles#Top Diagram Only. flag You need to arrange, and size the diagram to display what you want users to see in ACP.

Tabbed Navigation styles: These show the main modules in your top model as tabs (ordered left to right then top to bottom). It is most useful for creating a web application for people not familiar with Analytica. It works best when you create a few modules at the top level with user inputs and outputs, showing input tables and result tables and charts in #Frame nodes. The Navigation style menu offers these options:

Single level tabs:

• Top tabs: Display the tabs left to right across the top of the diagram. For example:

• Side tabs: Display the tabs in a column on the left of the diagram. For example:

Two-level hierarchical tabs : Modules in the main model appear as top tabs (left tabs). Modules in those top level modules appear as subtabs. When you select a top-level tab, it shows its submodules as subtabs.

• Two top tabs
• Two side tabs

Other Navigation Options In the top pane of the Navigation style dialog:

These next two checkboxes are unusable - and so are hidden - when you have not selected a tabbed Navigation style.

• Include top level diagram as tab: Can be used only with 'Side tabs' or 'Top tabs'. You may check this checkbox to include the top model diagram as the leftmost tab for "Side tabs", or top tab for "Top tabs". If you uncheck this checkbox, the top diagram will not display in ACP, so you include the key user interface pages as modules in the main model. Currently for 2 level tabs it is required to exclude the top diagram from the tabs, so this checkbox is hidden. More...

• Show hierarchy: Lists the titles of the top, ancestor, parent, and current modules to show where you are in a model (see example below). You can click any ancestor to move up the module hierarchy, similar to the Show module hierarchy in Analytica on the desktop. Note that, to save screen space, the hierarchy does not display when it would be redundant, showing the same information displayed on the top tabs or side tabs, i.e. in the top levels of the model. The Show Hierarchy style is controlled by a checkbox in the Edit menu's preferences dialog in Desktop Analytica. Both the Hierarchy and the outline tree will show if this preference is checked, but the Styles library will turn this preference off if you select Outline style, since it duplicates the information on the outline. For the Top diagram only style there is no need for the hierarchy.

• Minimum resolution: The resolution in pixels of the smallest screen that your end users may have. ACP uses a fixed browser window size (canvas) for all Diagrams (tabs), unlike Analytica on the desktop that lets you have a different window size for each one. It's important to select a size that works well for all users, even on laptops with smaller screens. When you select a minimum resolution for the screen, it automatically resizes the main Diagram size in the desktop so that it will work well in ACP. The actual diagram size will be smaller than the screen resolution to allow for space for the web browser controls, menus, and tabs at the top, and window edges and scroll bars that take a little space on the sides and bottom.

More...

ACP Navigation options

In this bottom section of the ACP Navigation styles, you can control how the banner area above your diagram appears and whether or not to add scroll bars. To simplify the process of setting the styles, these checkboxes are hidden if you have selected an incompatible Navigation style in the top pane.

Banner logo and tabs

Unchecking the 'Banner logo and tabs' hides the banner space usually present at the top of ACP. The banner typically contains the Lumina Logo, the Parent Diagram button, tabs, Close Model button, and Save button.

Parent button

Flag to control the display of the Go into Parent button. Currently the button is shown by default with Outline style. The checkbox is hidden in other styles. It is possible to display this button with top tabs, but not by using the styles library, since there are some model specific settings involved. More...

Toolbar tabs

By clearing this checkbox, you can remove the default ACP tabs that appear at the top of ACP. These are the tabs with titles like "Diagram", "Object", "Edit Table", "Table", "Graph"... Toolbar tabs are compatible only with 'Outline' style. They will not show if the model title is shown, since they would tend to overlap.

Use Top diagram size for all windows

Sets the size of all diagrams based on the size of the diagram window of the top level when the model was last viewed in Desktop Analytica (in non-maximized mode). This is mandatory in all but 'Outline' style.

Model title

Shows the title of the model at the top to the right of the Lumina (or other) logo. Note that if you check this the toolbar tabs will not show, because the tabs and title would overlap,

Diagram title

You can control whether or not to display the diagram's title at the top of the diagram. Only usable with 'Outline' style. (And the preference for showing the model hierarchy needs to be turned off as explained above, ).

Auto calc

Checking this causes ACP to calculate any result (table or graph) as it displays a diagram window containing the result, and to immediately recalculate any result when the user changes an input on that diagram that affects the result. (It combines Calculate on open and Auto recalc results.) This behavior is unlike Analytica which does not usually calculate results until the user asks for them by clicking the Calc button.

Add Scroll bars

When checked, ACP adds scroll bars if needed to be able to see the entire diagram. When unchecked, the diagram will be either the top diagram size if this flag is set, or the canvas size.

Once you have the navigation styles set the way you want, click Close. This will close the Navigation panel and take you back to the Main ACP Style Library diagram.

Node styles

The Node styles dialog lets you configure how nodes are displayed including bevels and shadows. You can specify the style for highlighting when you move the mouse over a node, and whether to show balloon help with a description for each node.

Node effect on mouse-over

Select a highlighting effect for nodes when you move the cursor over the node. The default setting is 'Outline', with 'Glow' and 'None' as the other choices. As you select an effect from the pulldown menu a preview is shown.

Node edge appearance

In this pane, the 2 checkboxes set flags controlling the appearance of the edge of the nodes. Bevels adds a 3 d bevel to the node. Shadows adds a drop shadow effect. You can select either of these effects or both.

Balloon help

This pane has two checkboxes to set whether the identifier and/or the definition is also shown in the balloon, and a pulldown menu which sets the delay before a balloon appears.

By default, ACP displays the description - if any - the units, and the title of an object in a balloon as you place the mouse over it. If there is no description the balloon will not appear.

Identifier in balloon. This can be useful when a node is titled 'Net present value' and has an identifier Npv for example.

Definition in balloon. When checked, it shows the Definition of a variable in the balloon when you move the mouse cursor over its node.

Both Definition and Identifier boxes checked

Balloon delay When you mouse over a node, there's a short delay of about half a second before it displays the balloon (to prevent wild balloon appearance when you move the cursor rapidly over a diagram.) You can tweak this delay time measured in seconds.

Uncertainty icon in outputs

Analytica normally shows, just to the right of an output node, a little icon indicating the uncertainty view last displayed e.g. mid, mean, ProbBands, pdf ...

You can suppress these icons. This might be desirable, for instance, if your model is not probabilistic.

Flash buttons

For button nodes, instead of drawing a button that looks like a button node in desktop Analytica, use a Flash button. A Flash button component looks and feels a little bit more like a GUI button used in software applications.

If you are building a web application which uses Submit or other buttons, you might find it looks better using the Flash button component rather than a traditional Analytica button node.

However, if you are using multi-line text or have images embedded in any of the button nodes, then you should not use Flash Buttons since they don't support these features.

*Once you have the Node styles set remember to click 'done'. This will apply the node style attributes you have selected to the model and return you to the ACP Style Library diagram

Frame nodes

What is a frame node? If you are creating a Web Application which does not use the toolbar tabs, then you probably will want to display tables and graphs on the influence diagram. You can specify the location and size of the tables and graphs on the diagram using a Frame node. A module frame node is just a text node in a module that one tells ACP to use as the location for displaying tables and graphs in that module.

These are used with Web Application navigation styles where the toolbar tabs are not present. If you are not using one of the Web Application navigation styles, then you can skip this step.

How to make a text node be a frame node

First, create a text node in the module you want to display tables and graphs. Here is a Model with a text node on the top diagram.

Select frame

• In the Frame Nodes control panel, select the module where the text node is located from the 'Select module' pulldown menu.

• Select the frame node's identifier from the 'Select frame node' pulldown menu.

(If the text node is newly added to the model, it may not be listed if this variable has not been 'dirtied'. If it is not listed, you need to click the refresh button.)

• Once you have the correct node selected, then check "Use as a module frame node".

Once you check this checkbox the options in the field below will be displayed and enabled..

Select frame node styles

Index Menus Controls the display of the Index pulldown menus on the diagram. Unchecked by default, since this saves diagram space, and it is assumed that a modeller will usually choose how he wants people to view the orientation and dimensions of a table/graph in his model on the web. If you want people to be able to view and use these menus in ACP, check this box.

Title This checkbox controls whether or not the title of the node is shown above the table or graph on the diagram.

Description This checkbox controls whether or not the description of the node is shown above the table or graph on the diagram.

Description length Length of description of variable as a percent of Frame height. Not enabled if the 'description' check box is unchecked. If the Description is too long to fit the allotted space, it will be truncated and a scroll bar will be used to view the entire description. (This feature will only display correctly if you have made the frame node large enough to accommodate the scroll bar within the allotted space).

Table and or graph When the results of a node are shown, you have the following options, to show just the graph, just the table, show both the table and the graph. If you want the table or graph to be shown based on what was viewed last in Analytica, you can choose 'As saved in Analytica'.

For edit tables, the table will always be displayed regardless of this setting.

Once you have chosen the settings for your frame node, you can make another frame node, either in a different module or in the same module. If there is more than one Frame, each time you click on a node, it will show its table or graph in the Frame whose contents was displayed the longest ago. Thus, as you click on different nodes, it cycles through the Frames. In this way, you can see and compare edit tables or results from multiple nodes -- all in the same diagram window.

Click Done when your settings are complete.

See Also

• ACP style library.ana
• AcpStyles

• Analytica Cloud Player (ACP) Webinar
• Analytica Cloud Platform