Description of reusable components

HTML workspace is composed of reusable components which are organized in a specific folder structure in CRX™. Each component has model, view, and template file at location specified in the folder structure, JavaScript™ dependencies on other component files, events listened by the component and JavaScript objects which trigger these events in HTML Workspace. The complete list of reusable components with constituent filenames and dependencies is given here.

TaskList

Model

tasklist.js

View

tasklist.js

Template

tasklist.html

Requires components

  • UserSearch

  • Task

  • Teamtask

JS dependencies

  • task model

  • teamtask model

Events listened (Event name – Trigger)

  • filterSelected - tasklist model

  • remove - tasklist model

  • updateQueue - tasklist model

Note:

This component can be used independently of HTML workspace, provided you trigger filterSelected event for this component from your custom application.

Task

Model

task.js

View

task.js

Template

task.html

Requires components

NA

JS dependencies

  • tasklist model

  • taskactions utility

Events listened (Event name – Trigger)

  • submitComplete - task model

  • Reject - task model

Note:

Workspace calls fetchTasks function of TaskList model to create Task models for this component.

FilterList

Model

tasklist.js

View

filterlist.js

Template

filterlist.html

Requires components

NA

JS dependencies

NA

Events listened (Event name – Trigger)

  • fetched - tasklist model

  • remove - tasklist model

  • updateQueue - tasklist model

  • refreshedQueue - tasklist model

  • filterSelected - tasklist model

Filter

View

filter.js

Template

filter.html

Requires components

NA

JS dependencies

  • Field: queue: { name, qid, isDefault, type}

  • Field: query: string

  • Field: parentView: filterlist view

  • Field: parentModel: tasklist model

  • Field: utility

Events listened

NA

TeamQueues

Model

tasklist.js

View

teamqueues.js

Template

teamqueues.html

Requires components

NA

JS dependencies

NA

Events listened (Event name – Trigger)

  • fetched - tasklist model

  • remove - tasklist model

  • updateQueue - tasklist model

  • teamQueuesFetched - tasklist model

TeamFilter

Model

NA

View

teamfilter.js

Template

teamfilter.html

Requires components

NA

JS dependencies

  • Extends : filter view

  • Field : queue :{ name, qid, isDefault, type }

  • Field : query : string

  • Field : parentView : filterlist view

  • Field : parentModel : tasklist model

  • Field : utility

Events listened

NA

Note:

TeamFilter gets the event indicating which task has been selected from TaskList component. Although these components share the model class, there is no other dependency.

TaskDetails

Model

tasklist.js

View

taskdetails.js

Template

taskdetails.html

Requires components

Most of the Utility classes

JS dependencies

  • processinstancehistory.html

  • formrendering utility

  • notes utility

  • attachments utility

  • taskactions utility

  • history utility

Events listened (Event name – Trigger)

  • forwarded - task model

  • shared - task model

  • consulted - task model

  • rejected - task model

  • abandoned - task model

  • unlocked - task model

  • locked - task model

  • claimed - task model

  • change:taskselected - tasklist model

  • change:formUrl - task model

  • attachmentURLFetched - task model
  • newAttachment - task model
  • taskHistoryFetched - task model

  • prepareForSubmitComplete - task model
  • submitComplete - task model

CategoryList

Model

categorylist.js

View

categorylist.js

Template

startprocess.html (in the route folder)

Requires components

Category

JS dependencies

  • favoritecategoryfactory model

  • allcategoryfactory model

Events listened (Event name – Trigger)

  • allStartpointsFetched - categorylist model

  • add - categorylist model

Note:

This component uses model classes of some other components like StartPointList, StartPoint, and Task. Besides this dependency, CategoryList can be used independently.

Category

Model

category.js

View

category.js

Template

category.html

Requires components

NA

JS dependencies

  • categorylist model

  • startpointlist model

Events listened (Event name – Trigger)

  • changed - category model

  • childrenFetched - category model

  • category:selected - categorylist model

StartPointList

Model

categorylist.js

View

startpointlist.js

Template

startprocess.html (in the route folder)

Requires components

NA

JS dependencies

  • category model

  • favoritecategoryfactory model

  • allcategoryfactory model

  • startpoint view

  • startpointlist model

  • startpoint model

  • task model

  • task model

  • tasklist model

  • teamtask model

Events listened (Event name – Trigger)

  • category:selected - categorylist model

  • allStartpointsFetched - categorylist model

Note:

StartPointList and CategoryList components share the model class, hence the former depends on the latter. CategoryList accesses the information about which category's start points are shown. To use StartPointList independently, simulate the event trigger from CategoryList.

StartPoint

Model

startpoint.js

View

startpoint.js

Template

startpoint.html

Requires components

NA

JS dependencies

task model

Events listened (Event name – Trigger)

change - startpoint model

StartProcess

Model

categorylist.js

View

startprocess.js

Template

startprocess.html

Requires components

  • Most of the Utility classes

  • UserSearch

JS dependencies

  • category model

  • favoritecategoryfactory model

  • allcategoryfactory model

  • formrendering utility

  • notes utility

  • attachments utility

  • taskactions utility

Events listened (Event name – Trigger)

  • category:selected - categorylist model

  • change:invokedTask - startpointlist model

  • change:formUrl - task model

  • startpoint:selected - startpointlist model

  • forwarded - task model

  • abandoned - task model

  • unlocked - task model

  • locked - task model

  • attachmentURLFetched - task model
  • newAttachment - task model
  • prepareForSubmitComplete - task model
  • submitComplete - task model

  • allStartpointsFetched - categorylist model

