Overview

The Vantiq IDE is Vantiq’s web-based Integrated Development Environment (IDE). The IDE is made up of two web apps, Development and Operations, each of which can have multiple projects. A project allows the developer or operator to organize tasks, such as user management or App and Client building, as well as debugging, deployment and monitoring, in a graphical environment. This User’s Guide describes the IDE features available in both the Development and Operations web apps and should be used in conjunction with the Introductory Tutorial.

The Development web app is accessed using the following URL: http(s)://(server host) (e.g., https://dev.vantiq.com). The Operations web app is accessed using the following URL: http(s)://(server host)/ui/ops/index.html. The purpose and use of each web app is described later in this guide.

The Vantiq IDE is supported in current versions of the Chrome, Firefox, Safari, Edge and Opera browsers.

The Navigation Bar

The Vantiq IDE Navigation bar appears at the top of the browser window:
NavBar
In the left corner, the contents depend on the whether the user is using the Development or the Operations web app. However, three controls are the same in either app:

  • Project Name contains the name of the current project. Use this text entry field to name new projects, change the name of the current project, or create a copy of the current project by renaming it.
  • Save is enabled whenever there are unsaved changes to the current project.
  • Projects allows the user to create a new project, manage all projects, and quickly switch between existing projects.

In the right corner are eight buttons and menus: Search, Unseen Errors, Compilation Errors, Catalog Updates, Help, Namespace, User, and Project Settings.
Unseen Errors, Compilation Errors and Catalog Updates only show up when those conditions are found in the Namespace. If none exist, those buttons will be hidden.

The Search field allows the user to search all resources in a namespace for text matching the contents of those resources. For example, if you want to search all resources having to do with the word engine, type engine then return into the Search field. This produces a dialog that might look like this:

Search

This search found the word engine in one App, two Clients, two Deployments, one Environment and one Event Generator. To add any of these resources to the current project, click the resource entry in the list.

Unseen Errors

Clicking the Unseen Errors button displays a pane with a list of any errors in the current namespace that have been recorded but are unseen.

Compilation Errors

Clicking the Compilation Errors button displays a pane with a list of any resources in the current namespace that have compilation errors.

Catalog Updates

Clicking the Catalog Updates button displays the Catalogs pane. Clicking the Updates tab in the pane displays a list of all subscribed Services and installed Assemblies in the Namespace that have updates available.

Help

The Help menu has four menu items:

  • What’s New displays a pane with the latest Vantiq system release notes.
  • Developer Guides displays a new browser tab that contains the complete documentation set for the Vantiq system, including Reference Guides, Tutorials and details about the Vantiq REST API.
  • Developer Resources displays a pane with links to Vantiq mailing lists, references to 3rd party connectors and adapters, and the Vantiq CLI and SDKs.
  • VAIL Documentation displays a new browser tab that contains the VAIL Rule and Procedure Reference Guide.

Current Namespace

The Current Namespace button opens a dialog that allows the currently authenticated Vantiq user to change namespace to any namespace in which they are authorized.

User

The User menu shows the username of the currently authenticated Vantiq user. This menu also allows the user to log out, display detailed information about the version of the IDE, and change IDE settings used by the expert user who wants to speed up accomplishing certain tasks.

Project Settings

The Project Settings menu has the following menu items, which vary depending on which app is in use, Development or Operations.

  • Filter (Development only) allows the user to select which project elements are displayed in the Project Resource Graph and Project Contents list. For example, by unchecking the Types filter item, a sample Project Resource Graph might look like this, which shows that the four types in the project are dimmed in the graph:

FilterPRG

  • Layout allows the user to configure how the IDE canvas appears for each project. The Layout Options dialog has several options:
    • Layout Style allows the user to select either Custom or Tiled layout. See the IDE Layout Styles section for more details.
    • Grid Size selects how many rows and columns to use in Tiled layout. See the IDE Layout Styles section for more details.
    • Toggle Grid allows the user to select whether there is a grid pattern in the project canvas. (Only available when using the Custom layout style.)
  • Close All Panes allows the user to close all open panes.
  • Close All Panes in the Current View allows the user to close all open panes in the current project view (project views are described below).
  • Show All Resources (Development only) displays a dialog that lists all resources found in the current Namespace and to which Project(s) each belongs.
  • Show Orphan Resources (Development only) displays a dialog that lists all resources that are not contained in any Project in the current Namespace.
  • Manage Excluded Resources (Development only) displays resources which have been explicitly removed from the project and placed in an “exclusion list” so they will never be indirectly re-added.

