Foglight 7.1.0 - Web Component Tutorial

Introducing the Web Component Framework

This Web Component Guide provides configuration instructions, conceptual information, and instructions on how to use the Web Component Framework.

This guide is intended for any user who wants to extend Foglight® using the tools provided by the Web Component Framework to design additional user interface (UI) component

The Web Component Framework (WCF) provides the underlying structure from which you can build browser-based Foglight and Foglight-like user interfaces. WCF is a set of graphic user interface (GUI) controls called components. WCF provides capabilities for interaction and navigation among these components. You can use WCF to build a browser interface for performing specific tasks, such as monitoring services.

The query-based model used by WCF enables you to bind components to data from any source. WCF makes it easy to deploy dashboards and their drilldown views into various application environments. By configuring these views, you can display data in a variety of tabular and graphical formats.

This document provides an introduction to these components and describes the underlying mechanisms that allow them to display data retrieved from Foglight or other sources with the same data structure. The full list of properties for each WCF component is given in the view pages that are accessible from the Help menu on the browser interface.

For a quick introduction to how dashboards are built and populated with sample views, try the Web Component Tutorial.

Configuring Views

Foglight® has a configurable Web-based interface. By performing your own custom configurations, you apply your detailed knowledge of your system to augment or replace the views that Foglight shows by default.

You can arrange or modify the existing components in the browser interface by:

Browser Interface Views

WCF provides you with the means to customize the browser interface. You can access the browser interface’s component framework and create custom views. You can populate these views with other display components, such as charts and tables, and connect them to data sources. It is the same data that the agents are configured to collect, but organized in a way that best fits a given business model and the information needs particular to that model.

The end result is a monitoring system that organizes data to mirror the business model. Real-time monitoring data is easily viewed and fosters better control of the monitored components’ availability. Custom views help inform application and IT managers about end-user service levels, notify stakeholders when those service levels are violated, and allow problem resolution tasks to be assigned to the appropriate domain experts. Custom views that focus on known trouble spots can help establish processes for quick recovery from system failure.

The Browser Interface

The Foglight® User Guide describes the overall appearance of the browser interface. This document describes the part of the interface used to define, view, and edit elements of WCF. The Definitions dashboard allows you to examine and work with all existing entities in WCF which you can use to build all the views in the browser interface.

You access the Definitions area by clicking Definitions under Dashboards > Configuration in the left navigation panel.

The Design tab on the action panel is available on any non-portal dashboard if you have the Dashboard Designer role. This tab shows a hierarchical list of all the views on the dashboard.

In the Definition tab, select a view from the upper pane to display information about it in the lower pane. You can also access its child views from this pane. Click the Inspect icon to switch to viewing information about the dashboard or view in the Definitions editor. You can see the current bindings for the view’s context keys in the Context tab.