CoFX is the framework behind time cockpit (http://www.timecockpit.com). Learn about how to extend and customize lists and forms in time cockpit.

1. UI Configuration in CoFX
Configuring Lists and Forms in CoFX and time cockpit
Publishing Date: Oct. 1st 2012

2. INTRODUCTION
Introduction
• software architects gmbh
Birkenweg 16
4060 Leonding
Austria
• Contact
Web: http://www.timecockpit.com
Phone: +43 720 890280
Email: office@timecockpit.com

3. ABOUT TIME COCKPIT
is the leading time tracking solution for knowledge workers.
Graphical time tracking calendar, automatic tracking of your work using
signal trackers, high level of extensibility and customizability, full support
to work offline, and SaaS deployment model make it the optimal choice
especially in the IT consulting business.
Try for free and without any risk. You can get your trial
account at http://www.timecockpit.com. After the trial period you can use
for only 0,20€ per user and month without a minimal
subscription time and without a minimal number of users.

4. ÜBER TIME COCKPIT
ist die führende Projektzeiterfassung für Knowledge Worker.
Grafischer Zeitbuchungskalender, automatische Tätigkeitsaufzeichnung
über Signal Tracker, umfassende Erweiterbarkeit und Anpassbarkeit, volle
Offlinefähigkeit und einfachste Verwendung durch SaaS machen es zur
Optimalen Lösung auch speziell im IT-Umfeld.
Probieren Sie kostenlos und ohne Risko einfach aus. Einen
Testzugang erhalten Sie unter http://www.timecockpit.com. Danach
nutzen Sie um nur 0,20€ pro Benutzer und Tag ohne
Mindestdauer und ohne Mindestbenutzeranzahl.

5. INTRODUCTION
UI Configuration Elements
• Lists
– Predefined filters (=form)
– Grouping
– Columns
• Forms
– Tabs
– Sections
– Fields
5

6. Lists
Lists In CoFX – Introduction
6

7. LISTS
Lists In CoFX
Form with
predefined filters
Grouping
Column order

8. LISTS
Basic List
TCQL
<List AllowDelete="True" AllowEdit="True"
Query="From Current In APP_Timesheet.Include(*)
Order By Current.APP_BeginTime Select Current"
xmlns="…" >
<BoundCell Content="=Current.APP_UserDetail" />
<BoundCell Content="=Current.APP_Project.APP_Customer" />
<BoundCell Content="=Current.APP_Project.APP_Code" />
<BoundCell Content="=Current.APP_Task.APP_Code" />
<BoundCell Content="=Current.APP_BeginTime" />
<BoundCell Content="=Current.APP_EndTime" />
<BoundCell Content="=Current.APP_Description" />
<BoundCell AggregateFunction="Sum"
Content="=Current.APP_DurationInHours" />
<BoundCell Content="=Current.APP_HourlyRateActual" />
<BoundCell AggregateFunction="Sum" Content="=Current.APP_Revenue" />
</List>
8

9. LISTS
List Definitions
• Data source is defined using TCQL queries
– See time cockpit documentation for description of TCQL
– Use TCQL Order By clause for default sorting
• Lists can be read only or read/write
– AllowDelete, AllowEdit
• Cell types and properties are derived from model
definition
– Possible to override default behavior
– See cell types in chapter about forms
9

10. Lists and TCQL
• TCQL queries with New With (=anonymous result)
– EditModelEntityName
Name of the entity that should be opened if user wants to edit an object
– EditProperty
Name of the property in the resulting object that contains the primary key (=GUID)
of the object that should be opened for edit
• Use CDATA for large TCQL queries
<List AllowDelete="True" AllowEdit="True" …>
<List.Query>
<![CDATA[
From P In Project
Where P.Customer.Country.CountryName = "Deutschland"
Select P
]]>
</List.Query>
<BoundCell Content="=Current.APP_Code" />
<BoundCell Content="=Current.APP_Description" />
</List>
10

11. LISTS
Important Cell Properties
• Content
– TCQL expression
– Use Current to access current row
• Foreground
– Foreground color for the cell
– TCQL expression for conditional formatting
– E.g. Foreground="=:Iif(Current.Budget = Null, 'Red',
'Black')"
• Header
– Column header
• Hyperlink (details see later)
• MaxWidth, MinWidth, Width
• AggregateFunction
– None, Sum, Average, Minimum, Maximum
• Specific cell types see later
11

12. LISTS
List With Grouping
<List …>
<List.Groups>
<Group AutoExpand="True"
MemberPath="APP_UserDetail"
SortDirection="Ascending" />
</List.Groups>
<BoundCell Content="=Current.APP_Description" />
<BoundCell Content="=Current.APP_Location" />
<BoundCell AggregateFunction="Sum"
Content="=Current.APP_DurationInHours" />
</List>
12