Panes

Most tasks in the IDE can be accomplished by interacting with panes in the canvas area (the area under the Toolbar). For example, after completing the Introductory Tutorial your project might look like this:

Panes

This canvas area contains four panes: Project Resource Graph, Service: apps.services.EngineMonitor, Event Generator: EngineSimulation, and Client: EngineSimulation. Each of these panes can be resized and their location on the canvas can be changed.

Each pane has a title bar at the upper, right which contains a set of icons. Each icon is a button that performs a specific action for the pane. Some of these icons will appear on every pane, like minimize, maximize, and close, while others are unique to the resource type displayed within the pane. Here are the common icons and their behaviors:

PaneButtons

From left to right, the buttons are:

  • Save Changes: used to save changes made to the contents of the pane.
  • Help: used to open a new browser tab that contains documentation pertinent to the contents of the pane.
  • Maximize/Normalize Display: used to expand the contents of the pane to take over the entire browser window and, conversely, restore the pane to its original size. Maximizing a pane makes it easier to view and modify its contents.
  • Pin Pane to Canvas: when in Tiled Layout mode, this pane will not be moved to the Inactive Panes dock when a pane needs to be replaced.
  • Send to Dock: when in Tiled Layout mode, move this pane to the Inactive Panes dock.
  • Close: used to close the pane, removing it from the canvas but not deleting the contents of the pane from the project.
    As mentioned, panes may have additional buttons based on their content. Hover the mouse over any button to display a tooltip which contains a title for the button.

Development App

A project contains a set of resources and related tools which provide an integrated environment for developing Services and Clients. Typical development tasks are:

In the Development App, the IDE Navigation Bar contains five menus other than the three common controls: Administer, Test, Deploy, Show, and Add. Several of these menu controls have a sub-menu section titled Advanced. Menu items contained in the Advanced section are not commonly used and can safely be ignored by beginning users.

Administer

The Administer menu has 10 menu items:

  • Users displays a list of the currently defined users for the namespace. To add a new user to the namespace, use the Create New icon button in the toolbar of the Users pane.
  • Namespaces displays a list of the currently defined namespaces defined for a Vantiq organization. This list is only useful when authenticated as an organization administrator.
  • Audits displays a list of the current Vantiq Audits.
  • Grafana launches the Grafana UI enabling in-depth analysis of resource utilization and performance. (This menu item is only available for servers that have Grafana enabled (e.g. not on Edge servers).)
  • Advanced>Catalog allows the user to host and manage a catalog. The Vantiq catalog system is described in the Vantiq Catalog Reference Guide.
  • Advanced>Profiles displays a list of the currently defined Vantiq profiles. A profile contains capabilities with which the user assigned the profile can access data and behaviors defined in the namespace.
  • Advanced>Access Tokens displays a list of Vantiq access tokens used for authentication.
  • Advanced>Pending Invites displays a list of outstanding invitations to the namespace.
  • Advanced>Secrets displays a list of currently defined secrets.
  • Advanced>Groups displays a list of the currently defined groups for the current Vantiq namespace. From the Groups documentation, a group is a set of users with shared access to a collection of resources.

Test

The Test menu has 11 menu items:

  • Tests displays a pane that lists any currently defined tests defined in the current namespace. The Vantiq test system is described in the Vantiq Testing Reference Guide.
  • Test Suites displays a pane that lists any currently defined tests defined in the current namespace. The Vantiq test system is described in the Vantiq Testing Reference Guide.
  • Event Generators is used to add Event Generators to the current project.
  • Captures displays a pane that lists currently defined event captures.
  • Autopsies displays a pane that allows the user to retrieve Vantiq Rule and Procedure execution autopsy records.
  • Errors displays a pane that allows the user to retrieve historical Vantiq system errors.
  • Logs displays a pane that allows the user to retrieve historical log messages.
  • Advanced>Collaborations displays a pane that allows the user to retrieve lists of collaborations, both active and closed. These lists can be used to determine the status of collaborations as well as deleting collaborations.
  • Advanced>Activity Patterns displays a list of App Activity Patterns and Collaboration Activity Patterns.
  • Advanced>Situations displays a pane that allows the user to retrieve lists of situations.
  • Advanced>Debug Configurations displays a list of Debug Configurations.

Deploy

