Difference between revisions of "Dynamic Tags in QPR UI"

From Mea Wiki
Jump to navigation Jump to search
 
(108 intermediate revisions by 2 users not shown)
Line 1: Line 1:
Note: Documentation in this page mainly applies to upcoming QPR MobileDashboard versions.
+
''Tags'' can be used in many settings fields when designing dashboards to add dynamic behaviour to the dashboards. If a tag used in a presentation object's settings field refers to a context variable, and that variable values changes, also that setting field value changes and the presentation object updates to reflect the new settings.
  
== General about text tags ==
+
'''Evaluating''' a tag means that the tag is parsed (detected) from the containing text, its intended behaviour is executed and the tag definition is replaced by the tag's return value. Tags in textual settings are always evaluated before the setting value is used by the UI element. During the tag evaluation the setting value is treated as text only, although it might be JSON, SVG or CSS.
In some UI element textual settings it is possible to use some of the below defined tags to achieve more dynamic behaviour of dashboards.
 
  
'''Evaluating''' a tag means that
+
Tags have the following syntax: '''<#tagname parameter1="value1" parameter2="value2" ... parameterN="valueN">'''
# The tag is parsed (detected) from the containing text
 
# Its intended behaviour is executed
 
# The tag definition is replaced by the tag's return value
 
  
Tags in textual settings are always evaluated before the setting value is used by the UI element. During the tag evaluation the setting value is treated as text only, although it might be JSON, SVG or CSS.
+
In more details:
 
+
* Tag starts with '''<#tagname''', where '''tagname''' is the name of the tag, and ends with '''>''' character.
== Tag definition syntax ==
 
Tag syntax has the following general form: '''<#tagname parameter1="value1" parameter2="value2" ... parameterN="valueN">'''
 
 
 
In more details, tags have the following syntax:
 
* Tag starts with '''<#tagname''', where '''tagname''' is the name of the tag. There is always a space after the tagName.
 
* Tag ends with '''>''' character.
 
 
* Tag contains one or many parameters as name-value pairs (parameters are separated by space).
 
* Tag contains one or many parameters as name-value pairs (parameters are separated by space).
 
* Parameter name is followed by '''=''' which is followed by parameter value in double-quotes ('''"''').
 
* Parameter name is followed by '''=''' which is followed by parameter value in double-quotes ('''"''').
Line 22: Line 12:
 
* Newline characters are not allowed in tags (if a newline character is encountered, the searched text ends)
 
* Newline characters are not allowed in tags (if a newline character is encountered, the searched text ends)
  
Tag is assumed if tag start '''<#tagname''' (including the space) appears in the text. If the syntax doesn't continue according to the syntax rules, an error is caused.
+
Escaping examples:
 +
<pre>
 +
<#action name="drill\\down\"abc\""> (name parameter contents: drill\down"abc")
 +
</pre>
  
Examples of syntaxes that cause tag parsing error:
+
A tag is assumed if a text contains '''<#tagname ''' (including the space) appears in the text. If the syntax doesn't continue according to the syntax rules, an error is caused.
* <#variable name="var1"
 
* <#variable name="var1"escaping="json">
 
* <#variable name="var1" escaping=json">
 
* <#variable name="var1" escaping=json>
 
* <#variable name="var"1" escaping="json">
 
  
Examples of syntax that doesn't cause error, because they are not interpreted as tags:
+
== Available tags ==
* <variable
+
* [[Variable Tag in QPR UI|Variable tag]]
* <#variables
+
* [[Expression Tag in QPR UI|Expression tag]]
* <#variableparameter1=value1>
+
* [[Dataset Tag in QPR UI|Dataset tag]]
 
 
Escaping examples:
 
* <#action name="drill\\down\"abc\""> (name parameter contents: drill\down"abc")
 
  
 
== Settings where tags can be used ==
 
== Settings where tags can be used ==
Text tags can be used in following settings:
+
Dynamic tags can be used in following settings:
* [[Data Grid Properties|Data Grid]] presentation object '''JSON settings''' field (Variable tag and the short syntax)
+
* [[Data Grid Properties|Data Grid]] presentation object '''JSON settings''' field
* [[SVG Properties|SVG]] presentation object '''SVG code''' field (Action tag, Variable tag and and the short syntax)
+
* [[HTML Properties|HTML]] presentation object '''HTML code''' field
* [[Panel Properties|Panel]] and any presentation object '''Name''' field (Variable tag and the short syntax)
+
* [[SVG Properties|SVG]] presentation object '''SVG code''' field
* ProcessAnalyzer and QPR Suite web service queries in data grid presentation object's Query tab (Variable tag and the short syntax)
+
* [[Panel Properties|Panel]] and any presentation object '''Name''' field
 
