Sever - Dynamic GUI Editor

Dynamically generated GUIs are used in various plugins. These can be created and edited easily using the Dynamic GUI Editor. To further support user interaction, rules can be applied to GUI elements. This allows the content and functionality of other elements to be controlled in a targeted manner.

Layout

The main window is divided into three sections. The available control elements are located on the left, the design view is in the center, and the detailed settings for the currently selected element are on the right.

Edit GUI

Create New

There are several options available for creating a new GUI. You can create a new empty GUI via the File menu (File -> New) or from the menu bar. You must specify a name and the destination.

You can also create a new GUI by copying an existing one. To do this, use the context menu of the tab for an already open GUI. A copy will be created in the same directory, and all settings, including defined rules, will be copied exactly as they are.

Renaming

To rename a GUI, use the context menu of the tab for an open GUI. Selecting “Rename” opens the corresponding dialog box.

Opening and Closing

An existing GUI file can be opened via the File menu (File -> Open) or from the menu bar. To close it, select File -> Close from the File menu or the menu bar, or select Close from the context menu of an open GUI tab. If the GUI to be closed contains unsaved changes, a confirmation prompt will appear.

Add control

To add an element, select the desired element on the left in the selection and place it at the desired position in the design view using drag & drop.

Remove Control

Selected elements can be removed using [Del] or the context menu. A confirmation prompt always appears. When deleting, all rules (see Rules) that were directly associated with the element or had it as a target are automatically deleted.

Change Position

To change the position, select the desired elements and drag and drop them to their new position.

Copy and Paste

Selected elements can be copied using [Ctrl]+[C] or the context menu and pasted at any location using [Ctrl]+[V] or the context menu. This process is also possible between multiple open GUIs; however, no rules are copied along with them, as their consistency can no longer be guaranteed.

Previewing and Testing a GUI

Clicking in the menu bar opens a preview window of the currently selected GUI.

Here, you can test all elements with their set properties and defined rules (see Rules) and verify their functionality.

Save changes

To save, use the Save and Save All functions available in the menu bar and in the File menu.

Controls

Textbox

Text boxes have three specific properties:

• ReadOnly, specifies whether the user is permitted to edit the text entered.
• Mask, an input mask to assist with data entry, for example __:__:__:__
• Validation Regex, here you can enter a regular expression to be used for validating the input.

ComboBox

Use to edit the contents of a combo box. Here, you can add or remove items, or change their order.

The Default property can be used to define a value as the default value. Only one element can be defined as the default value. If a new element is marked as the default, this property is automatically set to False for the previous one.

The value for internal use is defined via Value.

Empty creates an empty selection element in the display.

The same applies to the items in a ComboBox: their names must be unique within the ComboBox. If an attempt is made to assign a duplicate name, the programme will automatically change it to a valid value.

Properties

Every control has properties. These can be viewed and edited in the right-hand pane. Changes are immediately visible in the design view. Each element has a name, which is used for identification within a GUI and must therefore be unique. The programme ensures this. If you attempt to assign a name that has already been used to an element, it will automatically be changed to a valid value.

FriendlyName is the label to be displayed in the GUI.

Mask Tokens

Mask tokens can be defined under ‘Mask’. This determines the formats of the input fields.

Mask Token	Property
A	Alphanumeric or a special character; required.
a	Alphanumeric or a special character; not required.
L	Letter, required. Restricts input to the ASCII letters a–z and A–Z. This mask element is equivalent to [a-zA-Z] in regular expressions.
l	Letter, not required
\	Escapes a mask character and converts it to a literal. ‘\’ is the escape sequence for a backslash.
All other characters	(Literals) All non-mask elements are displayed as they are in RadMaskedTextInput. Literals always occupy a fixed position within the mask at runtime and cannot be moved or deleted by the user.

For more information, see Telerik Mask Tokens.

An example of a field for entering a MAC address:

AA-AA-AA-AA-AA-AA

Regex validation

The Regex validation feature allows you to restrict the characters permitted in the input field.

An example of a Regex that only allows letters from A to F for entering a MAC address:

^[{]?[0-9a-fA-F]{8}-([0-9a-fA-F]{4}-){3}[0-9a-fA-F]{12}[}]?$