The Deploy menu has seven menu items:

  • Configurations displays a list of Deployment Configurations.
  • Network Graphs displays a list of Network Graphs. When creating a new Network Graph, the IDE does a network search for other Vantiq systems configured as connected to the current system.
  • Nodes displays a list of other Vantiq systems about which the current system knows. Users can connect to other nodes by using the Create New icon button in the top, right of the Nodes pane.
  • Node Configurations displays a list of Vantiq Node Configurations used for bootstrapping a new Vantiq node.
  • Deployments displays a list of Vantiq Deployments. Users can simplify deployment tasks with this graphical tool.
  • Environments displays a list of Vantiq Environments. An Environment contains a set of user selected Nodes. It is used by Deployments.
  • Clusters displays a list of Vantiq Clusters. A Cluster is a managed environment such as Kubernetes.

Show

The Show menu has seven menu items:

  • Find Records… displays a pane that allows the user to retrieve a list of instances of a Vantiq Type. Once the list has been retrieved, those instances can be edited or deleted.
  • Add Record… displays a pane that allows the user to add a new instance of a Vantiq Type.
  • Catalogs displays a list of any catalogs to which the current namespace is connected and allows the user to create new and delete existing catalog connections. The Vantiq catalog system is described in the Vantiq Catalog Reference Guide.
  • Compilation Errors causes the Compilation Errors pane to display, which contains all VAIL compilation errors in resources found in the Namespace.
  • Resource Graph causes the Project Resource Graph pane to display. The Project Resource Graph is a graph that shows the relationship between all Vantiq resources that are present in the project. For example, if a Procedure references a Type, then the graph displays an edge linking the Procedure node to the Type node. Resources are added to a project by use of the Add menu, which is discussed in the next section.
  • Advanced>Documents displays a list of documents stored for the current Vantiq namespace. Documents are typically uploaded from the Vantiq mobile apps or the Vantiq IDE.
  • Advanced>Quick Start displays a Quick Start pane, which provides links and how to accomplish common Development web app tasks.

Add

The Add menu is used to add Vantiq resources to the current project. Each menu item references a resource. For example, selecting the Service item displays the following dialog:

AddService

Use this dialog to either add an existing resource (selecting it from the list) or creating a new resource (using the New button). Once the resource is either added or created, it is added to the Project Resource Graph pane (if displayed) and the Project Contents pane (if displayed).

Operations App

An Operations project provides a set of tools for administering and monitoring a Vantiq namespace. Typical Operations app tasks are:

  • create and edit current namespace users,
  • monitor the operation of tasks (e.g., Apps) by running Vantiq Clients,
  • monitor errors and log messages produced by the namespace.

In the Operations App, the IDE Navigation Bar contains three menus other than the three common controls: Administer, Deploy, and Monitor. Several of these menus have a sub-menu section titled Advanced. Menu items contained in the Advanced section are not commonly used and can safely be ignored by beginning users.

Administer

The Administer menu has 10 menu items, which are discussed in the Development App Administer Menu.

Deploy

The Deploy menu has seven menu items, which are discussed in the Development App Deploy Menu.

Monitor

The Monitor menu has five menu items:

  • Clients displays a list of the currently defined Clients which is used to launch and run Vantiq Clients. Clients allow the graphical input into and display of data from the Vantiq system. For example, here is the Client associated with the Introductory Tutorial:

RunningClient

Project Views

A Development project can be thought of as a container for resources and a set of tools that operate on them. The set of resources can grow quite large and it may be useful to divide the project up into smaller related subsets. This is done with a feature called “Views” which allows you to identify a related set of the Project’s resources and group them together.

