This page contains all the Swing configuration info that can be configured in the general Méthode files on /SysConfig/…​
All the following configurations are only managed by Swing, Prime ignores these.

SiteConfig.cfg

StylesGroup configuration

A CSS can be differentiated based on the application (e.i. Swing or Prime) by configuring the app attribute in the stylesheet of the <cssStylesheets> tag:
this way the CSS will be loaded only by the application specified in the app attribute and will be ignored by all the others.

This configuration is available starting from versions Swing 5.2019.03 and Prime 7.2019.03.

The allowed values that can be configured are:

  • Prime - The CSS is loaded by Prime

  • swing - The CSS is loaded by Swing

  • swingmobile - The CSS is loaded by Swing Mobile

The app attribute can contains a single value or a list of values separated by a comma e.i. app="swing,swingmobile".
The CSS without app attribute are loaded by all the applications.

Here a configuration example:

<stylesGroup>
    ...
    <cssStylesheets>
        <stylesheet title="alternative-style_1" href="&Home;/.../style1.css" app="swing" />
        <stylesheet title="alternative-style_2" href="&Home;/.../style2.css" app="Prime" />
        <stylesheet title="alternative-style_3" href="&Home;/.../style3.css" />
        <stylesheet title="alternative-style_4" href="&Home;/.../style4.css" app="swing,swingmobile" />
    </cssStylesheets>
    ...
</stylesGroup>

The order with which the stylesheets are declared is always respected regardless or whether the app attribute is present or not. In particular, the loaded order is the following:

  1. the stylesheet declared in the channel configuration

  2. the document stylesheet (which is applied only if the channel has no stylesheets configured)

  3. all the stylesheets configured under the <cssStylesheets> tag

The previous stylesheets tag configuration (managed only by Swing) is deprecated.

<stylesGroup>
    ...

    <!-- Deprecated -->
    <stylesheets app="swing">
        <stylesheet href="&Home;/.../style1.css"/>
        <stylesheet href="&Home;/.../style2.css"/>
        <stylesheet href="&Home;/.../style3.css"/>
    </stylesheets>
</stylesGroup>

Story editor preserve attribute

To prevent a user from removing a tag, it’s possible to add the xsm-preserve attribute to that tag in the xml template. This attribute can have two values:

  • true: trying to remove a tag with the attribute xsm-preserve="true" in the story editor will result in a notification error. Adding this attribute to an image placeholder or to another block component will remove the "Delete" action from the actions available for the component.

  • auto: removing a tag with the attribute xsm-preserve="auto" will require a confirmation from the user.

<photo-web>
    <photo xsm-preserve="true" />
    <photo-caption>
        <p><?EM-dummyText Insert caption here?></p>
    </photo-caption>
</photo-web>

Story editor Code Block custom label

To support a custom label in a Codeblock component a custom attribute named custom-attr can be added to the tag that identifies the Codeblock.
The default tag inserted by Swing when the user clicks on the Insert Codeblock button is <scriptblock>.

Example of a scriptblock inside a Story:

<story id="U44868451677Bah">
    <text id="U1064513452038d">
        <p>The following is a code block</p>
        <scriptblock id="U53511461645XxI" custom-attr="Example of a custom attribute">
            <?EM-dummyText Insert Code Block here?>
        </scriptblock>
        <p>This is the text after the codeblock</p>
    </text>
</story>

To show the custom attribute it’s possible to add a css rule to a configured custom css, as dispalyed in the following example:

[custom-attr]:before {
    content: attr(custom-attr);
    color: #4e84bb;
    margin-top: -37px;
    margin-right: 5px;
    background-color: #dde7ed;
    padding: 6px;
}

ColumnCfgCatalogs.swing

The standard columnCfgCatalogs.cfg file is ignored by Swing, but it is possible to configure a specific Swing column catalogs at different levels:

The column name cannot be null or an empty string

List of specific Swing catalogs

The dir="/" attribute must be defined in each catalog

Incoming Tasks

It defines the view for the incoming tasks/topic items.

<catalog dir="/" type="incomingTasks" name="Incoming Tasks">
   <EOMCfgView>...</EOMCfgView>
</catalog>

Outgoing Tasks

It defines the view for the outgoing tasks/topic items.

<catalog dir="/" type="outgoingTasks" name="Outgoing Tasks">
   <EOMCfgView>...</EOMCfgView>
</catalog>

Incoming Messages

It defines the view for the incoming messages.

<catalog dir="/" type="inBoxMessages" name="InBox messages">
   <EOMCfgView>...</EOMCfgView>
</catalog>

Outgoing Messages

It defines the view for the outgoing messages.

<catalog dir="/" type="outBoxMessages" name="OutBox messages">
   <EOMCfgView>...</EOMCfgView>
</catalog>

Candidate Browser and Correlation panel layout

It defines the view for specified contexts.

Queries

<catalog dir="/" type="methodeResultSetThumbnails" name="methodeResultSetThumbnails">
    <EOMCfgView>
	    <field fieldId="1" width="160" />
        <field fieldId="2" name="ImageArea" source="content" format="img:thumbnail" />
        <field fieldId="3" name="Title" width="300" priority="5">
            <choice op="notEmpty" minLength="5">
                <data source="info/system_attributes/props/title" />
                <data source="info/attributes/ObjectMetadata/General/Headline" />
                <data source="info/attributes/Metadata/DocTitle" />
                <data source="info/attributes/Metadata/Title" />
                <data source="info/attributes/meta/wire/title" />
                <data source="info/attributes/Metadata/Keywords" />
                <data source="info/attributes/Metadata/DocKeywords" />
                <data source="info/name" />
                <data source="info/attributes/ObjectMetadata/iptc/headline" />
                <data source="info/attributes/ObjectMetadata/iptc/caption" />
                <data source="info/attributes/ObjectMetadata/iptc/image_name" />
            </choice>
        </field>
		...
   </EOMCfgView>
</catalog>

Folders

<catalog dir="/" type="methodeBrowseThumbnails" name="methodeBrowseThumbnails">
    <EOMCfgView>
	    <field fieldId="1" width="160" />
        <field fieldId="2" name="ImageArea" source="content" format="img:thumbnail" />
        <field fieldId="3" name="Title" width="300" priority="5">
            <choice op="notEmpty" minLength="5">
                <data source="info/system_attributes/props/title" />
                <data source="info/attributes/ObjectMetadata/General/Headline" />
                <data source="info/attributes/Metadata/DocTitle" />
                <data source="info/attributes/Metadata/Title" />
                <data source="info/attributes/meta/wire/title" />
                <data source="info/attributes/Metadata/Keywords" />
                <data source="info/attributes/Metadata/DocKeywords" />
                <data source="info/name" />
                <data source="info/attributes/ObjectMetadata/iptc/headline" />
                <data source="info/attributes/ObjectMetadata/iptc/caption" />
                <data source="info/attributes/ObjectMetadata/iptc/image_name" />
            </choice>
        </field>
        ...
   </EOMCfgView>
</catalog>

In order to change the visualization of results, it is also necessary to change the src-preview-eom.html template. Please check the Search documentation for further information.

Search results

The "type" and "name" attributes must be exactly set as explained in the example below:

