Sections of the "Applications" Module

The "Applications" module is divided into individual sections, each of which is highlighted in red in the figure above. You can change the size of each section by dragging with the mouse. To do this, move the mouse to the edge of an area until the mouse pointer changes to a double-arrow. If there isn't enough space in a section, vertical or horizontal scroll bars will automatically appear.

Every section, with the exception of the workspace, has a tab at the top. By dragging the section title, you can move the entire section to a different location using drag-and-drop.

While you are moving the area, the section moved via drag-and-drop is highlighted in gray as a preview of its future position and is anchored the moment you release the mouse button. Areas can also be arranged in their own window.

You can show or hide individual sections using the "View" option in the main menu. In addition, the original layout of all sections can be restored.

Application Structure

The top-left section shows the structure of an application's individual pages and data groups.

By clicking the arrow icons to the left of an element's label, you can show or hide sublevels in the application structure.

Application Node

You'll find the application node at the very top of the application structure. It represents the application. In the Properties dialog, you can edit settings such as the title, version, application menu, portlets, and permissions. You can create new data groups, external data groups, system data groups, and view pages via the "New" option in the main menu when the application node is selected.

Data Groups

You can find all the information about data groups here.

System Data Group

You can find all the information about system data groups here.

External Data Groups

For more information on external data groups, click here.

Data Fields

You can find all the information about data fields here.

Page Views

This symbol indicates view pages that display data. You can find more information here.

Input Pages

Input pages are always located within a data group. You can find more information here.

Pages in the Application Menu

This icon indicates view or input pages that are integrated into the application menu. These pages can be loaded directly in the browser via the application menu. The application menu is configured in the Properties dialog box for the application node.

Home Pages

This icon indicates a main or input page that has been set as the app's home page via the "Edit / Home" main menu. When you click the application link in your browser, the home page is loaded first, regardless of whether it appears in the application menu or where it is located within the menu. Input pages can only be defined as the home page if they are located in data groups directly below the application node.

Portlet Pages

View pages that are used as portlets.

Elements

You can find all the information on this topic here.

Favorites

In this section, you can add items that are used frequently.

Set Up Favorites

Opens a dialog box where you can select items for the favorites list.

Select Favorites

The left-hand pane lists all application elements, sorted by category. Using the "Add to Favorites" context menu option, you can add a selected item or even an entire category to your favorites. You can see the current favorites in the right-hand pane.

You can use the "Remove from Favorites" context menu option to remove a favorite from the favorites list.

To move items from the left pane to the right pane and vice versa, you can also use the arrow buttons .

In the right-hand pane, you can use the "Create Category" context menu option to create your own categories. You can edit existing categories using the "Edit Category" context menu. Items can be moved to the desired category using drag-and-drop.

Create Category / Edit Category

Enter the name of the category here. By clicking on " " and selecting "Multilingual," the title can also be written in multiple languages.

Click "OK" to save your changes and close the dialog box.

"Delete Category" context menu

Deletes the currently selected category. You will be asked whether the items it contains should also be deleted. If the answer is "No," the items are moved to the top level of Favorites before the category is deleted.

Open/Close All Categories

Shows or hides child elements.

Click "OK" to save your selection and close the dialog box.

/Import Favorites

Opens a dialog box that allows you to export or import favorites.

Import Favorites / Export Favorites

This is where you select the export directory when exporting. During import, you can select the file that was previously exported. "Browse" opens a dialog box where you can select the export directory or the import file. Favorites are exported as an XML file.

Read and WriteContainers, API Endpoints

All Read and WriteContainers defined on the currently selected page are displayed here. You can find more information on this topic here.

You can find information about API endpoints here.

Work surface

The content and appearance of the workspace change depending on whether a page, data group, or the application node is selected in the application structure. For example, if the application node is selected, the workspace displays information about the application description, the home page, other pages, and the application history, including the ID and date.

If a data group is selected, the name of the corresponding database table is displayed along with all data fields and references.

When a page is selected in the application structure, elements can be created and arranged on the workspace using drag-and-drop.

If an element on the workspace is dragged with the mouse to an invalid position—for example, if elements overlap or the element extends beyond the workspace boundaries—the element's outline is displayed in red. The move will not be carried out. When you release the mouse button, the element returns to its original position.

The most important properties of the elements are displayed in the Quick Tip when the mouse pointer is positioned over an element.

Script

