Customized Edit properties dialogs

The Edit properties dialogs that are available on asset pages and in asset lists were enhanced. Customized dialogs allows users to edit generic and specific asset properties. The dialogs were harmonized with the corresponding asset pages

Target Group

Solution developers

Context

censhare standard workspace

Customized Edit properties dialogs for Product Information Management and Campaign Management.

The Edit properties dialogs are configured in Dialog assets.

Prerequisites

You need intermediate knowledge about the workspace configuration of censhare Web. In particular, you must be familiar with dialog module assets, resource replace variants, and the cs-metadata directives.

Introduction

censhare Dedicated solutions introduce an enhanced user interface concept for a better user experience. Asset pages, tabs and widgets were widely harmonized. In any context, users find similar properties and content in the same place.

The enhanced Edit properties dialogs provide a better user experience in two ways:

Customized dialogs contain relevant information for the respective asset types.
Dialogs were harmonized with the properties widgets on the respective asset pages.

The enhanced dialogs are aligned with the properties widgets on an asset page, and comprise all relevant properties of an asset. This guarantees a better user experience, as users can now select whether to edit asset properties in the Edit properties dialog, or in the respective widgets.

The enhanced Edit properties dialogs were introduced for Product Information Management (PIM) and Campaign Management. To use the enhanced dialogs, no further configuration is required.

If necessary, you can customize the Edit properties dialogs via resource replace variants. If you want to customize the Edit properties dialog for asset types that do not have a custom dialog yet, you can create and configure a new Dialog asset and assign it to the desired asset type.

Key concept

The Edit properties dialogs are configured in a standard HTML dialog asset that is widely used to configure the censhare Web workspace. The configuration is stored in an HTML master file. Optionally, a JavaScript controller can be added.

The Default Asset Metadata Dialog (resource key: censhare:metadata.default.asset.template) provides the default Edit properties dialog. Do not disable or remove this dialog!

To overwrite the default Edit properties dialog for a specific asset type, a Dialog asset is required with the following settings:

In the Resource usage property, the value Asset type meta data dialog definition must be set.
In the Resource metadata property, a source asset filter must be configured.

In the master file of the dialog asset, the dialog is configured with the censhare metadata directives. The basic usage of the dialog asset is as follows:

CODE

<cs-dialog-tabs>
   <cs-dialog-tab name="[TAB_NAME]">
      <cs-dialog-group group-label="[GROUP_LABEL]">
         <ul>
            <cs-metadata-row property="asset.traits.[TRAIT_KEY].[PROPERTY_KEY]"/>
         </ul>
      </cs-dialog-group>
   </cs-dialog-tab>
</cs-dialog-tabs>

For more information, see censhare metadata directives.

Instead of directly adding the cs-metadata directives to a dialog, you can include existing dialog snippets to create the Edit properties dialog:

CODE

<cs-dialog-tabs>
   <cs-dialog-tab name="[TAB_NAME]">
      <cs-dialog-group group-label="[GROUP_LABEL]">
         <xs-include -dialog key="'[DIALOG_ASSET_RESOURCE_KEY]'"/>
      </cs-dialog-tab>
</cs-dialog-tabs>

The advantage of this configuration is that you can reuse existing dialogs. For example, dialog snippets from properties widgets, that are configured on an asset page, can be reused in the Edit properties dialog. The censhare standard workspace uses this configuration whenever possible.

Search dialog definitions

To search for the existing dialogs in your system, execute the following search:

In censhare Web, start the Expert search.
Enter a search query with the following conditions:
- Resource usage = Asset type metadata dialog definition
- NOT (Name like Tab*)
Click SEARCH to run the search.

The search result shows all HTML Dialog assets that provide an Edit properties dialog. Each dialog is mapped to a specific asset type, except the Default Asset Metadata Dialog asset. This dialog is used when no dialog is configured for an asset type.

Create a resource replace variant of a dialog definition

With a resource replace variant, you can easily create a custom variant of an Edit properties dialog. To create and configure a resource replace variant, do the following:

Execute the search as described in the previous section, and open the desired dialog in a new asset page.
Click
to open the asset actions menu, and select Variants > Resource replace variant.
Open the new dialog asset in a new page.
Go to the Administration tab, and edit the Generic asset and resource properties. Replace the automatically generated resource key.
Do not change the Usage key and the source asset filter!
Click OK to close the dialog and save your changes.
Go to the Editor tab and enter here the dialog definitions.
Click SAVE to save your changes.

The custom dialog is available immediately. Restarting the censhare Server is not necessary.

Create a dialog definition for a new asset type

If you want to customize the Edit properties dialog for a new asset type, do the following:

In censhare Web, create a new Module / Dialog asset.
Enter a name and a resource key.
Select the Enabled and In cached tables fields.
In the Usage field, select Asset type meta data dialog definition.

In the Resource metadata field, enter an XML snippet with the asset type filter, for which you want to use the Edit properties dialog. You can adapt the following example:

CODE

<?xml version="1.0" encoding="UTF-8"?>
   <xmldata source-asset-filter=":starts-with(asset/@type, 'picture.')"
            target-asset-filter="">
   <selection needed="false"/>
</xmldata>

Click OK to save your changes.

To deploy a new dialog in a production system, you must add it to the system module assets and synchronize them:

In censhare Web, open the Dialog asset that you want to deploy.
Open the Page actions menu (
), and select Export > Export module assets.
Go to the Download directory on your computer and open the Export folder.
Copy the asset XML file, the HTML master file, and if existing, the JS controller file.
On the censhare Server, paste the copied files into the censhare-Server/install/system/required/web/metadata-templates-asset-type directory.
Open the asset XML file in an XML editor, and check if the HTML storage item and the JS controller storage item (if existing) are referenced correctly. If more storage items (for example: XHTML preview items) are referenced, remove them and save your changes.
Open the censhare Admin Client and there, open the Server actions menu (
).
Select Synchronize module asset - required.
In the dialog, select the required/web/metadata-templates-asset-type field and click OK.
In the report, verify that the dialog was added, and click OK to close the dialog and save your changes.

The new dialog asset is now available in the system.

Result

When users open the Edit properties dialog in the action menu of an asset, the respective dialog fields display.