<catalog dir="/" type="methodeResultSetList" name="SwingResultSet">
   <EOMCfgView>
        <props sort="name+type&amp;ascending" activeViewer="off" autoScroll="none" />
        <column fieldId="1" name="Title" width="300" priority="5">
            <choice op="notEmpty" minLength="5">
                <data source="info/system_attributes/props/title" />
                <data source="info/attributes/ObjectMetadata/General/Headline" />
                <data source="info/attributes/Metadata/DocTitle" />
                <data source="info/attributes/Metadata/Title" />
                <data source="info/attributes/meta/wire/title" />
                <data source="info/attributes/ObjectMetadata/GeneralMetadata/Headline" />
                <data source="info/attributes/Metadata/Keywords" />
                <data source="info/attributes/Metadata/DocKeywords" />
                <data source="info/name" />
            </choice>
        </column>
        <column fieldId="2" name="Summary" width="300" priority="5">
            <choice op="notEmpty" minLength="1">
                <data source="info/system_attributes/props/summary" />
                <data source="info/attributes/ObjectMetadata/iptc/headline" />
                <data source="info/attributes/ObjectMetadata/iptc/caption" />
                <data source="info/attributes/ObjectMetadata/iptc/image_name" />
            </choice>
        </column>
        <column fieldId="3" name="Date" source="info/created" width="130" />
        <column fieldId="4" name="Type" width="90" source="info/type" />
        ...
   </EOMCfgView>
</catalog>

In order to change the visualization of the search results, it is also necessary to change the src-preview-eom.html template. Please check the Search documentation for further information.
All the other non-standard queries (additionally configured to the default listed above) must have the listable="true" attribute to be correctly visualized, while the name can be any string.

Explorer catalogs

In the Explorer area, two default views are available under the "List view" menu and they cannot be hidden:

  • Default - It is the view shown when the Explorer tab is selected

  • Default Advanced - It is another default view usually used for query result sets

These two views can be customized and overridden by defining the two corresponding <catalog> elements as described below:

  • to override the Default is necessary to configure a catalog with type="methodeBrowseList" (the "name" value is not relevant in this case), e.i.:

<catalog dir="/" type="methodeBrowseList" name="Replace default view">

  • to override the Default Advanced view is necessary to configure a catalog with type="methodeResultSetList" and name="SwingResultSet", e.i.:

<catalog dir="/" type="methodeResultSetList" name="SwingResultSet">

In addition, it is also possible to add more views to the list by configuring catalogs with attribute listable="true" and type="methodeBrowseList" or type="methodeBrowseThumbnails", e.i.:

<catalog dir="/" type="methodeBrowseList" name="Another list view" listable="true">

Columns data layout and attributes

For each column it’s possible to describe what data must be retrieved from the database, how data must be retrieved and how it must be displayed in the client panel. In addition to the standard Data elements, Swing added some new attributes that can be defined for each column:

Table 1. Attributes
Attribute Values Description

priority (optional)

0 - 5

It defines if the column can be hidden when resizing the client window. The smaller the number is, the sooner it will get hidden during the resize. If priority is set to 5, that column will never be hidden.

eomType (optional)

user, status, usage_ticket, correlations

It defines the popover type to show. See the eomType supported values listed below.

The supported prefix for the format attribute are ico: for the icon and dt: for date (the ut: for usage ticket are not supported). To use the ico: it is required to adopt the format ico:icon_xxx, the icons will not visible in the column if you omitted the "icon_" string.

If it is necessary to customize an ico:icon_xxx defined in the format attribute, it is possible to specify it in the <icons> configuration of the WebClientConfig.xml. See the example below.

Configuring the following format in the columnCfgCatalogs.swing.xml:

<column fieldId="33" name="Podcast" ... format="ico:icon_podcast" />

It is possible to associate it to a specific supported icon in the WebClientConfig.xml as following:

<WebClientConfiguration>
    <icons>
        <icon type="ico:icon_podcast">fa fa-podcast</icon>
    </icons>
</WebClientConfiguration>

For more details about the icons configuration see the following page.

eomType supported values

The eomType attribute must have one of the following values:

  • user - It shown a popover with the user’s information

  • status - It shown a popover with the status name

  • usage_ticket - It shown a popover with the usage tickets

  • correlations - It shown a popover with the correlated objects

<!-- Sample column configuration -->
<column fieldId="27" width="30" name="U-Ticket" eomType="usage_ticket">
    <choice op="notEmpty" minLength="5">
        <data source="info/usage_tickets/tl/t/tp" eomType="usage_ticket" />
    </choice>
</column>
<column fieldId="28" width="30" name="Corr" eomType="correlations">
    <choice source="info/virtual_attributes/va/corrs" op="count">
        <data test="0" />
        <data test="*" source="info/virtual_attributes/va/corrs" eomType="correlations" />
    </choice>
</column>

Priorities

It is possible to customize the Explorer Area grid by working on priorities of the columns in the ColumnCatalog. Specifically, there are five different layouts for the grid:

  • xLarge (priorities 0,1,2,3,4,5 visible): browser width > 1500 px

  • large (priorities 1,2,3,4,5 visible): 1350px < browser width < 1500px

  • medium (priorities 2,3,4,5 visible): 1200px < browser width < 1350px

  • small (priorities 3,4,5 visible): 1024px < browser width < 1200px

  • xSmall (priorities 4,5 visible): browser width < 1024px

So, it is important to define the right priorities according to the average screen resolution available in your organization.

Enable download

In order to enable the download of files from the Explorer Area grid, it is necessary to configure the following column:

<column fieldId="10" width="25" priority="2" name=" ">
    <choice>
        <data type="EOM::Folder" source="info/name" format=" " />
        <data type="PortalBlog" source="info/name" format=" " />
        <data source="info/name" format="ico:icon_action_download" />
    </choice>
</column>

Furthermore, it is necessary to have the _PadmaPriv_enableDownload privilege active.

ColumnCfgCatalogs.swingmobile

The same behaviour is used by Swing Mobile, standard columnCfgCatalogs.cfg file is ignored, but it is possible to configure a specific column catalogs at different levels:

The column name cannot be null or an empty string

A configuration example is available in the release:
swing-app-tomcat-8.5-standalone/sample/columnCfgCatalogs.swingmobile.cfg

Moreover, for Swing Mobile is mandatory the configuration of the <catalogConfigName> tag in the mras.xml server file:

<catalogConfigNames>
    <catalogConfigName applicationId="swingmobile" catalog="columnCfgCatalogs.swingmobile.cfg" />
    ...
</catalogConfigNames>

All the configuration info is available in the MRAS Confluence page to the paragraph Setup catalog for each applicationId.

DtdExtension.dtx

The DTX file is an extension of Méthode DTD and its file begins with <emDtdExt> tag.
NOTE: All the following tags are only managed by Swing, Prime ignores these configurations.

Caption Elements

A <container> configuration is needed to define which fields must be displayed when you edit the captions of Image and Link objects.
If you do not want to configure the <container> inside the <containerElements>, it is possible to use the <captionElements>, that are not considered by Prime.

