General Remarks on Widgets


General remarks

  • You can create different types of widgets only in the Custom Widgets and My Custom Widgets categories. These categories respectively contain customized public widgets accessible to all users, and customized private widgets accessible only to their creator. Widgets in the other categories in the widget library are defined by Logo - EasyVista.png. You cannot create new ones.
  • Widgets are defined for each page of the app. Widgets in different pages are not linked to each other.
  • Once you create a widget, you should rename it so you can identify its function easily. When a widget is created, its default name is the type of widget incremented by thumb_down based on the number of the same widget type in the current page.
            Example documentation icon EN.png  Data Viewer (3)  ==> third Data Viewer widget in the current page
  •  In the library, widgets are arranged by category and are identified by icons that display their type.
  • Each widget has specific properties that are defined using the Properties Inspector.
    • Mandatory properties are grouped in the Content category.
    • Graphic properties are grouped in the Theme category. By default, properties defined at higher levels are inherited by lower levels. You can modify each property in its specific context. Open url.png See the principles of inheritance.
  • The date/time format, thousands separator and decimal separator depend on the configuration settings defined in the user information zone of the logged-in user. If these settings have not been defined, then these properties will depend on the configuration settings of the platform used by the logged-in user. In Windows, this is specified in the Control Panel > Regional and Language Options.
PropertiesInherit

Principles of inheritance for graphic properties

  • The default values of properties in a theme are initially those defined in the standard stylesheet shipped with the Product name - ev sas.png setup, i.e. the Foundation CSS stylesheet.
  • By default, properties defined at higher levels are inherited by lower levels according to the following hierarchy.
EVApps - Graphic Properties - Inherit.png

(1)     Specific configuration defined for the widget in the app

(2)     In its absence, specific configuration defined for the type of widget in the theme related to the app

(3)     In its absence, specific configuration defined for all widgets in the app page

(4)     In its absence, specific configuration defined for all widgets in the theme associated with the app

(5)     In its absence, configuration of the Product name - ev sas.png standard stylesheet, i.e. the Foundation CSS stylesheet

  • The Inherit box, used to manage inherited or context-specific properties, is found next to most properties.
Inherit (box is checked) Context-specific (box is not checked)

The property is inherited from a higher level.

Properties Inherit - Inherit property.png

The property is defined for a specific context and has priority over any property defined at a higher level.

Properties- Inherit - Specific context property.png

  • The name of the property is grayed out.
  • The name of the property is highlighted in blue.
  • The context (e.g. theme or page) of the property and the property value are displayed when the cursor moves over the checkbox. Several items of information may be shown if the property was defined at different levels, e.g. for the theme as well as for the page.

Example documentation icon EN.png An app contains the Incidents dashboard whose widgets inherit the colors defined for the theme. The title in the Major Incidents widget is highlighted as regards the background color and the text color because these properties are context-specific.
         EVApps - Graphic Properties - Example Inherit 1.png

EndPropertiesInherit

Widgets using a data source

General remarks

  • When you delete a widget linked to a data source, the data source will remain available in the library.
  • Widgets linked to dynamic data sources are automatically updated each time the app is run and each time the page is redisplayed, regardless of whether it is in execute mode or edit mode. You can also use the Auto Refresh property to define the automatic refreshment interval.
     

Data source pointing to a database

All widgets linked to a given data source in the same page are synchronized.

  • When you browse through the records in one of the widgets, the other widgets will automatically be refreshed and display the data corresponding to the selected record.
  • Depending on the widget, the current record may be highlighted differently, e.g. a green box for Data Viewer widgets and an infotip for Google Maps widgets.

Best Practice icon.png  

  • We recommend that you use an alias to associate a data source with a database. 
  • It should point to a connector when the database does not change, regardless of the step in the deployment process.

Example documentation icon EN.png

1. Display a list of assignments using a Data Viewer widget (1).

2. Display different information from the same data source (2):

  • Employee form using a Secured HTML widget
  • Assignment location using a Google Maps widget
  • Street View of the location using a Secured HTML widget