13. Forms
Forms In CoFX
13

14. FORMS
Header
Lists In CoFX
Tabs
Section
Multi column
Calculated
property (read
only)

15. FORMS
Basic Form
<Form ModelEntityName="APP_Project" xmlns="…">
<Tab Header="Project">
<Section Header="General">
<SectionColumn>
<RelationCell ColSpan="2" Content="=Current.APP_Customer"
DisplayProperty="APP_CompanyName"
List="APP_DefaultCustomerList" />
<BoundCell ColSpan="2" Content="=Current.APP_Code" />
<BoundCell ColSpan="2" Content="=Current.APP_ProjectName" />
<BoundCell ColSpan="2" Content="=Current.APP_ExternalProjectCode" />
<BoundCell Content="=Current.APP_StartDate" />
<BoundCell ColSpan="2" Content="=Current.APP_Description" />
<BoundCell ColSpan="2" Content="=Current.APP_Closed" />
</SectionColumn>
<SectionColumn>
<BoundCell Content="=Current.APP_EndDate" />
</SectionColumn>
</Section>
<Section Header="Budget">
…
</Section>
</Tab>
<BackReferenceTab BackReference="Invoices" />
</Form>
15

16. FORMS
Cell Types
• By default cell type and cell properties derived from model (BoundCell)
• Customizable
Cell Type Description
BooleanCell Checkbox
DateCell Date picker
DateTimeCell Date picker plus text box for time
DurationCell Date picker plus two text boxes for begin and end time
FileCell Possibility to upload a file (e.g. for attachments)
NumericCell Text box for entering numeric values
RelationCell Combobox for n:1 relations
TextCell Text box
UrlCell Text box for entering URLs (with hyperlink functionality in browser); currently
only supported in Silverlight version
GuidCell Text box for entering GUIDs (only for admin UIs)
ActionCell Work in progress; not finished yet
BinaryCell For internal purposes only
16

17. FORMS
Important Cell Properties
• Same as for lists (see chapter about lists)
• Additionally
– DefaultValue
• TCQL expression
– ColSpan
17

18. FORMS
Date And Time
• DateCell
– Use if you want the user to enter only date
– DateTimeFormatPattern
– DefaultDate (stored in the DB if the user does not select a date; e.g.
write 2099-12-31 instead of null)
– Possibility to mark special dates (List, ListDateProperty,
Condition; details not covered here)
• DateTimeCell
– Ancestor of DateCell
– Use if you want the user to enter date + time
– ShowTime controls whether time part can be entered by user
– ShowTime accepts bool or TCQL expression (e.g. enter time only if
expression is true)
18

19. FORMS
Duration
• DurationCell
• BeginTime
– TCQL expression identifying the property in
which begin time should be stored
• EndTime
– TCQL expression identifying the property in
which end time should be stored
19

20. FORMS
Duration Cell
<Form ModelEntityName="APP_Timesheet" xmlns="…">
<Tab Header="Zeitbuchung">
<Section Header="Allgemein">
<SectionColumn>
<DurationCell BeginTime="=Current.APP_BeginTime"
EndTime="=Current.APP_EndTime"
Header="Zeitraum" />
<BoundCell Content="=Current.APP_Description" />
<BoundCell Content="=Current.APP_Location" />
</SectionColumn>
</Section>
…
20

21. FORMS
Numbers
• NumericCell
• NumberFormatPattern
– Accepts string or TCQL expression
21

22. FORMS
Text
• TextCell
• Height
– Defines the height of the input control
• MaxLength
– Maximum length in characters
22

23. FORMS
Relations
• RelationCell
• Condition
– Used to implement dependent combo boxes (see following example)
• DisplayProperty
– Used to determine which property of the list (see List property) to show in the
combo box
• List
– Identifies the list that should be used in the combo box
• SelectFirstIfNew
– Indicates whether the first item in the list should be automatically selected when
adding new items
• ShowListAllowed
– Indicates whether it is allowed for the user to start lookup dialog (i.e. whether "…"
button is visible)
23

24. Lists & Forms Advanced Topics
24

25. LISTS
Hyperlinks
• Enable navigation from list to forms (n:1 relations) or to other lists (1:n
relations)
– Hyperlinks to custom C# components are possible (not covered here)
• Hyperlinks to forms
– Form is opened as model dialog (default behavior)
– NavigateContent = NamedFormConfiguration
– Pass UUID of element to open in EntityObjectUuid
– Pass entity name to open in ModelEntityName
• Hyperlinks to lists
– List is opened in screen are defined in Hyperlink.Target
– NavigateContent = NamedListConfiguration
– Pass entity name to open in ModelEntityName
– Pass filter parameters in NamedListConfiguration.Parameters
25