Swing searches the configured <container> first in the <captionElements> and, if it does not find anything, then it searches it in the <containerElements>. 
<emDtdExt>
    <captionElements>
        <container name="link-rel" visible="false">
            <dataElement name="link-type" title="Type" placeholder="Insert a type" />
            <dataElement name="link-title" title="Title" placeholder="Insert Title" type="caption" />
            <dataElement name="link-author" title="Author" placeholder="Insert Author" />
        </container>

        <container name="foto-online">
            <dataElement name="foto-online-gr/p/s1" title="Main Caption" type="caption" />
            <dataElement name="foto-online-gr/p/foto-credit" title="Gallery Credit" />
            <dataElement name="foto-online-gr/p/s2/foto-credit" title="Story Credit" />
        </container>
    </captionElements>
</emDtdExt>

Container

The supported attributes of the <container> tag are:

  • name - The name of the container element.

  • visible [true (default) | false] - It sets the visibility of the container element.

Data Element

The supported attributes of the <dataElement> tag are:

  • name - The xpath of the element relative to the container group.

  • type [caption] - The <dataElement> that contains this attribute will be displayed under the link in the collection container of the story editor. It is possible to apply this attribute only once, in case you configure other types (in the same <container>), they will not be considered; "caption" is the only available option.

  • title - The title visible at the top of the <dataElement> field.

  • placeholder - The dummy text displayed in the <dataElement> field.

Data Sources

Swing manages the <dataSources> configuration: the Méthode users can access to external databases and locate values to inserted them in a story from the DataSource menu available in the HOME editor tab.

Special Elements

The <specialElements> tag is used to define the type (image, audio, pdf, etc …​) of a given element and it defines how this element should be displayed in the Story Editor.

For example, a list will be displayed differently in the text respect to an image or an audio file.

The following elements are supported:

  • <imageElementInfo>

  • <graphicElementInfo>

  • <videoElementInfo>

  • <audioElementInfo>

  • <objectElementInfo>

  • <collectionElementInfo>

  • <externalObjectElementInfo>

  • <oembedElementInfo>

  • <codeblockElementInfo>

Codeblock Element Info

The <codeblockElementInfo> configuration allows to define which tags must be managed as "Codeblock".
The first codeblockElementInfo will be inserting with the "Codeblock" action of the INSERT toolbar, though more then one are configured.

Configuration example:

<emDtdExt>
    <specialElements>
        <codeblockElementInfo>
            <elementName>cb-name</elementName>
        </codeblockElementInfo>
    </specialElements>
</emDtdExt>

Element Name

The <elementName> specifies the name of the element to be considered as a codeblock object. If not configured the default tag scriptblock will be inserted.

Oembed element info

The <oembedElementInfo> configuration allows to define which tags must be managed as "Embed".
The first oembedElementInfo will be inserting with the "Embed" action of the INSERT toolbar, though more then one are configured.

Configuration example:

<emDtdExt>
    <specialElements>
        <oembedElementInfo>
            <elementName>ob-name</elementName>
            <uriAttr>at-name</uriAttr>
        </oembedElementInfo>
    </specialElements>
</emDtdExt>

Element Name

The <elementName> specifies the name of the element to be considered as a oembed object. If not configured the default tag oembedblock will be inserted.

Uri Attr

The <uriAttr> specify the attribute name where the link must be saved. If not configured the default attribute name oembed will be inserted.

Mediagallery Element

The <mediagalleryElement> configuration allows to define which tag must be inserted by clicking on the "Gallery" button displayed in the INSERT Editor tab.
Configuration example:

<emDtdExt>
    <specialElements>
        <mediagalleryElement>mg-name</mediagalleryElement>
    </specialElements>
</emDtdExt>

Mediagallery Element

The <mediagalleryElement> specifies the name of the element to be considered as a MediaGallery object. If not configured the default tag mediagallery will be inserted.

DefaultSocial Post Element

The <defaultSocialPostElement> configuration allows to define which tag must be inserted by clicking on the "Embed post" button displayed in the menu list on a Social object.
Configuration example:

<emDtdExt>
    <specialElements>
        <defaultSocialPostElement>sp-name</defaultSocialPostElement>
    </specialElements>
</emDtdExt>

Default Social Post Element

The <defaultSocialPostElement> specifies the name of the element to be considered as a Social Post object. If not configured the default tag socialcontent will be inserted.

Image Element Info

In the story editor, all tags are considered normal text elements. In case of raster image elements it is necessary to specify that they are images so the story editor knows it needs to draw a photo placeholder in order to display the photograph as well as specifying other necessary attributes.

Surrogate Type

The <surrogateType> must be configured when it is necessary to insert an object type which is not an image into an image placeholder instead of their specific tags (e.g. <videoElementInfo> or <graphicElementInfo>). Only Video, Graphic and PDF elements are managed.
The label and icon displayed in the image placeholder will be those related to the surrogate type value.

For example, suppose that you want to manage a video, a graphic or a pdf object in an image placeholder, you need to modify the <imageElementInfo> tag as in the examples below:

<emDtdExt>
    <specialElements>
        <imageElementInfo>
            <elementName>video</elementName>
            ...
            <surrogateType>video</surrogateType>
        </imageElementInfo>

        <imageElementInfo>
            <elementName>infographic</elementName>
            ...
            <surrogateType>PDF</surrogateType>
        </imageElementInfo>

        <imageElementInfo>
            <elementName>graphic</elementName>
            ...
            <surrogateType>Graphic</surrogateType>
        </imageElementInfo>
    </specialElements>
</emDtdExt>

Allowed Types

The <allowedTypes> is the list of the object types that can be inserted in the element (e.g. graphic, PDF, etc), it can accept one or more values, which must be separated by a comma.
The label and icon displayed in the image placeholder will remain those of the image.

For example, if a image element should accepts a graphic or a pdf object it will configure as following:

<emDtdExt>
    <specialElements>
        <imageElementInfo>
            <elementName>photo-web</elementName>
            ...
            <allowedTypes>Graphic,PDF</allowedTypes>
        </imageElementInfo>
    </specialElements>
</emDtdExt>

Object Element Info

In the story editor, all tags are considered normal text elements. In case of external object elements it is necessary to specify that they are external objects so the story editor knows it needs to draw an external placeholder in order to display the external object as well as specifying other necessary attributes. In the Swing editor the external placeholder is wrapped by a block element.
The wrapper element has the attribute eom-component-type set to the value eomdb-embed-block.

Apply custom css

It’s possible to change the layout of the wrapper element by using a custom css that leverage on the attribute eom-component-type and on the classes defined in the content element. The class attribute value of the content object will be replicated in the xsm-child-class attribute of the wrapper element.

For example with the following xml content:

<content-block class="galleryRight" dtxInsert="Link Gallery" fileref="/Globe/Stories/Politics/Galleries/New Gallery.gallery.xml?uuid=998-fb3e48&amp;xp=/doc/story&amp;lt=link" id="U256">
</content-blcock>

It will be necessary to configure a css like this:

[eom-component-type="eomdb-embed-block"][xsm-child-class~="galleryRight"] {
	float:right;
	width: 380px !important;
	margin-left: 2px !important;
}

Collection Element Info

The <collectionElementInfo> tag allows to manage a link box area in the story text, in which the user can drag and drop some configured object types and link them to the story.