You don’t have to use Views – you can ignore them and simply use the single “Project Contents” view which contains everything in one place. But Views can often be a way to organize the components of a big Project. Here are some basic facts about Views which help to understand how they work and what they are good for:

  • There is always a default View called “Project Contents” which contains all the resources in the project.
  • User-created “Custom” Views contain a subset of all the resources in the Project Contents View. A Resource can be in more than one View, but all Resources are always in the Project Contents View. If you save a Project with Custom Views, it will still be readable by older versions of Modelo but the Custom Views will be ignored.
  • Custom Views show a subset of all Project resources in the Project Contents Dock and the Project Contents Graph. The Contents Dock can be displayed in four flavors: tree, list, input, and output. Each View saves its own layout within the Project Resource Graph. Each View can have its own layout style of “Tiled” or “Custom”. Each View has its own set of panes open.
  • The same pane can be open in multiple Views at the same time. In fact, there is only one copy of a specific running pane and all Views share it. This means the same pane will always have the same state no matter which View it appears in. This also means that closing a pane in one View doesn’t really close it unless no other Views have it open.
  • There is a gear/settings icon in the Contents Dock. When clicked, it allows you to pop up a “Manage Views” dialog that is used to create, delete and rename Custom Views. It also has a “New View” menu item to simply add a new one.
  • When there is at least one Custom View, vertical tabs appear at the left edge of the Contents Dock and you can use them to easily switch between Views.
  • In the IDE Toolbar Settings menu there is a “Close All Panes” menu item which closes all panes in all Views. There is also a menu item to just “Close all Panes in the current View”.
  • Removing a Resource from a Custom View doesn’t remove it from the Project Contents View. However, removing a resource from the Project Contents View removes it from all Custom Views as well (and the Project). Adding a Resource to a Custom View adds it to the Project Contents View automatically (if it’s not already there).
  • The Contents Dock provides many context menus to operate on the resources there, as well as actions to copy Resources from the Project Contents View into a Custom View. In fact, you can select multiple resources in the Project Contents View and use a context menu to copy all of them to a Custom View at the same time.
  • A context menu item in Custom Views allows you to add one level of folders and then move resources there via drag and drop. (The Project Contents View does not support folders.)

To get started using Views, click the Contents Dock’s gear/settings icon and select New View:

Tiled

This displays a dialog that lets you give your View a name and, optionally, add an initial set of resources. When you click OK, the new View’s tab appears in the Contents Dock and the new View will become the currently active one.

IDE Layout Styles

In both the Development and Operations apps, each project may be configured to display the canvas panes in one of two styles: Custom or Tiled. To choose a project’s layout style, use the Project Settings menu to select Layout….

Note that each View can have its own Layout Style.

Custom Layout Style

Custom Layout Style allows the user to move and resize panes in the IDE canvas. The user may display a large number of panes in the canvas and then use the scroll bars to view panes outside the currently viewable canvas.

Tiled Layout Style

Tiled Layout Style allows the user to display a fixed number of panes using a grid pattern sized to exactly fit in the viewable canvas. If the browser window is resized, the pane sizes will adjust to match the new size. The project below is shown using Tiled Layout Style with a 2×2 grid:

Tiled

If the user opens a new pane and the canvas grid is full, the canvas pane that was opened least recently is moved into the Inactive Panes Dock at the top of the canvas. In the example above, there are three inactive panes: /my/response/topic and two SystemHUD entries. (The first SystemHUD entry represents the SystemHUD type and the second SystemHUD entry represents a subscription.) Each inactive pane associated with a Vantiq resource (e.g., type, topic, App, Client, etc.) has the same color coding as found in the Project Resource Graph. All other inactive panes have a default gray color.

To restore an inactive pane to the canvas, simply click on its entry in the Inactive Panes Dock. The inactive pane replaces the least-recently-used pane in the canvas. That least-recently-used pane is then added to the Inactive Panes Dock.

The Inactive Panes Dock is sorted using the sort menu in the dock. Inactive panes are sorted using one of four methods: Category, Recently Used, Alphabetical, or Created Time. If Category is selected, the dock entries are sorted using one of seven general categories of panes (e.g., resource type, list, data), each represented by the icon in the dock entry.

Hovering the mouse over a Inactive Panes Dock entry will cause either one or two controls to display:

Hover

  • Close is represented by a small X icon. Use the Close icon to remove the entry from the Inactive Panes Dock.
  • Save is represented by a small disk icon. Use the Save icon to save the resource, if that resource has unsaved changes.

When using Tiled Layout Style, panes in the canvas may have two additional icons in the toolbar at the upper, right of the pane:

DockIcons

  • Send to Dock is used to move the visible pane to the Inactive Panes Dock. This will cause the canvas to have an open entry, which is filled by the next pane to be opened in the canvas.
  • Pin Pane to Canvas is used to pin the visible pane to the canvas so that it may not be replaced by a newer pane. Use Pin Pane to Canvas to ensure that one or more panes are always visible in the canvas. After pinning, the Pin Pane to Canvas icon is replaced by the Unpin Pane from Canvas icon to reverse the pinning state.

The Inactive Panes Dock may be docked either to the top or the right of the IDE. Use the Move Dock to Right or Move Dock to Top buttons to switch the location of the dock.

IDE Docks

In addition to the Inactive Panes Dock described above, there are two additional IDE Docks: Project Contents and Debug.

Project Contents Dock