26. LISTS
Hyperlinks
<List xmlns:p=http://www.timecockpit.com/2009/ui/controls …>
<BoundCell Content="=Current.APP_UserDetail">
<BoundCell.Hyperlink>
<Hyperlink Target="APP_UserDetailForm"
Title="=Current.APP_UserDetail">
Hyperlink to a
<Hyperlink.NavigateContent> form
<p:NamedFormConfiguration
EntityObjectUuid="=Current.APP_UserDetail.APP_UserDetailUuid"
ModelEntityName="APP_UserDetail">
<p:NamedFormConfiguration.Parameters>
<ParameterCollection />
</p:NamedFormConfiguration.Parameters>
</p:NamedFormConfiguration>
</Hyperlink.NavigateContent>
</Hyperlink>
</BoundCell.Hyperlink>
</BoundCell>
<BoundCell Content="=Current.APP_Project.APP_Customer" />
<BoundCell Content="=Current.APP_Project.APP_Code" />
…
</List>
26

27. LISTS
Hyperlinks
<List …>
<BoundCell Content="Projekte">
<BoundCell.Hyperlink>
<Hyperlink Target="FilteredProjectList" Title="= 'Projekte'"> Hyperlink to
a list
<Hyperlink.NavigateContent>
<p:NamedListConfiguration ModelEntityName="APP_Project">
<p:NamedListConfiguration.Parameters>
<Parameter Name="Customer" Value="=Current.CustomerUuid" />
</p:NamedListConfiguration.Parameters>
</p:NamedListConfiguration>
</Hyperlink.NavigateContent> Pass filter
Filter parameter parameter to list
</Hyperlink>
name (see filter
</BoundCell.Hyperlink>
forms)
</BoundCell>
<BoundCell Content="=Current.APP_Project.APP_Customer" />
<BoundCell Content="=Current.APP_Project.APP_Code" />
…
</List>
27

28. LISTS
Filters
• Uses form definition language
• Dynamically added where clauses
– Specify FilterOperator and FilterPath
– Adds a "And <FilterPath> <FilterOperator>
<SelectedValue>" clause to TCQL
– Optionally define FilterParameterName for passing filter value from
hyperlinks
• Parameters in TCQL statement
– Specify FilterParameterName without FilterOperator and
FilterPath
– Parameter can be used in TCQL statement
– Note: Query optimization is done automatically (e.g. "Or @Param = Null"
 whole condition is removed if @Param is null)
28

29. LISTS
List With Filters
<List Query="From Current In APP_Timesheet.Include(*)
Where (Current.APP_BeginTime &gt;= @BeginTime Or @BeginTime = Null)
And (:AddDays(Current.APP_EndTime, -1) &lt;= @EndTime Or @EndTime = Null)
Order By Current.APP_BeginTime
Select Current" …>
<List.Filter>
<Form>
<Tab Header="Filter"><Section>
<SectionColumn>
<RelationCell DisplayProperty="APP_Fullname" FilterOperator="="
FilterParameterName="UserDetail"
FilterPath="APP_UserDetail" List="APP_DefaultUserDetailList" />
<RelationCell DisplayProperty="APP_CompanyName" FilterOperator="="
FilterPath="APP_Project.APP_Customer" List="APP_DefaultCustomerList" />
<BoundCell FilterOperator="=" FilterParameterName="Project" FilterPath="APP_Project" />
…
</SectionColumn>
<SectionColumn>
<TextCell FilterOperator="Like" FilterPath="APP_Description" />
<DateTimeCell FilterParameterName="BeginTime" Header="Von">
<DateTimeCell.ShowTime>
<x:Boolean>False</x:Boolean>
</DateTimeCell.ShowTime>
</DateTimeCell>
</SectionColumn>
</Section></Tab>
</Form>
</List.Filter>
…
</List>
29

30. LISTS
List With Filters
<BoundCell Content="Zeitbuchungen">
<BoundCell.Hyperlink>
<Hyperlink Target="FilteredTimesheetList" Title="Zeitbuchungen">
<Hyperlink.NavigateContent>
<p:NamedListConfiguration ModelEntityName="APP_Timesheet">
<p:NamedListConfiguration.Parameters>
<Parameter Name="UserDetail" Value="=Current.UserDetailUuid" />
</p:NamedListConfiguration.Parameters>
</p:NamedListConfiguration>
</Hyperlink.NavigateContent>
</Hyperlink>
</BoundCell.Hyperlink>
</BoundCell>
<List.Filter>
<Form>
<Tab Header="Filter"><Section>
<SectionColumn>
<RelationCell DisplayProperty="APP_Fullname" FilterOperator="="
FilterParameterName="UserDetail"
FilterPath="APP_UserDetail" List="APP_DefaultUserDetailList" />
…
</List>
30