+
* [[Datasets in QPR UI|Dataset]] query and parameter fields
== Variable tag==
+
* QPR Suite Web Service query and parameter fields in Gata Grid presentation object's Query tab
Variable tag references to a context variable, i.e. when the tag is evaluated, the tag is replaced by the context variable value. The value is taken from the effective context of that UI element, where the tag resides. When the referenced context variable value changes, the UI element, which setting contain the variable tag, is also refreshed. Variable tag is not able change the context variable value.
 
 
 
Variable tag contains following parameters:
 
* '''name''': Name of the referenced context variable. This parameter is mandatory.
 
* '''escape''': Determines which escaping or encoding is added to the context variable value when the value is used. This parameter is needed, so that the value is compatible with its context, e.g. inside string literal quotation marks. Following values can be used:
 
** '''none''': No escaping (default value)
 
** '''json''': Escaping suitable for JSON string literals (characters to escape: " and \, escape charater: \)
 
** '''js''': Escaping suitable for JavaScript string literals (characters to escape: ", ' and \, escape charater: \)
 
** '''xml''': Escaping suitable for xml text nodes (characters to escape: <, >, &, ' and ")
 
** '''html''': Encoding that the following JavaScript example does: '''$('<div/>').text("textToEncode").html();'''
 
** '''uri''': Escaping suitable for full url's. Implements JavaScript encodeUri() function. (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI)
 
** '''uricomponent''': Escaping suitable for url address pars such as parameters. Implements JavaScript encodeUriComponent() function. (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent)
 
* '''jsonpath''': Contains a JSON path expression (more information: https://github.com/json-path/JsonPath). Context variable value is expected to contain a JSON value and instead of replacing the whole JSON value, the JSON path expression is evaluated for the JSON value and the result is replaced. (will be used in future)
 
 
 
Examples:
 
* <#variable name="variable1">
 
* <#variable name="variable1" escape="json">
 
* <#variable name="someJsonDataVar" jsonpath="$.store.book[0].title">
 
 
 
== Short syntax for Variable tag ==
 
There is also the following '''short syntax''' for the Variable tag:
 
 
 
* '''<#var1>''' is same as '''<#variable name="var1">'''
 
* '''{#var1}''' is same as '''<#variable name="var1">'''
 
* '''{|var1}''' is same as '''<#variable name="var1" escape="json">''' (this syntax will be removed in future)
 
 
 
The short syntax differs from normal tags in a way that the short syntax doesn't contain parameters, whereas normal tags always have at least one parameter. The short syntax is identified by the tag parser only if it's properly written, i.e. there are no error messages for incorrectly defined short syntax.
 
 
 
== Action tag ==
 
Action tag references to a QPR MobileDashboard action. The tag can be used in a javascript code, because the replaced value is a call to a QPR MobileDashboard's internal javascript function which triggers the action. All context variables in the effective context are automatically passed to the triggered action.
 
 
 
Parameters:
 
* '''name''': Referenced action identifier. This parameter is mandatory.
 
* '''[action parameters]''' are name-value pairs of assigned action parameters. (will be used in future)
 
 
 
An error is caused, if the referenced action is not found.
 
 
 
Examples:
 
* Tag '''<#action name="DrilldownToDetails">''' can be embedded into SVG code as follows: <svg onclick="'''<#action name="DrilldownToDetails">'''">
 
* Action with parameter assignments: '''<#action name="drilldownToCities" param1="value1" param2="value2">'''
 
 
 
== Info tag (supported in future) ==
 
Info tag is used to access different kind of user, session and context related information, that may be needed in dashboards. The information can only be read and not set.
 
 
 
Parameters (only one in this case):
 
* '''name''': Information/setting/property name (mandatory). Following names are supported:
 
** '''enticeSessionId''': QPR MobileDashboard session id.
 
** '''meaSessionId''': QPR Suite session id (empty if there is no active session to QPR Suite).
 
** '''paSessionId''': QPR ProcessAnalyzer session id (empty if there is no active session to QPR ProcessAnalyzer).
 
** '''baseUrl''': Beginning part of the url of the currently opened QPR MobileDashboard view (url part until the hash sign). Example: '''<nowiki>https://demo.qpr.com/mobiledash/</nowiki>'''.
 
** '''urlParameters''': Parameters of the currently opened QPR MobileDashboard url, i.e. the session context variables. Example: '''sys:dashboard=1234&var1=value1&val2=value2'''.
 
** '''username''': User name of the currently logged in user.
 
** '''uiLanguage''': Language code of the currently active UI language. Available UI language codes: '''EN''' (English), '''FI''' (Finnish), '''AR''' (Arabic).
 
 
 
Note. it's possible to combine the baseUrl with the urlParameters to get a full bookmark url: e.g. '''<#baseUrl>#/dashboard?<#urlParameters>'''
 
Examples:
 
* <#info name="paSessionId">
 
 
 
== Datasetcell tag (supported in future) ==
 
Datasetcell tag is used to retrieve a single cell value from a dataset.
 
 
 
Parameters:
 
* '''name''': Identifier of the referenced dataset. This parameter is mandatory.
 
* '''columnName''': Referenced column name in the dataset. This parameter is optional, and if omitted, it's the first column of the dataset. This parameter is alternative to columnIndex.
 
* '''columnIndex''': Referenced column index in the dataset (starting from number 1). This parameter is optional, and also alternative to columnName.
 
* '''rowIndex''': Referenced row number name in the dataset (starting from number 1). This parameter is optional and if omitted, the first data row is used.
 
 
 
Error is caused if the referenced dataset identifier, columnName, columnIndex or rowIndex is not found.
 
 
 
Examples:
 
* <#datasetcell name="scorecards">
 
* <#datasetcell name="scorecards" columnName="symbol" rowIndex="3">
 
* <#datasetcell name="scorecards" columnIndex="2" rowIndex="3">
 
 
 
== Dataset tag (supported in future) ==
 
Dataset tag is used to convert a dataset into a JSON format to be used in a JSON configuration, for example in a chart or datagrid.
 
 
 
Parameters:
 
* '''identifier''': Dataset name
 
* '''[all other parameters]''': All other parameters define column mappings from the dataset to the JSON presentation. Parameter name is the column name in the formatted JSON and parameter value is column name in the dataset. If referenced column is not found, an error is returned. All unmapped columns in the dataset are mapped with same names in JSON. Empty value means that if the dataset contains the defined column, it is not mapped.
 
 
 
Examples:
 
* <#dataset identifier="scorecards" name="scorecardName" x="" y="revenue" color="statusColor">
 
* If there is a dataset with columns A, B and C, and there is a tag '''<#dataset identifier="datasetname" D="A" B="">''', the resulting JSON contains columns D and C. Column A as mapped with the name D, column B is not mapped at all and C as mapped with the same name.
 
 
 
== Translate tag (supported in future) ==
 
Translate tag is used to get a translated value for a string from a translation table (translation table is a separate feature). This tag is helpful in building multilingual dashboards. If translation text is not found from the translations table, the original translatable text is returned.
 
 
 
Parameters:
 
* '''text''': Text to translate. This parameter is mandatory.
 
* '''context''': Defined in which context the translatable text appears. This enables to have different translations for same translatable text. If omitted, empty context is assumed.
 
* '''language''': Language name to which translate the text. This parameter is optional, and if omitted, the current UI language is assumed.
 
 
 
Examples:
 
* <#translate text="Renenue">
 
* <#translate text="Renenue" context="bookkeeping">
 
* <#translate text="Renenue" language="FI">
 
  
[[Category: QPR MobileDashboard]]
+
[[Category: QPR UI]]

Latest revision as of 10:30, 11 December 2020

Tags can be used in many settings fields when designing dashboards to add dynamic behaviour to the dashboards. If a tag used in a presentation object's settings field refers to a context variable, and that variable values changes, also that setting field value changes and the presentation object updates to reflect the new settings.

Evaluating a tag means that the tag is parsed (detected) from the containing text, its intended behaviour is executed and the tag definition is replaced by the tag's return value. Tags in textual settings are always evaluated before the setting value is used by the UI element. During the tag evaluation the setting value is treated as text only, although it might be JSON, SVG or CSS.

Tags have the following syntax: <#tagname parameter1="value1" parameter2="value2" ... parameterN="valueN">

In more details:

  • Tag starts with <#tagname, where tagname is the name of the tag, and ends with > character.
  • Tag contains one or many parameters as name-value pairs (parameters are separated by space).
  • Parameter name is followed by = which is followed by parameter value in double-quotes (").
  • If parameter value contains double-quotes they are escaped with \ character, example \". \ character is escaped with \\.
  • Newline characters are not allowed in tags (if a newline character is encountered, the searched text ends)

Escaping examples:

<#action name="drill\\down\"abc\""> (name parameter contents: drill\down"abc")

A tag is assumed if a text contains <#tagname (including the space) appears in the text. If the syntax doesn't continue according to the syntax rules, an error is caused.

Available tags

Settings where tags can be used

Dynamic tags can be used in following settings:

  • Data Grid presentation object JSON settings field
  • HTML presentation object HTML code field
  • SVG presentation object SVG code field
  • Panel and any presentation object Name field
  • Dataset query and parameter fields
  • QPR Suite Web Service query and parameter fields in Gata Grid presentation object's Query tab