The Project Contents Dock is docked to the left of the IDE. It contains a list of all resources in the Project and is sorted using the Change Resources View button at the top of the dock. There are four sort methods: Tree of Resources by Type, Tree of Resources with related Inputs, Tree of Resources with related Outputs, and List of Resources by Name. The middle two sort methods display an additional tree level for resources to display how other resources relate to that resource. For example, if a publish to Topic “/patientChange” triggers Rule “ProcessChange”, then the resource tree will show that relationship.

Use the Collapse Dock Left button to collapse the Project Contents Dock to save space in the IDE. Use the Expand Dock Right button to restore the Project Contents Dock to its full width. In expanded state, the horizontal size of the dock is changed by clicking and dragging on the gray dividing line at the far right of the dock.

If you have defined custom Views then a vertical set of tabs will appear on the left edge which allow easy navigation between Views.

Debug Dock

The Debug Dock is present for both Development and Operations Projects and is docked on the bottom of the IDE. It contains up to three debug panes:

  • Errors lists any Vantiq system errors as they occur.
  • Log Messages lists any log messages as they occur. Log messages are produced by turning on debugging for Applications or Collaboration Types or by adding explicit log calls in Rules and Procedures.
  • Autopsies lists any Autopsy records as they are created. Read more about Autopsy records in the Autopsy Debugger Tutorial.

Select which of these three debug panes is visible by using the pull-down menu in the title bar of the dock.

Use the Collapse Dock Down button to collapse the Debug Dock to save space in the IDE. Use the Expand Dock Up button to restore the Debug Dock to its full height. In expanded state, the vertical size of the dock is changed by clicking and dragging on the gray dividing line at the top of the dock.

Integration with Version Control Systems

Modelo allows you to “export” a Project and its contents into a zip file. Once this zip has been expanded into a directory tree it can be checked into a Version Control System (VCS) such as Git or TFS.

We refer to this as the “VCS directory”. (In “Git” terms, this means the VCS directory corresponds to a Git repository.) Normally there is one VCS directory that corresponds to a single namespace, and every Project in the namespace has its own subdirectory:

MyVCSDirectory/
   MyProject1/
      clients/
      types/
      ...
   MyProject2/
      clients/
      types/
      ...
   MyProject3/
      clients/
      types/
      ...

Using Modelo “export” you could sync a Project with this VCS directory in several steps:

  1. Export the Project into a zip file (this requires using a dialog to select the target location)
  2. Expand the zip file into a temporary directory (from outside Modelo)
  3. Delete the contents of the Project’s subdirectory
  4. Copy the contents of the temporary directory into the Project’s subdirectory inside the VCS directory

This will work but requires some awkward manual steps. Modelo offers some mechanisms to make it much more convenient to sync your Project with its corresponding VCS directory. These operations are found in the Projects menu:

  • Sync Project to VCS – export the current Project and overwrite its sub-directory inside the VCS directory
  • Sync Project from VCS – import the current Project from its sub-directory inside the VCS directory, completely overwriting the current contents
  • Combine Project from VCS – combine the contents in the selected Project with the current Project. Note that duplicate resources in the current Project will be overwritten.

Unfortunately browsers do not allow some of the filesystem operations needed to make this work. The Vantiq CLI command can be run in a special mode where it starts a small local server which Modelo can use to do these export and unzip steps for you without so much manual intervention. These operations all require the Vantiq CLI command to be running in its special mode; simply invoke it like this:

vantiq VCSSERVER

or this if you are running in Windows:

vantiq.bat VCSSERVER

This causes the Vantiq CLI to start a local server on localhost:4347 and then listen for requests from Modelo in the browser. (This port should not be exposed to the outside world since it would present a potential security exposure.) You can just leave the CLI running in this state until it’s needed.

For example, if you select Sync Project to VCS, you will see a dialog like this:

Sync To VCS

You will need to enter the VCS directory name the first time you invoke one of these operations; after that it will remember your setting. Clicking the Sync Project to Directory button will then complete the sync operation for you.

Note that you will need to do all the actual VCS operations (such as “commit”, “push”, “pull”, etc.) from outside Modelo.

Instructions for downloading and installing the Vantiq CLI can be found here.

IDE Shortcut Keys

Many IDE panes support common keyboard shortcuts which enhance developer productivity. A pane must be selected for keyboard short cuts to apply; a pane is selected when its title bar has a dark gray background and a blue border.