<emDtdExt>
    <specialElements>
        ...
        <collectionElementInfo>
            <elementName>related-link</elementName>
            <uriAttr>href</uriAttr>
            <type>insert</type>
            <allowedTypes>type1,type2,etc</allowedTypes>
            <allowedWebTypes>breakingNews,videoStory</allowedWebTypes>
            <xpathWebTypes>//ObjectMetadata/General/WebType</xpathWebTypes>
            <dropElement>drop-links</dropElement>
            <headerElement>story-links-headline</headerElement>
            <allowDuplicate>true</allowDuplicate>
            <customizableAttributes>eomtest1,eomtest2</customizableAttributes>
            <maxItems>3</maxItems>
        </collectionElementInfo>
    </specialElements>
</emDtdExt>

Element Name

The <elementName> specifies the name of the element to be considered as a collection object.

Uri Attr

By default Swing uses the <uriAttr> of the dropped elementInfo. If the dropped elementInfo has not its own defined <uriAttr>, this is the file reference attribute used for the location of the object.

Type

The <type> value is needed to decide which type of insertInfo must be applied when the user drags and drops an object in the content item. It is only possible to configure one of the following three types:

  • insert: the template is searched among the insertInfo with type="insert"

  • embed: the template is searched among the insertInfo with type="tease"

  • link: the template is searched among the insertInfo with type="link"

Allowed Types

The <allowedTypes> is the list of the object types that can be inserted in the content item (e.g. EOM::CompoundStory, EOM::MediaGallery, Image, etc).

Xpath Web Type