Elements that include script calls or descriptions are automatically marked with a blue " " icon. Required fields are marked on the workspace with a red icon.

Conditional Display

The Grid, Group, and Button elements can be shown or hidden using conditional display. If a conditional display is defined, the corresponding element is marked with an orange triangle in the lower-right corner.

Guidelines

Using the main menu options "Edit / Horizontal Guide" or "Vertical Guide," you can insert guides on the workspace at the location where the mouse pointer was last positioned. Existing guides can be removed using the main menu option "Edit / Delete Guide. "

The workspace is overlaid with a grid that serves as a guide for aligning view and input elements. In addition, a ruler will help you position the elements. The current coordinates of the mouse pointer are displayed on the ruler as a marker.

In the Options menu, you can change the properties of the workspace—for example, if you don't want a grid or ruler to be displayed.

You can select elements on the workspace using the mouse. To select multiple items, hold down the mouse button and drag a selection box around them, or hold down the CTRL key and click on the items one by one.

Grouping

A group allows you to combine multiple elements—for example, to limit their space on the page, group them visually, or move them together.

Select the desired items on the workspace and choose "Edit / Group" from the main menu or the context menu of the same name. You can use the following submenus to select the desired grouping method:

  • Group

    The group uses a background shading effect.

  • Group Label top

    The group is implemented using the HTML DIV element, and the page on which it appears uses a table-less layout. Titles in controls are hidden, and title fields are displayed above the controls.

  • Inline grouping

    All elements are transformed as inline elements. In CSS, depending on the element type, you would write either `display:inline;` or `display:inline-block;`.

  • Group H1

    The text of the grouped elements is automatically assigned the H1 style class.

  • Group Transparent

    Groups the elements without a background shadow.

  • Grouping Hidden

    Groups the elements and hides them.

  • Ungroup

    Undoes a grouping.

Once the group has been created, you can open its properties by double-clicking the group's border.

The grouping is also available as an application element. You can find all the information about the settings in a grouping's Properties dialog box here.

You can select all elements on the workspace using the Ctrl + A keyboard shortcut. In this case, elements that are part of a group cannot be selected individually. If you have selected an item in a group or the group itself, pressing Ctrl + A will select all other items in that group.

Zoom

On the workspace, you'll find the "Zoom" tab. If the "Grid" element is created on a page without a table layout, the individual containers in the grid can be edited in the zoom area.

Hidden Area

In addition to the workspace, there is a hidden area that—just like the workspace—can be equipped with various elements. The elements contained here are not displayed in the browser.

You can use the Alt + h keyboard shortcut to display hidden elements in the browser as needed, such as for testing purposes.

You can create new elements directly in the hidden area by dragging them from the "Elements" section to the "Hidden Area" tab. Existing elements can be selected on the workspace and then moved to the hidden area via the main menu option "Edit / Move to Hidden Area. "

In the same way, elements can also be moved back to the workspace.

If you want to use elements in JavaScript and have the functions available in the browser, the corresponding checkbox in the "Web" column must be selected. If a setting is not configured for an element, it can only be used on the server side (e.g., in Velocity).

To display the hidden area in the web browser, the user must have the "Manage Application" permission.

Hidden Grouping

All hidden elements are grouped together. You can open the Properties dialog for the hidden group by double-clicking "Hidden Elements" when you are in the hidden area.

Here, you can change the name of the hidden group. You can find information about multilingual titles here.

Within the top-level group in the hidden area, additional groups can be created—for example, to organize the hidden elements into smaller units for a clearer overview.

Search, Reports, Issues, Description, Script

At the bottom, you'll find several tabs that can also be shown or hidden via the "View" main menu.

Search

Here, you can search specifically for elements with certain properties, GUIDs, embedded scripts, and much more.

Search field

Enter a search term here.

Shortlist

Various search functions can be selected from the drop-down list.

  • Attribute value

    Searches for the value of an attribute.

  • Data fields without input elements

    Lists all data fields that are not associated with an input element.

  • Elements with Comments

    Lists all elements that have a comment when you Do not enter any text in the search field. If text is entered in the search field, the system will search for all elements that contain that text in their comments.

  • Elements with Script Calls

    Lists all elements that have a script call registered for one of their events.

  • Elements with style classes

    Finds elements that have a specific style assigned to them, which you can specify in the search field.

  • Elements with links to other applications

    Returns all elements that are linked to other applications, such as buttons whose destination page is located in another application, or tables that display data from other applications.

  • Items Without Titles

    Find all items that do not have a title entered in any of the portal languages.

  • Groovy

    Returns all elements integrated into the application that use Groovy scripts.

  • GUID: Definition

    Search for the item with the GUID you entered in the search field.

  • Buttons / Buttons with Email Functionality

    Lists all buttons or buttons with email settings.

  • Velocity

    Search for all VTL include elements integrated into the application.

