Swing Mobile Configuration

This page includes detailed information on Swing Mobile configuration.

Dashboard configuration

It is required to configure a specific Swing Mobile dashboard.
It doesn’t follow the role rule as Swing dashboard configuration.
The hierarchy to be respected is the usual one:

User > Group > SysConfig

More specific configuration overrides generic one.

The maximum number of Widgets is 5.
If the configuration is missing, Recents and Tasks widget are the default ones.
All widgets are auto updating.

Figure 1. Widgets

The links supported types are:

newcustomcontent
newcontent
newaudio
newmedia

Please refer to Swing Quicklinks for additional configuration information of each supported link type.

The creation actions are

Figure 2. Quick links

Here an example of the Swing Mobile dashboard configuration, the <mobile> node must be child of the <WebClientConfiguration>:

<mobile>
    <home>
        <widgets>
            <widget>
                <type>recents</type>
                <showObjectTitle>true</showObjectTitle>
            </widget>
            <widget>
                <type>tasks</type>
                <count>4</count>
                <dataType>incoming</dataType>
            </widget>
            <widget>
                <type>query</type>
                <!--eomPath>/Globe/Queries/MC_all</eomPath-->
                <eomId>1.0.47102132</eomId>
                <title>My Query</title>
            </widget>
            <widget>
                <type>folder</type>
                <eomPath>/Globe/Stories/News</eomPath>
                <sortBy>modified&amp;ascending</sortBy>
                <!--eomId>199$1.0.8194419</eomId-->
            </widget>
            <widget>
                <type>pinboard</type>
            </widget>
            <widget>
				<type>candidate</type>
				<title>Candidate</title>
			</widget>
        </widgets>
        <links>
            <link>
                <icon>emui-icon-file-sport</icon>
                <label>Sports Story</label>
                <action>newcustomcontent</action>
                <params>
                    <name>NewStory.xml</name>
                    <type>EOM::CompoundStory</type>
                    <template>/SysConfig/Globe/Templates/story.xml</template>
                    <folderPath>workfolder:///Globe/Sport</folderPath>
                    <channel>Globe-Web</channel>
                    <edition>Home</edition>
                    <offline>true</offline>
                </params>
            </link>
            <link>
                <icon>emui-icon-file-politic</icon>
                <label>Politics Story</label>
                <action>newcustomcontent</action>
                <params>
                    <name>NewStory.xml</name>
                    <type>EOM::CompoundStory</type>
                    <template>/SysConfig/Globe/Templates/story.xml</template>
                    <folderPath>workfolder:///Globe/Politics</folderPath>
                    <channel>Globe-Web</channel>
                    <offline>true</offline>
                </params>
            </link>
            <link>
                <icon>emui-icon-edit</icon>
                <label>News Story</label>
                <action>newcustomcontent</action>
                <params>
                    <name>NewStory.xml</name>
                    <type>EOM::CompoundStory</type>
                    <template>/SysConfig/Globe/Templates/story.xml</template>
                    <folderPath>workfolder:///Globe/News</folderPath>
                    <channel>default</channel>
                    <offline>true</offline>
                </params>
            </link>
            <link>
                <icon>emui-icon-gallery</icon>
                <label>News Gallery</label>
                <action>newcustomcontent</action>
                <params>
                    <name>NewGallery.gallery.xml</name>
                    <type>EOM::MediaGallery</type>
                    <template>/SysConfig/Globe/Templates/mediaGallery.gallery.xml
                    </template>
                    <folderPath>workfolder:///Globe/News</folderPath>
                    <channel>default</channel>
                </params>
            </link>
            <link>
                <icon>emui-icon-file</icon>
                <label>New Story</label>
                <action>newcontent</action>
            </link>
            <link>
                <icon>emui-icon-pictures</icon>
                <label>New Gallery</label>
                <action>newcontent</action>
                <params>
                    <mode>gallery</mode>
                </params>
            </link>
            <link>
            	<icon>emui-icon-volume-up</icon>
            	<label>Create Audio</label>
            	<action>newaudio</action>
            	<params>
            		<folderPath>workfolder:///Globe/News</folderPath>
            		<offline>true</offline>
            	</params>
            </link>
            <link>
            	<icon>upload</icon>
            	<label>Upload Media</label>
            	<action>newmedia</action>
            	<params>
            		<folderPath>workfolder:///Globe/Politics</folderPath>
            	</params>
            </link>
        </links>
    </home>