3. You select another assignment using the Data Viewer widget (3): the current record is highlighted in a green box ==> the three other widgets will automatically be refreshed and display the data corresponding to the selected assignment.

4. If you select another location by clicking another marker Google map icon.png in the map displayed using the Google Maps widget ==> the three other widgets will automatically be refreshed and display the data corresponding to the selected location.
         EVApps - Relations datasource.png

Data source pointing to an EasyVista database

The functionalities proposed depend on the table or column used:

  • Data source pointing to the AM_ACTION table: EasyVista action buttons can be added using the text editor: Advanced Tags Apps - Text Editor - Advanced tags icon.png > Workflow category.
  • Data source pointing to a view linked to the AM_LOCATION table: A virtual address field is added automatically to enable you to concatenate different address fields in Product name - ev itsm.png.
    • The Full Address (<Table_Name>) field concatenates all Product name - ev itsm.png address fields.
    • This field is automatically inherited by child locations without a specific address.

Best Practice icon.png You can use this field together with the Google Maps widget in Content > Address to view locations on the map.

Example documentation icon EN.png

Product name - ev itsm.png Product name - ev sas.png

Directory of locations pointing to the AM_LOCATION

table.

EVApps - Virtual Address field.png

Data source pointing to the Operation > Incidents > All Incidents query and a list view displaying recipients and their location.

==>   Add a virtual field:

Full Address (AM_RECIPIENT_LOCATION) =

Pine Street, San Francisco, CA, United States of America

Data source containing aggregated data with the drill-down functionality

The drill-down functionality enables you to zoom in on each grouping level in the EasyVista view associated with the data source to view the complete breakdown of aggregated data. All widgets linked to a given data source in the same page are synchronized. When you change the grouping level in one of the widgets, the other widgets will automatically be refreshed and display the data corresponding to the selected level.

  • In Data Viewer widgets (Note: Only in Grid mode), Bar Chart widgets and Pie/Donut Chart widgets, you can disable the drill-down functionality using the Enable Drilldown property.
  • In the Dashboards widget, the functionality is not available for the Others dimension element that groups together all of the non-displayed data in the chart.

Best Practice icon.png  

Example documentation icon EN.png

1. You use the Data Viewer widget in Grid mode to display a list of locations corresponding to the view called Equipment by location (1) and browse through different grouping levels of aggregated data. This widget is associated with the Breadcrumb widget (2) that facilitates navigation within the grouping levels displayed in a path.

2. You use the Data Viewer widget in Grid mode linked to the same data source to display the breakdown of the list of equipment for the selected location (3).

3. You display statistics on the breakdown of equipment for the selected location using two Dashboards widgets linked to the same data source (4):

  • Bar Chart widget
  • Pie/Donut Chart widget

4. If you change location in the Data Viewer widget (1) ==> the three other widgets will automatically be refreshed and display the data corresponding to the selected location.

5. Similarly, if you select another location by clicking another item of data in one of the Dashboards widgets (4) ==> the other widgets will automatically be refreshed and display the data corresponding to the selected location.

EVApps - Relations drilldown - select location 1.png

====>

EVApps - Relations drilldown.png

EVApps - Relations drilldown - select location 2.png

====>

EVApps - Relations drilldown - last level.png

Widgets using the text editor

In the text editor:

  • Click Apps - Text Editor - Image icon.png to insert a new or existing image in the app.
  • Click Apps - Text Editor - Hyperlink icon.png to insert a link to another app, to a page in another app, to a web page, to a document on a website or to an email.
  • Use the Advanced Tags Apps - Text Editor - Advanced tags icon.png > Page category to insert a link to a page in the current app.
Tags:
Last modified by Unknown User on 2017/10/10 14:01
Created by Administrator XWiki on 2014/09/02 11:55

Shortcuts

Recent Updates

Haven't been here in a while? Here's what changed recently:

-   Product name - ev itsm.png
-   Product name - ev sas.png

Interesting Content

How to Automate Integration
Add a Shortcut to an App
History
Quick Dashboard
Full text search - Stop Words

Powered by XWiki ©, EasyVista 2018