31. LISTS
Python as Data Source for List
<List AllowDelete="True" AllowEdit="True" EditModelEntityName="APP_Vacation" EditProperty="VacationUuid" …>
<List.ScriptSource><sys:String xml:space="preserve">
clr.AddReference("System.Core")
import System
clr.ImportExtensions(System.Linq)
def getItems(context, queryParameters):
vacation = context.SelectWithParams({
"Query": "From V In … Where V.APP_UserDetail.APP_UserDetailUuid = @UserDetail Select New With { … }",
"QueryParameters": queryParameters })
vacationEntitlement = context.SelectWithParams(…)
if vacation.Count == 0 and vacationEntitlement.Count == 0:
vacationEntitlement = context.SelectWithParams(…)
return vacation.Concat(vacationEntitlement).OrderBy(lambda t: t.EndTime).Cast[EntityObject]()
</sys:String></List.ScriptSource>
<List.Filter><Form ModelEntityName="APP_Vacation"><Tab Header="Filter"><Section><SectionColumn>
<RelationCell FilterParameterName="UserDetail" Condition="Current.APP_IsHidden = False"
FilterPath="APP_UserDetail" FilterIsMandatory="True" SelectFirstIfNew="True"
DefaultValue="=Environment.CurrentUser.Me" />
</SectionColumn></Section></Tab></Form></List.Filter>
<BoundCell Content="=Current.UserDetail" Header="Mitarbeiter" />
…
</List>
31

32. FORMS
Relations – Dependent Combo Boxes
<Form ModelEntityName="APP_Timesheet" xmlns="…">
<Tab Header="Zeitbuchung"> If user did not
<Section Header="Project"> already select a
project…
<SectionColumn>
<BoundCell Content="=Current.APP_Project" />
<RelationCell Condition="=:Iif(Current.Project = Null,
…otherwise add a …show an empty
'1 = 0',
condition to only combo box for
display tasks of this tasks…
project
'Current.Project.ProjectUuid={' + Current.Project.ProjectUuid + '}')"
Content="=Current.APP_Task" />
</SectionColumn>
</Section>
…
Defines content
of combo box
Project Task
32

33. FORMS
FileCell
# Avatar File Name
fileNameProperty = TextProperty({
"Name": "USR_AvatarFileName", "InvariantFriendlyName":"Avatar File Name",
"MaxStorageSize" : 256, "IsNullable" : True, "IsDefaultDisplayProperty" : False,
"DefaultValueExpression" : """", "Ownership" : Ownership.User
})
contactEntity.Properties.Add(fileNameProperty)
# Avatar File Mime Type
mimeTypeProperty = TextProperty({
"Name": "USR_AvatarMimeType", "InvariantFriendlyName":"Avatar Mime Type",
"MaxStorageSize" : 256, "IsNullable" : True,
"IsDefaultDisplayProperty" : False, "DefaultValueExpression" : """",
"Ownership" : Ownership.User
})
contactEntity.Properties.Add(mimeTypeProperty)
# Avatar File Size
fileSizeProperty = NumericProperty({
"Name": "USR_AvatarFileSize", "InvariantFriendlyName":"Avatar File Size",
"Precision" : 18, "Scale" : 0, "IsNullable" : True, "FormatPattern": "#,###",
"IsDefaultDisplayProperty" : False, "DefaultValueExpression" : "0",
"Ownership" : Ownership.User
})
contactEntity.Properties.Add(fileSizeProperty)
33

34. FORMS
FileCell (Continued)
# Avatar file property.
allowedMimeTypes = List[String]()
allowedMimeTypes.Add("image/jpeg")
allowedMimeTypes.Add("image/png")
allowedExtensions = List[String]()
allowedExtensions.Add(".png")
allowedExtensions.Add(".jpeg")
allowedExtensions.Add(".jpg")
fileProperty = FileProperty({
"Name": "USR_Avatar", "InvariantFriendlyName": "Avatar",
"FileNameColumn": "USR_AvatarFileName",
"FileSizeColumn": "USR_AvatarFileSize",
"FileMimeTypeColumn": "USR_AvatarMimeType",
"MaxFileSizeInKB" : 128, "IsNullable" : True,
Compress and/or
"AllowedMimeTypes" : allowedMimeTypes,
encrypt
"AllowedExtensions" : allowedExtensions,
"ContentProcessing": ContentProcessing.Compress
})
contactEntity.Properties.Add(fileProperty)
34

35. FileCell (Continued)
List
Form
35

36. Saves the day.
Thank you!
Questions? You want more?
office@timecockpit.com