The <xpathWebTypes> the xpath where to look for the web type value in the object’s metadata that can be compared with the list of allowed web types (e.g. //ObjectMetadata/General/WebType).

Allowed Web Types

The <allowedWebTypes> a list of valid web types that must match with the metadata of the object whose value is defined by the xpathWebTypes (e.g. breakingNews,videoStory, etc).

Drop Element

The <dropElement> is necessary only to manage the dummy area placeholder displayed on Prime. The element defined in this item will be ignored from the collection element in Swing.

Header Element

The <headerElement> allows to add and display an editable Title.

Allow Duplicate

The <allowDuplicate> should be configured only when it is necessary to add multiple times the same object to a collection.

Customizable Attributes

The <customizableAttributes> tag should be configured only to define a list of attributes used to differentiate the linked object with a particular CSS style.

Max Items

The <maxItems> tag should be configured to define the maximum number of objects that can be inserted in the content item.

Both xpathWebTypes and allowedWebTypes must be configured if you want to insert an object based on the configured web type value

External Object Element Info

The <externalObjectElementInfo> tag allows to manage an external object box area in the story text, where the user can insert some external objects from a dedicated panel. For example PowerPoint slides.

<emDtdExt>
    <specialElements>
        ...
        <externalObjectElementInfo>
			<elementName>slide-deck</elementName>
			<elementAssetName>slide-asset</elementAssetName>
			<elementCaptionName>slide-caption</elementCaptionName>
            <elementHeadlineName>slide-headline</elementHeadlineName>
		</externalObjectElementInfo>
        ...
        <externalObjectElementInfo>
 			<elementName>celldata</elementName>
 			<elementType>inline</elementType>
 		</externalObjectElementInfo>
        .......
    </specialElements>
</emDtdExt>

Element Name

The <elementName> specifies the name of the element to be considered as a external object.

Element Asset Name

The <elementAssetName> specifies the name of the element that will contain a graphic display of the external object element, after the external object has been imported in the Méthode environment.

Element Caption Name

The <elementCaptionName> specifies the name of the element that will contain a caption for the external object.

Element headline Name

The <elementHeadlineName> specifies the name of the element that will contain a headline for the external object.

Element type

The <elementType> [block/inline] specifies the type of the element that will contain a value coming from an external source. For example from a cell of Excel. Default value is block.

If elementType is set to inline only the elementName has to be configured. The elementAssetName, elementCaptionName and elementHeadlineName are not used.

For backward compatibilty, in case of Excel external object, also the following configuration is supported. For all the <elementName> specifies the name of the element.

The <galleryItem> tag allows to manage an external object box area in the story text, where the user can insert some external objects from a dedicated panel. In this case Excel elemnt:

<galleryItem>
    <elementName>figure</elementName>
</galleryItem>

The <galleryItemHeadline> tag allows to manage headline for an external object

<galleryItemHeadline>
    <elementName>figure-headline</elementName>
</galleryItemHeadline>

The <galleryItemAsset> tag allows to manage element for an external object that will contain a graphic display of the external object element, after the external object has been imported in the Méthode environment.

<galleryItemAsset>
    <elementName>figure-asset</elementName>
</galleryItemAsset>

The <galleryItemCaption> tag allows to manage caption for an external object

<galleryItemCaption>
    <elementName>figure-caption</elementName>
</galleryItemCaption>

If you don’t have already this configuration Swing prefers the following:
<externalObjectElementInfo>
    <elementName>figure</elementName>
    <elementAssetName>figure-asset</elementAssetName>
    <elementCaptionName>figure-caption</elementCaptionName>
    <elementHeadlineName>figure-headline</elementHeadlineName>
</externalObjectElementInfo>

Recommended configuration for dtd

<!--                                                                        -->
<!--        =============================================================== -->
<!--                                                                        -->
<!--                            SLIDE-DECK  ELEMENTS                            -->
<!--                                                                        -->
<!--        =============================================================== -->
<!--                                                                        -->
<!ELEMENT   slide-deck  (slide-headline?,   slide-asset,    slide-caption?)>
<!ATTLIST   slide-deck
    %commonattrs;
    clear-borders       CDATA       #IMPLIED
    custom-width        CDATA       #IMPLIED
    %TextAlign;
>
<!ELEMENT   slide-asset (slide)>
<!ATTLIST   slide-asset
    %commonattrs;
    clear-borders       CDATA       #IMPLIED
    custom-width        CDATA       #IMPLIED
    %TextAlign;
>
<!ELEMENT   slide-caption   (p)+>
<!ATTLIST   slide-caption
    %commonattrs;
    %TextAlign;
>
<!ELEMENT   slide-headline  (p)+>
<!ATTLIST   slide-cheadline
    %commonattrs;
    %TextAlign;
>
<!ELEMENT   slide   EMPTY>
<!ATTLIST   slide
    %mediaattrs;
>

External Object Container Element Info

The <externalObjectContainerElementInfo> tag allows to manage an external object container box area in the story text, where the user can insert some external objects from a dedicated panel. For example a collection of Excel Linking objects.

<emDtdExt>
    <specialElements>
        ...
        <externalObjectContainerElementInfo>
			<elementName>figure-gallery</elementName>
			<elementCaptionName>figure-gallery-caption</elementCaptionName>
            <elementHeadlineName>figure-gallery-header</elementHeadlineName>
		</externalObjectContainerElementInfo>
        ...
    </specialElements>
</emDtdExt>

Element Name

The <elementName> specifies the name of the element to be considered as a external object container.

Element Caption Name

The <elementCaptionName> specifies the name of the element that will contain a caption for the external object container.

Element headline Name

The <elementHeadlineName> specifies the name of the element that will contain a headline for the external object container.

Section Elements

The <sectionElements> configuration allows to identify a container of a group of elements in the Story Editor.

For example, it is possible to configure a group of multiple items with a Title, an image and a text. Example configuration:

<emDtdExt>
    <sectionElements>
        <section name="contentBox"></section>
    </sectionElements>
</emDtdExt>

The section container can be deleted by clicking on the "Delete section" button in the HOME editor tab or by clicking on the garbage icon on the relevant placeholder. It cannot be deleted by pressing backspace or canc keyboards.
To display these delete buttons it is necessary to set the _PadmaPriv_enableDeleteSectionElement privilege at true.

It’s not possible to declare as section elements, elements that are already special elements or Codeblock element or Oembedblock element or Mediagallery element, or DefaultSocial Post Element.

Wrapped Block Elements

The <wrappedBlockElements> configuration is needed to support inline images when the <photo-group> is configured inside a <p> tag in the Story Editor.

Example of Story content:

<doc>
    <story id="U4486845">
        <text id="U2068231">
            <p>This is my text text text</p>
            <p>
                <photo-group>
                    ...
                </photo-group>
            </p>
            <p>text text text text</p>
        </text>
    </story>
</doc>

For example, to manage the story content above the following configuration will require:

<emDtdExt>
    <wrappedBlockElements>
        <wrappedBlock name="photo-print" parentNodeName="text" wrapNodeName="p"/>
    </wrappedBlockElements>
</emDtdExt>

Wrapped Block

The supported attributes of the <wrappedBlock> tag are:

  • name - The name of the image tag that can be wrapped when it’s inside a content.

  • parentNodeName - The parent node name of the wrapped node.

  • wrapNodeName - The wrapped node name of the image tag.

Wrapper Table Elements

The configuration of the <wrapperTableElements> tag or of the "wrappertabledeletable" attribute it is necessary only in particular cases to delete the configured container of a table. In this way when you click on the garbage icon on the table placeholder also its container will be deleted.

To do this, it is necessary to configure one of the following case.

1 - Add the <wrapperTableElements> tag configuration. For example:

<emDtdExt>
    <wrapperTableElements>
        <wrapperTable name="pbox" deletable="true"/>
    </wrapperTableElements>
</emDtdExt>

Wrapper Table

The supported attributes of the <wrapperTable> tag are:

  • name - The xpath of the element relative to the container group.

  • deletable [true | false (default)] - If true, also the table container is deleted.

2 - Set the "wrappertabledeletable" attribute to true in the container element configured in the insertInfo. For example:

<emDtdExt>
    <insertInfo>
        ...
        <pbox wrappertabledeletable="true">
            <table border="1" cellpadding="2" cellspacing="2" width="100%">
                <tr>
                    <td align="left" valign="middle" width="33%"><?EM-dummyText -1-?></td>
                    <td align="left" valign="middle" width="33%"><?EM-dummyText -2-?></td>
                    <td align="left" valign="middle" width="33%"><?EM-dummyText -3-?></td>
                </tr>
            </table>
        </pbox>
    </insertInfo>
</emDtdExt>

  • wrappertabledeletable [true | false (default)] - If true, also the table container is deleted.

Block Items

The configuration of the <blockItems> tag it’s used by the editor serializer to determine which html tag used to wrap xml content of a document and render it in the editor window.

All the tags defined as <blockItems> are wrapped with a div tag, the other ones are wrapped with a span tag.

The serializer excludes the tags that are already standard HTML tags. For example p, h1, h2 etc.

Example of dtx configuration:

<emDtdExt>
    <blockItems>
        <!-- summary will be wrapped with a div tag -->
        <name>summary</name>
    </blockItems>
</emDtdExt>

Block Components

All the tags that wrap a block component must be declared as blockItems.

For example if the photo-web tag wraps the fw-photo tag that is declared as an imageElementInfo, the photo-web must be declared as blockItems.

Example:

<!-- dtx configuration -->
<emDtdExt>
    <imageElementInfo>
        <elementName>fw-photo</elementName>
        <uriAttr>fileref</uriAttr>
        <widthAttr>width</widthAttr>
        <heightAttr>height</heightAttr>
        <titleAttr>alt</titleAttr>
    </imageElementInfo>

    <blockItems>
        <name>photo-web</name>
    </blockItems>
</emDtdExt>

<!-- xml content -->
<photo-web channel="Globe-Web">
    <fw-photo height="300" width="400"/>
</photo-web>

Captions inside Block Components

The caption tags children of a block container (e.g. photo-web) must be declared as blockItems.

Example:

<!-- dtx configuration -->
<emDtdExt>
    <blockItems>
        <name>photo-web</name>
        <name>photo-caption</name>
        <name>photo-source</name>
    </blockItems>
</emDtdExt>

<!-- xml content -->
<photo-web channel="Globe-Web">
    <fw-photo height="300" width="400"/>
    <photo-caption>
        <p><?EM-dummyText Caption here?></p>
        <credit><?EM-dummyText Credit here?></credit>
    </photo-caption>
    <photo-source>
        <p><?EM-dummyText Source here?></p>
    </photo-source>
</photo-web>

Embed or link other documents

The tags that define the component block that must be embed or link in the opened story must be declared as blockItems and objectElementInfo.

Example:

<!-- dtx configuration -->
<emDtdExt>
    <objectElementInfo>
        <elementName>content-block</elementName>
        <uriAttr>fileref</uriAttr>
    </objectElementInfo>

    <blockItems>
        <name>content-block</name>
    </blockItems>
</emDtdExt>

<!-- xml content -->
<content-block dtxInsert="Link Gallery" fileref="/Globe/Stories/Politics/Galleries/New Gallery.gallery.xml?uuid=998-fb3e48&amp;xp=/doc/story&amp;lt=link" id="U256">
</content-blcock>

Translations

In multi-language installations it is possible to change the display name of the elements when using the "View Tags" feature and the Channel Bars feature (view content items):

To support the translation in Swing it’s mandatory to add the attribute code to the current configuration.

The code translation to be used is specified in the WebClientConfiguration in the <language> element.

In case code translation attribute is not present in the dtx configuration, the translation with attribute default=yes is used.

Example of dtx configuration:

<emDtdExt>
    <!--  TRANSLATIONS -->
     <translations>

        <translation name="English" code="en" default="yes">
            <element name="grouphead" value="sub-group" />
            <element name="overhead" value="strap" />
            <element name="headline" value="head" />
            <element name="subhead" value="sub" />
            <element name="barhead" value="bar" />
        </translation>
        <translation name="Italian" code="it">
            <element name="grouphead" value="titolazione" />
            <element name="overhead" value="occhiello" />
            <element name="headline" value="titolo" />
            <element name="subhead" value="sommario" />
            <element name="barhead" value="catenaccio" />
        </translation>

    </translations>
</emDtdExt>

Insert Info

The <insertInfo> element is one of the most important UX elements in Méthode and it defines how users insert external objects into a story.

Workflow attribute

The workflow attribute allows different insertInfo templates to be applied based on the workflow object status. If the workflow object status does not match one of the CSV’s in the workflow attribute, the insertInfo type should not be available. For example the following configuration is managed:

<emDtdExt>
    <insertInfo type="Image" container="EOM::CompoundStory" workflow="SpecialContent/Published,Content/Published">
        <link name="Insert Image" type="insert">
            <template name="Picture Multi Images" element="photo" mode="inline,placeholder" >
                <media-group group="photo">
                    <photo width="1024" height="768" id="softCrop1"></photo>
                    <photo width="768" height="1024" id="softCrop2"></photo>
                    <photo width="1280" height="720" id="softCrop3"></photo>
                    <photo width="720" height="1280" id="softCrop4"></photo>
                </media-group>
            </template>
        </link>
    </insertInfo>
</emDtdExt>

Multiple DTX insertion

The Multiple DTX insertion of the same asset is supported. For example the following configuration is managed:

<emDtdExt>
    <insertInfo type="Image" container="EOM::CompoundStory">
        <link name="Insert Image" type="insert">
            <template name="Picture Multi Images" element="photo" mode="inline,placeholder">
                <media-group group="photo">
                    <photo width="1024" height="768" id="softCrop1"></photo>
                    <photo width="768" height="1024" id="softCrop2"></photo>
                    <photo width="1280" height="720" id="softCrop3"></photo>
                    <photo width="720" height="1280" id="softCrop4"></photo>
                </media-group>
            </template>
        </link>
    </insertInfo>
</emDtdExt>

Picture Desk Lite

The Picture Desk Lite functionality allows to manage multiple crops for a photo-group element.

<emDtdExt>
    <insertInfo type="Image" container="EOM::CompoundStory">
        ...
        <photo-group picturedesklite="true" softCrops="iPhone 6,iPad 4" disableAddCrops="false">
            <photo softCrop="Homepage-Main" width="107" height="719" softcropenabled="enabled-preferred" />
            <photo softCrop="iPhone 6" width="375" height="667" mandatory="true" />
            <photo softCrop="iPad 4" width="384" height="512"/>
            <photo softCrop="Samsung Galaxy" width="360" height="640" />
            <photo-caption>
                <p><?EM-dummyText Insert caption here?></p>
            </photo-caption>
        </photo-group>
    </insertInfo>
</emDtdExt>

  • picturedesklite [true | false (default)] - If set to true, it enables the picture desk lite functionalities in a photo-group element.

  • softcropenabled - It’s possible to define which crop will be displayed in the Picture desk lite placeholder by setting this attribute to enabled-preferred. Note that only the first photo with softcropenabled will be shown in the story editor.

  • softCrops - It’s possible to limit the list of all crops configured specifying a set in this attribute.

  • disableAddCrops [true | false (default)] - If set to true, it prevents the user to add any crop.

  • mandatory [true | false (default)] - If set to true, related crop cannot be removed.

It is also possible to enable the picture desk lite functionalities using the pictureDeskImages configuration.

Please note mandatory attribute can be configured also in crop tag in SysConfig presetCrops.

Attributes

default

The default attribute is used to specify which is the template used to insert an object in a story when the user cannot interact with the "Choose template" dialog.
Order in which the system looks for the attribute value:

  • swing

  • yes

When the "Choose template" dialog is enable the template with default="swing" is selected (in this case the default="yes" is not considered).

customInsertInfo

The attribute customInsertInfo of the link element of type insert can be set to register a new custom insertinfo implemenation for all the templates. See the documentation about the custom insertinfo template.

<emDtdExt>
    <insertInfo type="Image" channel="Globe-Web" container="EOM::CompoundStory,EOM::MediaGallery">
        <link name="Insert" type="insert" customInsertInfo="customLinkInsert">

            <template name="Custom Image One" element="fg-photo" mode="inline">
                <photo-group>
                    <fg-photo width="{uWidth}" height="{uHeight}"></fg-photo>
                    <photo-caption>
                        <p xpAttributesSource="/*/iptc/caption/text()">
                            <source xpAttributesSource="/*/iptc/source/text()"><?EM-dummyText Insert caption source?></source>
                            <?EM-dummyText Insert caption here?>
                        </p>
                        <foto-links></foto-links>
                    </photo-caption>
                </photo-group>
            </template>

            <template name="Custom Image Two" element="fg-photo" mode="inline">
                <photo-group>
                    <fg-photo width="{uWidth}" height="{uHeight}"></fg-photo>
                    <photo-caption>
                        <p xpAttributesSource="/*/iptc/caption/text()">
                            <source xpAttributesSource="/*/iptc/source/text()"><?EM-dummyText Insert caption source?></source>
                            <?EM-dummyText Insert caption here?>
                        </p>
                        <foto-links></foto-links>
                    </photo-caption>
                </photo-group>
            </template

        </link>
    </insertInfo>
</emDtdExt>

Nested Lists

Nested ordered/unordered lists are supported by Swing. Swing manages nested lists following the HTML5 standard. For backwards compatibility, it was necessary to introduce the management of nested lists, according to the scheme used by Prime. The <nestedLists> configuration is needed to support nested lists following the Prime scheme.

If the nested lists must be saved following the Prime scheme the value must be set to html4. The default value is html5.

<emDtdExt>
    <nestedLists>html5</nestedLists>
</emDtdExt>

Example Swing html5:

<ol id="U47623858114gVL" format="Mixed (2 Levels)">
    <li>Integer tincidunt metus consequat, iaculis risus non, venenatis nibh.
        <ol id="U28388145308FwK" format="Mixed Level 2">
            <li>Aliquam commodo arcu id sem lacinia feugiat. </li>
        </ol>
    </li>
    <li>Donec magna dolor, luctus eu auctor sit amet, luctus in magna.
        <ol id="U13267141686fsX" format="Mixed Level 2">
            <li>Etiam pharetra aliquet purus, at bibendum
                <ol id="U53235106516TIt" format="Mixed Level 3">
                    <li>arcu interdum eu. </li>
                </ol>
            </li>
        </ol>
    </li>
    <li>Fusce quis sem sit amet libero convallis imperdiet ut vel tortor.
        <ol id="U84616176250zxk" format="Mixed Level 2">
            <li>Etiam luctus lacus in lorem ultrices volutpat. </li>
            <li>Quisque a lacus ut mi luctus congue. Sed finibus, ante in dapibus volutpat, lorem purus elementum eros, sit amet tincidunt felis tellus in justo. </li>
            <li>Pellentesque et hendrerit neque, in fermentum tellus. Morbi id tristique eros. Maecenas at venenatis lectus, at consequat enim. Donec purus dui, elementum non mollis eu, placerat nec quam. Morbi et congue lectus. Donec tincidunt mattis eros, vitae iaculis nisl egestas nec.</li>
        </ol>
    </li>
</ol>

Example Prime scheme:

<ol id="U47623858114gVL" format="Mixed (2 Levels)">
    <li>Integer tincidunt metus consequat, iaculis risus non, venenatis nibh.
        <ol id="U28388145308FwK" format="Mixed Level 2">
            <li>Aliquam commodo arcu id sem lacinia feugiat. </li>
        </ol>
    </li>
    <li>Donec magna dolor, luctus eu auctor sit amet, luctus in magna.</li>
    <ol id="U13267141686fsX" format="Mixed Level 2">
        <li>Etiam pharetra aliquet purus, at bibendum
            <ol id="U53235106516TIt" format="Mixed Level 3">
                <li>arcu interdum eu. </li>
            </ol>
        </li>
    </ol>
    <li>Fusce quis sem sit amet libero convallis imperdiet ut vel tortor.</li>
    <ol id="U84616176250zxk" format="Mixed Level 2">
        <li>Etiam luctus lacus in lorem ultrices volutpat. </li>
        <li>Quisque a lacus ut mi luctus congue. Sed finibus, ante in dapibus volutpat, lorem purus elementum eros, sit amet tincidunt felis tellus in justo. </li>
        <li>Pellentesque et hendrerit neque, in fermentum tellus. Morbi id tristique eros. Maecenas at venenatis lectus, at consequat enim. Donec purus dui, elementum non mollis eu, placerat nec quam. Morbi et congue lectus. Donec tincidunt mattis eros, vitae iaculis nisl egestas nec.</li>
    </ol>
</ol>

Type Ahead

The <typeAhead> configuration allows to specify the character limit for a group of xpath rules or for a group of elements.

<emDtdExt>
    <typeAhead language="en-uk,it">
		<xpaths>
			<xpath charLimit="20" channel="Globe-Web">/doc/story/summary</xpath>
			<xpath charLimit="20" channel="Globe-Web">/doc/story/grouphead/headline</xpath>
		</xpaths>
		<elements>
			<element charLimit="20" channel="Globe-Web,Globe-Tablet">h1</element>
			<element charLimit="20" channel="Globe-Web">h2</element>
		</elements>
	</typeAhead>
</emDtdExt>

TypeAhead

The supported attributes of the <typeAhead> tag are:

  • language (optional) - The language attribute can contains a single value or a list of values separated by a comma. If specified, the check will be performed only if the document language satisfay one element of the list.

Xpaths

The supported attributes of the <xpath> tag are:

  • charlimit (mandatory) - The character limit value.

  • channel (optional) - The channel attribute can contains a single value or a list of values separated by a comma.

Elements

The supported attributes of the <element> tag are:

  • charlimit (mandatory) - The character limit value.

  • channel (optional) - The channel name.

In case of duplicate or conflicting configurations, the Xpath takes the priority.

TopicPlanning.cfg

Hotlinks configuration

In the TopicPlanning.cfg it is possible to configure hotlinks, that will be shown under the topic items (refer to the Confluence TopicPlanning.cfg configuration).

<hotLinks>
    <hotLink>Workflow</hotLink>
    <hotLink>Unlink</hotLink>
    <hotLink type="command" hasObject="yes" content="story" id="em.Cmd.TP_TASK_ASSIGNTO">Assign to</hotLink>
    <hotLink type="action">Reply comment</hotLink>
    <hotLink type="swingaction">em.insert</hotLink>
</hotLinks>

In Swing, it is possible to define custom hotlinks by specifying swingaction as type. Inside the tag, it is possible to specify one of the following actions:

  • createcontent - Shortcut to create an attachment for the topic item.

  • searchforcontent - Shortcut to open the search and look for an attachment.

  • assignto, assigntoattachment, assigntotopicitem - Shows the "assign to" dialog. If "assignto" is used, it will be related to the attachment (if the topic item has an attachment) or to the topic item, if there is no attachment.

  • workflow, workflowattachment, workflowtopicitem - Shows the workflow dialog. If "workflow" is used, it will be related to the attachment (if the topic item has an attachment) or to the topic item, if there is no attachment.

  • workflowmap, workflowmapattachment, workflowmaptopicitem - Shows the diagram workflow dialog. If "workflowmap" is used, it will be related to the attachment (if the topic item has an attachment) or to the topic item, if there is no attachment.

  • editattachment - Edits the attachment, if available.

  • unlinkattachment - Unlinks the attachment, if available.

  • embedobject, insertobject, linkobject - Use DTX to insert, embed or link an attachment into the Story. Only available in story editor.

  • objectpanel, objectpanelattachment, objectpaneltopicitem - Opens the objectpanel panel. If "objectpanel" is used, it will be related to the attachment (if the topic item has an attachment) or to the topic item, if there is no attachment.

  • properties, propertiesattachment, propertiestopicitem - Opens the properties panel. If "properties" is used, it will be related to the attachment (if the topic item has an attachment) or to the topic item, if there is no attachment.

  • previewtopicitem - Opens the topic item preview modal. Useful to show the preview of topic item in inline editing mode

XsmileKbd.cfg

System-wide keyboard shortcut mappings for Methode clients are configured in the Xsmilekbd.cfg file, stored under /SysConfig in the database.
Configuration example:

<keyboard>
    <context type="text">
        <key charCode="90" description="Z">
            <modifier type="C" function="editUndo" shortcut="Ctrl+Z"/>
        </key>
    </context>
</keyboard>

Context

It defines the area in which the keyboards work. The supported attribute of the <context> tag is:

  • type - Defines the context in which the keyboards work. The managed types are:

    • all - All application areas

    • text - Story and Gallery text areas

    • pkg - Topic and Topic Plan areas

Key

The <key> tag defines the key character that performs the action.

Some function keys could have a Hardcoded Browser Functions, so caution should be taken when trying to use them

The supported attributes of the <key> tag are:

  • description - The real character to which the code attribute refers to. It doesn’t have a function but it’s recommended to visualise here the real character to facilitate reading and editing of XsmileKbd.cfg.

  • charCode - It is REQUIRED to use keyboard shortcut functions.
    For keycode values refer to this site keycode page to obtain the right javascript keycode or see the table below.

The charCode attribute is REQUIRED to use keyboard shortcut functions
Keycode values
Figure 1. Keycode values

Modifier

The <modifier> tag specifies the result when pressing the key together with shift and/or control and/or alt key.
The supported attributes of the <key> tag are:

  • type - Defines the key or combinations of keys. There are three possible values that can be pressing together:

    • S = Shift

    • C = Ctrl

    • A = Alt

  • function - The function that can be associated to a specific key or key combination. Refer to the Functions List below for further information

  • shortcut - Description of the shortcut function

Functions List

The supported functions are listed below:

Function Context Description Trigger Swing action

channelRestore

text

Restores struck out text

HOME > Strike out > Restore

clearCopyfit

text

Removes the applied copyfit

PRINT DESIGN > Copyfit > Clear all

copyfit

text

Applies preconfigured copyfit

PRINT DESIGN > Copyfit > Copyfit all

dataSource

text

Inserts datasource values within a document

HOME > DataSource

dbAction

text, pkg

Executes a configured database action

DOCUMENT > Actions > [configured action]

editAttachment

pkg

Edits the attachment of a Topic Item in Topic Editor

editorExtension

text

Executes a configured editor extension. See editorExtension for further information

editPasteEx

text

Opens the Extended Paste mask

HOME > Extended Paste

editRedo

text

To redo last change

The "Back arrow" button

editSpelling

text

Opens the Spell Check

Select the "Spell Check" panel on the right

editUndo

text

To undo last change

The "Forward arrow" button

gstrikeSel

text

Hides selection from all channels

HOME > Strike out > Hide from all channels > Selection

insertEMail

text

Inserts the text saved in the "Business Mail" item in the EMC for individual users

insertHyperlink

text

Inserts an hyperlink

HOME > Hyperlink

insertInitials

text

Inserts the text saved in the "Initials" item in the EMC for individual users

insertNotes

text

Adds a note within a text

INSERT > Note

insertParaAfter

text

Inserts a placeholder paragraph. If the cursor is inside a component, insert the paragraph after the component.

INSERT > Paragraph

insertParaBefore

text

Inserts a placeholder paragraph. If the cursor is inside a component, insert the paragraph before the component.

insertPlaceholderPicture

text

Inserts a placeholder picture

INSERT > Picture

insertSignature

text

Inserts the text saved in the "Signature" item in the EMC for individual users

listItemClear

text

Deletes the formatting of the list item.

HOME

listItemPop

text

Decreases the indent of the list item.

HOME

listItemPush

text

Increases the indent of the list item.

HOME

manageDropcaps

text

Adds/removes/modifies drop caps

HOME > Dropcaps

modeBold

text

Applies the Bold style adding the tag configured in the WebClientConfig.xml [span(default) - strong - b]

HOME > B

modeItalic

text

Applies the Italic style adding the tag configured in the WebClientConfig.xml [span(default) - em - i]

HOME > I

modeNextPara

text

Moves the cursor to next text paragraph.

movePrevPara

text

Moves the cursor to previous text paragraph.

modeUnderline

text

Applies the Underline style adding the tag configured in the WebClientConfig.xml [span(default) - u]. NOTE that this is not managed by Prime

HOME > U

quickopenFile

all

Launches the Open document dialogue.

Click Open document button in the application bar

printPreview

text

Displays the Print preview

Select the "Print" preview panel on the right

quickMetadata

text

Displays the Object Panel

Select the "Metadata" panel on the right

releaseFile

text, pkg

Opens the Release mask

The "Release" button

removeTag

text

Allows to remove in-line tags applied through a tag wizard

HOME > Clear all formatting

saveFile

text

Saves the currently open file

The "Save" button

shapeAutofit

text

Fits shape to content

PRINT DESIGN > Fit shape to content

shapeBalance

text

Fits text layout to content

PRINT DESIGN > Fit text layout to content

softBreak

text

Inserts a soft line break <br/>

INSERT > Soft line-break

softBreakChannel

text

Inserts a soft break relevant to the specific channel

style

text

Applies an inline CSS style to the selected text

tag

text

Wraps the selected content in the referenced tag

toggleEditMode

text

Shows/hides the Content items

VIEW > Content items

updateXrefs

text

Updates the cross references and auto-numbering

DOCUMENT > Update references

viewDropcaps

text

Shows/hides the drop caps

VIEW > Dropcaps

viewStriked

text

Shows/hides strike out text

VIEW > Strike out

viewTags

text

Shows/hides the tags

VIEW > Tags

xml

text

Inserts text. It can be used to insert dummy text and special characters using unicode XML entity codes
The <autoCorrect> functionalities (<smartChars> and <autoReplace>) are only managed in the Story Editor context

Advanced functions

The following functions allow to create not hardcoded actions/codes.

editorExtension

The "editorExtension" function is specific for Swing Story Editor. Here a configuration example:

<key charCode="49" description="Number 1">
    <modifier type="C" shortcut="Ctrl+1">
        <function name="editorExtension" command="custom.PrependText"/>
    </modifier>
</key>

  • name - It must be set at "editorExtension"

  • command - Contains the name of the custom command action that must be executed

The command action must be called with 'shortcut' as Context Object Component Type
(e.g. ctx.component.getType() === 'shortcut').
See the Editor extensions paragraph configuration.

xml

The "xml" function allow to insert text (as dummy text or special characters) using unicode XML entity codes.
Note that in this case function needs to be its own tag with attributes name and xml.
Here a configuration example:

<key charCode="49" description="Number 1">
    <modifier type="C" shortcut="Ctrl+1">
        <function name="xml" xml="The quick brown fox jumps over the lazy dog. "/>
    </modifier>
</key>
<key charCode="50" description="Number 2">
    <modifier type="C" shortcut="Ctrl+2">
        <function name="xml" xml="&lt;ld pattern=&#34; &#34;/&gt;"/>
    </modifier>
</key>

Hardcoded Browser Functions

Some shortcuts are reserved for Browser operation and cannot be overridden. In Chrome the following shortcut cannot be intercepted (instead in Firefox all these work):

Shortcut Description

Ctrl+W

Closes the current browser tab

Ctrl+Shift+W

Closes all the browser tabs

Ctrl+T

Opens a new browser tab

Ctrl+Shift+T

Restores the browser tab

Moreover, in SwingApp the following shortcuts cannot be overridden:

Shortcut Description

Cmd+Z

Reserved for undo, currently no behaviour is associated to this shortcut. Undo is available from software keyboard toolbar and SwingApp editor toolbar

Cmd+C, Cmd+V

Reserved for Copy and Paste

Cmd+B, Cmd+I, Cmd+U

Reserved for Bold, Italic and Underline

Cmd+Blank

Reserved for iOS search

Special Key behaviour

Pay attention to special Key behaviour (e.g. "Backslash") because the keycode changes by pressing different combination.
For example the Backslash "\" corresponds to:

  • keycode 220 pressing Ctrl+\

  • keycode 192 pressing Ctrl+Alt+\

So, for Swing it’s necessary to split the configuration in two sections as displayed below:

<keyboard>
    ...
    <context type="Text">
        <key code="41" charCode="220" description="reverse slash">
            <modifier type="C">
                <function name="xml" xml="Lorem ipsum dolor sit amet"/>
            </modifier>
        </key>
        <key code="45" charCode="192" description="grave accent">
            <modifier type="CA">
                <function name="xml" xml="&#x2002;"/>
            </modifier>
        </key>
    </context>
</keyboard>

Swing versus Prime

Prime doesn’t read it the charCode attribute and vice-versa Swing doesn’t read the code attribute used by Prime. So, if you want to differentiate the shortcut it is possible to split the configuration in two parts as following:

<!-- The following Ctrl+Q keys are separately read.
They perform different actions in the same context:
the first by Prime, the second by Swing
-->
<key code="16" description="Q">
	<modifier type="C" function="dataSource" shortcut="Ctrl+Q"/>
</key>
<key charCode="81" description="Q">
	<modifier type="C" function="dbAction" shortcut="Ctrl+Q"/>
</key>

<!-- This key is read by both Prime and Swing -->
<key code="19" charCode="82" description="R">
	<modifier type="C" function="releaseFile" shortcut="Ctrl+R"/>
</key>

XsmileKbd.cfg and SwingApp

For SwingApp it is necessary to add the attribute label into the modifier definition for a shortcut. The label attribute will be shown together with the shortcut keys on iPad on long press of the cmd key.

Example of Xsmilekbd.cfg file content:

<?xml version="1.0" encoding="utf-8"?>
<keyboard>
    <autoCorrect>
        <smartChars>
            <char code="&#39;" start="&#x2018;" end="&#x2019;"/>
            ...
        </smartChars>
        <autoReplace>
            <replace text="afg" auto="Afghanistan"/>
            ...
        </autoReplace>
    </autoCorrect>

    <context type="Text">
        <key code="48" charCode="66" description="B">
            <modifier type="C" label="Background Red">
                <function name="style">background-color: red;</function>
            </modifier>
            <modifier type="CS" label="Un baiser...">
                <function name="xml" xml="Un baiser, mais &#224;..."/>
            </modifier>
            <modifier type="CA" label="&lt;company&gt;">
                <function name="tag" xml="company"/>
            </modifier>
        </key>
        ...
    </context>
</keyboard>

On Mac and on iOS (SwingApp) operating systems, the modifier "C" is the command key.