Note:

StartProcess and StartPointList components share the model class. This component becomes relevant you select a startpoint from StartPointList.

ProcessNameList

Model

processnamelist.js

View

processnamelist.js

Template

tracking.html (in the route folder)

Requires components

NA

JS dependencies

processname model

Events listened (Event name – Trigger)

  • add - processnamelist model

  • fetched:processnames - processnamelist model

  • change - processnamelist model

Note:

ProcessNameList does not depend on other components. However, internally it depends on ProcessInstanceList model class that in turn depends on other components. Hence, ProcessNameList uses many model classes like ProcessInstanceList, ProcessInstance, TaskList, Teamtask, and Task. Besides these dependencies, ProcessNameList can be used independently.

ProcessName

Model

processname.js

View

processname (in processnamelist.js)

Template

processname.html

Requires components

NA

JS dependencies

processinstancelist model

Events listened (Event name – Trigger)

change - processname model

ProcessInstanceList

Model

processnamelist.js

View

processinstancelist.js

Template

tracking.html (in the route folder)

Requires components

NA

JS dependencies

processname model

Events listened (Event name – Trigger)

  • processname:selected - processnamelist model

  • processname:instancesfetched - processnamelist model

Note:

ProcessInstanceList expects an event from ProcessNameList indicating the process name for fetching and displaying instances. To use ProcessInstanceList independently, simulate the event trigger separately.

ProcessInstance

Model

processinstance.js

View

processname inside processnamelist.js

Template

processinstance.html

Requires components

NA

JS dependencies

tasklist model

Events listened (Event name – Trigger)

change - processinstance model

ProcessInstanceHistory

Model

processnamelist.js

View

processinstancehistory.js

Template

processinstancehistory.html

Requires components

NA

JS dependencies

  • processname model

  • history utility

Events listened (Event name – Trigger)

  • processname:selected - processnamelist model

  • processinstance:selected - processinstancelist model

  • tasksFetched - processinstance model

Note:

ProcessInstanceHistory expects an event from ProcessInstanceList indicating which process instance's history is to be shown. Besides this dependency the component can be used independently.

OutofOffice

Model

outofoffice.js

View

outofoffice.js

Template

outofoffice.html

Requires components

UserSearch

JS dependencies

usersearch view

Events listened (Event name – Trigger)

  • outOfOfficeSettingsFetched - outofoffice model

  • outOfOfficeSettingsSaved - outofoffice model

  • processesFetched - outofoffice model

  • principalSelected - principalsearch view

Note:

OutofOffice can be used independently.

ShareQueue

Model

sharequeue.js

View

sharequeue.js

Template

sharequeue.html

Requires components

UserSearch

JS dependencies

usersearch view

Events listened (Event name – Trigger)

  • queueAccessGranted - sharequeue model

  • queueAccessRequested - sharequeue model

  • grantedUsersFetched - sharequeue model

  • accessibleUsersFetched - sharequeue model
  • queueAccessRevoked - sharequeue model

  • queueAccessRemoved - sharequeue model

  • principalSelected - principalsearch view

Note:

ShareQueue can be used independently.

UISettings

Model

uisettings.js

View

uisettings.js

Template

uisettings.html

Requires components

NA

JS dependencies

NA

Events listened (Event name – Trigger)

  • preferencesFetched - uisettings model

  • settingUpdated - uisettings model

Note:

UISettings can be used independently.

AppNavigation

Model

appnavigation.js

View

appnavigation.js

Template

appnavigation.html

Requires components

NA

JS dependencies

NA

Events listened

NA

Note:

AppNavigation can be used independently.

UserInfo

Model

userinfo.js

View

userinfo.js

Template

userinfo.html

Requires components

NA

JS dependencies

NA

Events listened (Event name – Trigger)

  • userImageUrlFetched - userinfo model
  • sessionRenewed - userinfo model
  • sessionExpired - userinfo model

Note:

UserInfo can be used independently.

WSError

Model

wserror.js

View

wserror.js

Template

wserror.html

Requires components

NA

JS dependencies

NA

Events listened (Event name – Trigger)

newWsError - wserror model

UserSearch

Model

usersearch.js

View

usersearch.js

Template

usersearch.html

Requires components

NA

JS dependencies

NA

Events listened (Event name – Trigger)

  • principalSearched - principalsearch model
  • outOfOfficeInfoFetched - usersearch model

SearchTemplate

Model

searchtemplate.js

View

searchtemplate (in searchtemplatelist.js)

Template

searchtemplate.html

Requires components

NA

JS dependencies

NA

Events listened (Event name – Trigger)

templateFetched- searchtemplate model

SearchTemplateList

Model

searchtemplatelist.js

View

searchtemplatelist.js

Template

tracking.html (in the route folder)

Requires components

NA

JS dependencies

searchtemplate model

Events listened (Event name – Trigger)

change - searchtemplatelist model

SearchTemplateDetails

Model

searchtemplatelist.js

View

searchtemplatedetails.js

Template

searchtemplatedetails.html

Requires components

NA

JS dependencies

NA

Events listened (Event name – Trigger)

searchTemplate:selected - searchtemplate model

Get help faster and easier

New user?