Search

Triggers the search. Search results are displayed below the search field, and clicking on a result highlights the corresponding item on the workspace.

Search History

Opens a window with a list of the most recently performed searches. Click on a search action in the list to repeat it.

News

This tab displays messages, such as when an element cannot be deleted because other elements reference it.

Problems

Intrexx supports you in application development in a variety of ways. Most checks to prevent misconfigurations are already performed directly while editing elements. There is also a "Problems" view, which scans the currently open application for errors and warnings. The underlying algorithm is constantly being expanded and will help you continue to maintain applications that function flawlessly and are easy to maintain in the future.

Even in applications that appear to be problem-free, new issues may arise after a software update. This is not due to a faulty software update, but rather to the ongoing refinement of the error-detection algorithm.

Click "Settings" at to turn warnings on or off.

In the "Problems" section, you will find the following types of messages:

  • FIXME and TODO markers in JavaScript

    Here is an overview of all "Fixme" and "Todo" comments in the application's JavaScript. The application can be published despite the error messages, if desired. You can find out how to set the appropriate markers in the script here.

  • Error

    These prevent the application from being published and must be resolved, unless the setting "Allow application publication despite error entries in the 'Issues' view" is enabled in the options.

  • Warnings

    The application can be published despite the reported warnings.

By default, the FIXME and TODO markers from the JavaScript are listed first, followed by the errors, and then the warnings. You can change the sort order of the individual columns by clicking on the column header.

Description

Here you can enter a description for the currently selected item. This applies to all elements of an application, including pages, data groups, data fields, etc. The text you enter here will be saved in a single language when you save the application. Elements with descriptions are marked on the workspace with a " " icon.

If you cannot enter a description—for example, if multiple items are currently selected—you will see this icon in the comment field.

Script

The "Script" tab provides an overview of all script calls used on the page. When you click an entry in the "Element" column, the element to which the script call is assigned is highlighted on the workspace. Double-clicking an entry in the "Call" column opens the corresponding script at the correct location in the editor.

History

You can find all the information on this topic here.

Settings

You can access the general settings for the "Applications" module via the main menu under "Tools / Options / Applications."

Options for Experts

You can find all the information here.

Enable Accessibility Options

If you select this checkbox, the "Accessibility" tab will appear in the elements.

On the "Accessibility" tab, you can assign ARIA roles and attributes.

For detailed information on this topic, see the section " Assign ARIA roles and attributes."

Check for missing titles

Causes the application to search for missing titles in other portal languages when it opens. You can find more information here.

Show Data Field Title / Bindings

With this setting, the title of the bound data field and the binding are displayed in the application elements on the workspace.

Background Image for Groups

In the "Design" module, you can add background images to groupings. With this setting, the background images are displayed on the desktop.

Drawing Controls During Drag Actions

When moving elements on the workspace, both the element's original and new positions are displayed.

Bring the workspace / hidden area to the foreground using drag-and-drop

If this setting is enabled, the hidden area is brought to the foreground as soon as an element is dragged and dropped onto it. Elements can also be moved from the hidden area to the workspace using drag-and-drop, which then brings the workspace to the foreground as well. If you do not want this behavior, please disable the setting described here.

Show Ruler

Shows or hides the ruler on the workspace.

Align with elements

When you drag a new item onto the workspace or move an existing one, this setting displays dashed lines that make it easier to align the item with others.

Show grid

Shows grid points on the workspace. The spacing of the grid points can be adjusted here. The value 5 corresponds to a distance of 5 pixels between individual points.

Size of the Undo/Redo Buffer

Sets the number of editing steps that can be undone using the "Undo" option in the main menu.

Number of most recently opened applications

Sets the desired number of recently opened applications to be displayed at the bottom of the "File" main menu.

Position of the created title

Specifies whether the titles of input and view elements are placed to the left of or above the element on the workspace.

Maximum length of the "Recent Applications" list

Specifies how many of the most recently edited applications are displayed in the Application Manager when you click the "Recently Edited" link there.