</mobile>

List of available widgets

Table 1. Available widgets
Widget	ID	Description
Recents	recents	The Recents widget displays the list of last edited stories' user.
Tasks	tasks	The Tasks widget allows to keep track of the activities to be done.
Query	query	The Query widget loads a specific query results.
Folder	folder	The Folder widget shows items of a configured folder.
Pinboard	pinboard	The Pinboard widget provides a list of pinned user contents.
Candidate	candidate	The Candidate widget provides Candidate Browser functionality.

Detailed widgets configuration

Recents

The Recents widget displays a summary of your last edited stories.

The widget can be configured with the following options:

Table 2. Parameters list
Parameter	Values	Description	Default value
type (required)	"recents"	Widget identifier
showObjectTitle	true/false	If false, the file name is shown	true

Sample configuration

<widget>
    <type>recents</type>
    <showObjectTitle>true</showObjectTitle>
</widget>

Tasks

The Tasks widget allows to keep track of the activities to be done.

The widget can be configured with the following options:

Table 3. Parameters list
Parameter	Values	Description	Default value
type (required)	"tasks"	Widget identifier
count	Number	Maximum items number	20
dataType	String	The type of the Tasks / Topic Items to show. Possible values [incoming / outgoing]	incoming
previewType	String	The type of the Preview to show. Possible values [task / attachment]	task

Sample configuration

<widget>
    <type>tasks</type>
    <count>4</count>
    <dataType>incoming</dataType>
    <previewType>task</previewType>
</widget>

Query

The Query widget loads a specific query results.

The widget can be configured with the following options:

Table 4. Parameters list
Parameter	Values	Description
type (required)	"query"	Widget identifier
eomId (required) (1)	eomID of a query	Only query are supported.
eomPath (required) (1)	Path	The path of the EOM Objects to analyze. The path can be specified using the format <dbId>$<path> or <connectionId>$<path>.
title	String	The label displayed in the widget

(1) See box below.

Either eomId or eomPath are required and are mutually exclusive. These parameters have the following priority:

eomId > eomPath

Sample configuration

<widget>
    <type>query</type>
    <eomId>1.0.47102132</eomId>
</widget>

<widget>
    <type>query</type>
    <eomPath>/Globe/Queries/MC_all</eomPath>
</widget>

Folder

The Folder widget shows items of a configured folder.

The widget can be configured with the following options:

Table 5. Parameters list
Parameter	Values	Description	Default value
type (required)	"folder"	Widget identifier
eomId (required) (1)	eomID of a folder	Only folders are supported.
eomPath (required) (1)	Path	The path of the EOM Folder. The path can be specified using the format <dbId>$<path> or <connectionId>$<path>.
sortBy	[modified \| created \| name]&[descending \| ascending]	The method to sort items within the folder.	modified&descending
title	String	The label displayed in the widget

(1) See box below.

Either eomId or eomPath are required and are mutually exclusive. These parameters have the following priority:

eomId > eomPath

Sample configuration

<widget>
    <type>folder</type>
    <eomId>199$1.0.8194419</eomId>
    <sortBy>modified&amp;ascending</sortBy>
</widget>

<widget>
    <type>folder</type>
    <eomPath>/Globe/Stories/News</eomPath>
    <sortBy>modified&amp;ascending</sortBy>
</widget>

Pinboard

The Pinboard widget provides a list of pinned user contents.

The widget can be configured with the following options:

Table 6. Parameters list
Parameter	Values	Description	Default value
type (required)	"pinboard"	Widget identifier

Sample configuration

<widget>
    <type>pinboard</type>
</widget>

Candidate

The Candidate widget provides Candidate Browser functionality.

The widget will show the base folders with candidate="desktop" configuration.

The widget can be configured with the following options:

Table 7. Parameters list
Parameter	Values	Description	Default value
type (required)	"candidate"	Widget identifier
title	String	The label displayed in the widget

Sample configuration

<widget>
    <type>candidate</type>
    <title>Candidate</title>
</widget>

Object panel configuration