What follows is a list of keyboard shortcuts and the panes to which they apply. On Windows, the shortcut modifier is the Control (Ctrl) key; on Mac OS, the shortcut modifier is the Command (Cmd or Apple) key although the Control key is also respected.

  • Ctrl-S & Cmd-S: save any changes in the pane
  • Shift-Ctrl-E & Shift-Cmd-E: display the IDE search dialog

The following are used in the Client Builder, System Modeler, App Builder, and Collaboration Type Builder:

  • Ctrl-Z & Cmd-Z: undo changes
  • Shift-Ctrl-Z & Shift-Cmd-Z: redo changes
  • Delete & Backspace: delete selected object(s) in the pane

The following are used in the Client Builder and System Modeler and apply only to selected object(s) in the pane:

  • Ctrl-X & Cmd-X: cut
  • Ctrl-C & Cmd-C: copy
  • Ctrl-V & Cmd-V: paste

The following are used in the Client Builder and apply only to selected object(s) in the pane:

  • Right-arrow: move object to the right
  • Left-arrow: move object to the left

The following are used in the Rule/Procedure (VAIL) editor pane:

  • Ctrl-Click & Cmd-Click: on certain words in the editor will make the editor do the following:
    • If the word is a built-in Procedure or VAIL term the appropriate documentation will be opened in a new browser tab.
    • If the word is an existing Procedure, Source or Type in your namespace the resource will be opened in a new pane.
    • If the word is a Procedure, Source or Type that does not exist then a resource creation pane will be opened using the indicated name.
  • Shift-Ctrl-Space & Shift-Cmd-Space: display a menu of variables in scope
  • Shift-Ctrl-. & Shift-Cmd-.: Display available packages
  • Ctrl-Enter & Cmd-Enter: Import the selected resource

The following are used in any code (VAIL or JavaScript) editor pane:

  • Ctrl-/ & Cmd-/: toggle comments on and off for the current line
  • Ctrl-A & Cmd-A: select all text
  • Ctrl-D & Cmd-D: delete the line under the cursor
  • Ctrl-Home & Cmd-Up: move cursor to the start of the document
  • Ctrl-End & Cmd-Down: move cursor to the end of the document
  • Ctrl-PageUp & Shift-Ctrl-V: move cursor up one screen
  • Ctrl-PageDown & Ctrl-V: move cursor down one screen
  • Ctrl-] & Cmd-]: indent current line or selection
  • Ctrl-[ & Cmd-[: unindent/dedent current line or selection
  • Ctrl-F & Cmd-F: find text
  • Ctrl-G & Cmd-G: find next instance of text
  • Shift-Ctrl-G & Shift-Cmd-G: find previous instance of text
  • Shift-Ctrl-F & Cmd-Option-F: replace instance of text
  • Shift-Ctrl-R & Shift-Cmd-Option-F: replace all instances of text

The following is used in the Client Builder JavaScript editor pane:

  • Ctrl-Enter & Cmd-Enter: invoke the AI Code Assistant after entering a single-line comment of the code you require. The Assistant will attempt to use Generative AI features to provide a code sample.

In addition, the Return key can be used as a shortcut for the default (usually OK) button in most modal dialogs.

Safe Mode

It is possible that some unusual conditions can prevent Modelo from starting up successfully. There are two scenarios that could lead to this condition:

  • The last-saved Project could have been damaged in such a way that opening it causes Modelo to crash. Since by default Modelo always tries to re-open the last active Project on startup, this could prevent you from starting Modelo at all.
  • If you are using custom CSS assets in a Client, it is possible that you could override Modelo’s builtin CSS to such an extent that Modelo can no longer function. This would normally happen only when trying to test run the Client, but if you turned on the Client’s “Apply Custom CSS Assets” option then your CSS would be loaded even when simply opening the Client to edit it.

Either of these unusual conditions could lead to Modelo either crashing on startup or being unusable. It is possible to start Modelo in “Safe Mode” so it will avoid these issues by not automatically opening the last Project and by forcing the “Apply Custom CSS Assets” option off when editing Clients.

Instead of the usual URL you use to launch Modelo, you can add ‘safemode=true’ as a parameter. For example
https://dev.vantiq.com/ui/ide/index.html?safemode=true

When starting Modelo in this way you will see a warning dialog that explains the changed behavior, something like this:


Running in “Safe Mode” – some features will be disabled:

  • The last Project will not automatically be reloaded on startup.
  • The ‘Apply Custom CSS Assets’ option will be automatically turned off when editing Clients.