Elements marked as “Internal” are essential to the functioning of a plug-in. If these are deleted or their names are changed, the plug-in in question may no longer function correctly.

Rules

The rules concept is an integral part of dynamic GUIs. Rules make it possible to link the selection of a combo box element to further actions that are executed automatically. For example, a value can be selected from another combo box, or the content of a text field can be changed. 

A combo box element can contain n rules.

Structure

A rule consists of five pieces of information:

The parent GUI element.

The triggering element.

The target GUI element.

The content to be set.

An action that describes what should happen to the target.

With the exception of the parent GUI element, all settings can be edited at a later stage.

Rule Overview

An overview of all rules available in the selected GUI can be accessed via  in the menu bar.

Add & Edit Rules

There are two different ways to do this. The most convenient option is via the rule overview; the other is via the properties of a ComboBox element.

Rule Overview Option:

Create a New Rule

To create a new rule, click on the menu bar. In the dialog that appears, assign the desired settings from top to bottom.

Edit an existing rule

To edit a rule property, select the rule in the rule overview and then press [F2] or double-click to enter edit mode.

Remove Rule

To delete one or more rules, select them and then delete them using  in the menu bar or by pressing [Delete]. A confirmation prompt will appear.

Option: Properties of a ComboBox element:

This option is useful if you want to define rules directly when adding ComboBox elements. Clicking in the properties of a ComboBox element opens the rule editor.

Add a new rule

A new empty rule is added by clicking .

Edit an existing rule

To edit an existing rule, select it from the list on the left. You can then edit its properties in the right-hand part of the window.

Remove rule

To delete one or more rules, select them and then click  to delete them. No confirmation prompt will appear.

XML definitions

The underlying XML definition is a general format for describing configurable graphical interfaces within SCCM Manager.

The following section explains the structure of the configuration file “ClientCreater_OSDVariables.xml”.

• Any number of controls can be defined. Currently, two types can be defined: “TextBox” and “ComboBox”.
• A name must be defined for each control. This name must be unique, must not contain any spaces, and has three functions (in the Client Creator example).
  
  • Internal name of the control, to enable it to be controlled via a rule.
  • Name of the computer variable.
  • Label of the control, if no FriendlyName has been defined
• You can also define a FriendlyName, which is then used as a label in the GUI.
• Each control can optionally include a description tag. A description can be entered there, which is then displayed as a tooltip above the relevant control.
• Each control can have any number of items.
  
  • An item must have a name and may optionally have a FriendlyName for display purposes (otherwise the name is used automatically).
  • In the case of a ComboBox, the item should also have a Value. In the Client Creator example, this is the value of the computer variable.
  • The default item of a ComboBox can be set using the IsDefault attribute. Otherwise, none is selected by default.
  • Each item can have any number of rules. As soon as this item is subsequently selected in the GUI, all rules assigned to it take effect.
    
    • A rule always defines a Target, i.e. the name of the control that is to be affected.
    • A TargetItem is also defined, e.g. the item that is to be automatically selected in another ComboBox.
    • Optionally, a so-called Action can also be defined. There are currently four different ones: ‘Show’, ‘Hide’, ‘Enable’, ‘Disable’. This allows other controls to be affected as well.
• A text box can also have additional attributes and tags.
  
  • A mask can be defined by setting the ‘Mask’ and ‘MaskType’ attributes (see example).
  • An additional ‘ValidationRegex’ tag can be added. This enables the text box to validate user input automatically.
  • Furthermore, a text box only recognises its first item. This is essential to ensure that a value exists at all and to be able to access it, for example, via a rule.
• This system can also be used for custom plugins

Sample configuration and the resulting GUI

• The first control in the image (OS Name) is part of the Client Creator internally.
• The computer name as a text box (also internal): the regular expression (ValidationRegex) expects uppercase letters.
• NetBIOS domain as a combo box: the corresponding rule automatically selects the matching FQDN.
• Primary Site Server: The FriendlyName for the control is PrimarySiteServer=ExampleSite01, but the variable value (Value) ExampleSite01 is actually selected later. This also applies to the variable name, which is later set to OSDPrimarySiteServer.