Swing Mobile may host the same Object Panel html templates of Swing, however these may need to be adequately adjusted to correctly work also on a mobile device. For example, very complex templates or templates involving the opening of a modal window should be either modified or specifically implemented for mobile devices.

To provide a better mobile usage experience, it’s possible to configure specific Object Panel templates to be used in Swing Mobile.

Default configuration:

<objectpanel>
    <template type="EOM::CompoundStory">objectpanel.html</template>
    <template type="EOM::CompoundStory::mobile::notoolbar">objectpanel-mobile.html</template>
    <template type="EOM::Story">objectpanel.html</template>
    <template type="EOM::Story::mobile::notoolbar">objectpanel-mobile.html</template>
    <template type="EOM::WebPage">dwp-objectpanel.html</template>
    <template type="EOM::WebPage::mobile::notoolbar">objectpanel-mobile..html</template>
    <template type="EOM::MediaGallery">gallery-objectpanel.html</template>
    <template type="EOM::MediaGallery::mobile::notoolbar">objectpanel-mobile.html</template>
    <template type="Image">image-objectpanel.html</template>
    <template type="Image::mobile::notoolbar">image-objectpanel-mobile.html</template>
    <template type="EOM::TopicItem">topicItem.html</template>
    <template type="EOM::TopicItem::mobile::notoolbar">objectpanel-mobile.html</template>
    <template type="EOM::TopicItem-story>topicItem-story.html</template>
    <template type="EOM::TopicItem-story::mobile::notoolbar>objectpanel-mobile.html</template>
    <template type="EOM::TopicItem-picture>topicItem-picture.html</template>
    <template type="EOM::TopicItem-picture::mobile::notoolbar>objectpanel-mobile.html</template>

</objectpanel>

Please note the above default configuration is predefined to show default mobile object panel samples. If you desire to configure one only template for Swing and mobile, please override both the 'generic' and 'mobile notoolbar' configuration.

To configure Swing Mobile specific templates two options are available: 'mobile' and 'mobile notoolbar'.

The 'mobile' configuration offers:

native toolbar visible with close and actions button
web button bar (save, clean, reset) hidden by adding 'mobile' class to html node (can be modified in custom css)
clean and reset managed by app
save is performed manually by the user: it is required that 'formChanged' global variable is true, usually set on form element value change
save can be performed programmatically via ctx.activeObject.save()

The 'mobile notoolbar' configuration offers:

same as 'mobile' without native toolbar
clean, reset actions managed by web page calling app: ctx.activeObject.showActionsModal()
close action managed by web page calling app: ctx.activeObject.closePanel()

If neither 'mobile' nor 'mobile notoolbar' is specified (possible only for types not available in Default configuration), Swing Mobile will load the same Swing template. The template will be loaded in a panel with a native toolbar on top. All the actions (save, clean, reset) will have to be handled by the web template invoking the following api:

save: ctx.activeObject.save()
clean: eidosmedia.swingMobile.objectPanel.clean()
reset: eidosmedia.swingMobile.objectPanel.reset()

framework7 library is included in Object Panel, it supports mobile rendering of HTML elements. To activate it, add data-framework7 attribute in objectpanel template. See 'objectpanel-mobile.html' as a framework7 example. The following list of metadata components are supported with framework7:

String
Date-time, Date, time
Checkbox
Select
TextArea

Starting form version 1.2020.11, inside the editor context, it is possible to access the activeDocumentV2 (refer to Context Object Reference documentation).

Please, note that the Object Panel Bulk Mode is not supported on Swing Mobile.

ResultSet configuration

It is possible to configure some information displayed in Swing Mobile list cells.

The configuration supports the following fields: preview, body and footer.

The preview configuration enables visibility of the preview.

The body configuration enables configuration of maximum 3 fields. Each field can optionally show related icon.

The footer configuration enables configuration of one field.

Each field can refer to system attributes ('sysAttr://'), metadata ('metadata://') or object attributes.

It is also possible to configure a datetime field adding the attributes type, sourceFormat and outputFormat to a field in the body or to the footer.

type attribute must be set to date to configure a datetime field
sourceFormat attribute is used to configure the datetime format that will be used to parse the value
outputFormat attribute is used to configure the datetime format that will be used to print out the datetime value

Sample configuration:

<WebClientConfiguration>
<mobile>
  <resultSet>
    <type name="WireStory">
      <footer>metadata:///ObjectMetadata/Info/date</footer>
    </type>
    <type name="EOM::CompoundStory">
      <preview>
        <visible>false</visible>
      </preview>
      <body>
        <field icon="true">type</field>
        <field>status_info/name</field>
        <field type="date" sourceFormat="DD MMM, hh:mm a" outputFormat="DD/MM/YYYY,HH:mm:ss">dateToPrint</field>
      </body>
      <footer type="date" sourceFormat="YYYYMMDD" outputFormat="DD/MM/YYYY">sysAttr:///props/productInfo/issueDate</footer>
    </type>
  </resultSet>
</mobile>
</WebClientConfiguration>

In general all objects should have the following properties:

// item: common properties { EXAMPLE }
{
  "id": "1.0.113665564",
  "name": "Obama, Hollande agree on much -- but not Afghanistan.xml",
  "type": "EOM::Story",
  "owner": "johndoe",
  "creator": "johndoe",
  "created": 1337764225,
  "last_modifier": "johndoe",
  "modified": 1409816672,
  "locker": "",
  "locked": 1423560030,
  "status_info": {
    "name": "NewsFlow/Editing",
    "identifier": "RGB(255,0,0)",
    "comment": ""
  },
  "size": 6898,
  "channel": "Globe-Web",
  "issueDate": "20120524"
}

NewContent creation dialog configuration

It is possible to configure a custom newcontent dialog in Swing Mobile adding a particular quicklink with action custom-command.

add a new quicklink with action custom-command

Sample configuration:

<mobile>
    <home>
        <link>
            <icon>emui-icon-file</icon>
            <label>Create Report</label>
            <action>custom-command</action>
        </link>
    <home>
</mobile>

Please refer to New content creation dialog for additional information.

The registration of the custom dialog must be done using key custom

openEditor

The Method openEditor is available from the context and can be used to open the editor passing the data of the story as parameter.

The syntax is the following:

openEditor( data );

Table 8. Method information
Method	`openEditor`
Parameter	`{object} data` - The object information as JSON.
Returns	`undefined`

hideOnFileCreated

{Boolean} hideOnFileCreated if true, the new content custom dialog will be closed after story creation.

Example

{
    // ...
    hideOnFileCreated: true,
    // ...
}

Search

It is possible to show or hide Production Info fields in the search dialog.
By default all fields are shown.

See example below:

<mobile>
    <search>
        <showTeam>true</showTeam>
        <showChannel>true</showChannel>
        <showInsert>true</showInsert>
        <showEdition>true</showEdition>
        <showIssueDate>true</showIssueDate>
        <showWorkfolder>true</showWorkfolder>
    </search>
</mobile>

It is possible to add custom filters in the search dialog.
Custom filters can be of type 'text', 'list' or 'date'.
They can refer to System Attributes, Metadata or ObjectInfo fields.

See example below:

<mobile>
    <search>
        ...
        <customFilters>
            <customFilter type="string">
                <name>Image Caption</name>
                <xp>metadata:///ObjectMetadata/iptc/caption</xp>
            </customFilter>
            <customFilter type="list">
                <name>Media Type</name>
                <xp>objInfo:///type</xp>
                <values>
                    <value>Image</value>
                    <value>Video</value>
                </values>
            </customFilter>
            <customFilter type="date">
                <name>Issue Date</name>
                <xp>sysAttr:///props/productInfo/issueDate</xp>
            </customFilter>
        </customFilters>
    </search>
</mobile>

Local Authentication

It is possible to configure Local Authentication to allow use of FaceID and TouchID on iOS to authenticate the user with a face or fingerprint scan or to allow fingerprint scan on Android.
Face authentication is currently not supported on Android.
The setting applies to Swing Mobile and Swing Live Apps.
Biometric authentication will be requested after a username / password login at each app activation.
By default Local Authentication is enabled.
The default minimum interval among two biometric authentication is 10 minutes.
It is possible to explicitely activate / deactivate Local Authentication specifying true / false in the 'localAuthentication' tag.
If a number is specified, it’s considered as the minimum delay in seconds among two biometric authentication.

Sample configuration:

<WebClientConfiguration>
  <localAuthentication>true</localAuthentication>
</WebClientConfiguration>