Share via


Time Card Code Sample

The Microsoft Office Live Small Business Time Card code sample demonstrates one way that you can use Windows SharePoint Services 3.0 Web services to extend the functionality of a Microsoft Office Live Small Business application.

The Time Card sample, which uses Project Manager, provides the functionality to track time by project task. It uses Web services provided by Windows SharePoint Services and data from the Project Tasks list in Project Manager to populate the list of project tasks available for time tracking.

Three files are included in the TimeCard.olp solution file and contain functions that are used in the Time Card example:

  • tasktimer.jsx

  • timecard.jsx

  • olsharedlibv1.jsx

Add Project Manager to your account

To use the Time Card code sample, you must add Project Manager to your account, and the Project Tasks list in Project Manager must contain items.

To add Project Manager to your account (if it has not been added):

  1. On the left navigation bar, click Business Applications.

  2. On the left navigation bar, click Add Applications.

  3. In Select a category, click Collaborate with coworkers and clients.

  4. In Select an application, click Project Manager. Click OK.

  5. In Application or workspace details, click OK.

  6. Enter items in the Project Tasks list in Project Manager.

Add the code sample to your account

After you add Project Manager to your account, you can download the Time Card code sample, which is located in the MSDN Code Gallery.

The download file is a solution (.olp) file, which you can add to any Office Live Small Business account as a custom business application. To learn more about adding solutions to an account, see Add a Solution to an Office Live Small Business Account.

See the code sample in action

Now that you have added the Time Card application to your account, you can see it in action.

  1. On the left navigation bar, click Business Applications.

  2. On the left navigation bar, click Time Card.

  3. In the library, click samplepage.

The Sample Web page opens, with a Page Viewer Web Part that is configured to display the Time Card. Employees can use the Time Card to select a project task and then click Punch In to track the time they are currently spending on that task. The total time spent on each task is stored, so that the next time an employee opens the Time Card, the time tracked so far on the task appears in the Time spent on task field.

Note

The URL for the Project Manager application must end with Project in order for the sample page to function correctly.

Accessing Office Live Small Business data

The Time Card code sample uses a Web service provided by Windows SharePoint Services to collect the names of the tasks in the Project Tasks list in Project Manager. More specifically, the getTasks function in timecard.jsx (located in the document library of the Time Card application) uses a Web service call to populate the Project Tasks field in the Time Card user interface. The getTasks function also uses a Microsoft JScript function included in this library in the common JScript file olsharedlibv1.jsx. This function is used to package the SOAP requests that are needed to communicate with the Web service.

Syntax

function getTasks()

The getTasks function calls the getAllListItems function that is included in olsharedlibv1.jsx. This function packages the SOAP request.

Syntax

WssSoap.prototype.getAllListItems = function(strListName, vFields, fCallback)

Parameters

Name Required/Optional Data Type Description

strListName

Required

string

Name of the source list.

vFields

Required

string[]

Array of field names to retrieve for each item in the list.

fCallback

Required

string

Callback function to execute on completion.

The Office Live Small Business list name passed to this function is site specific. This sample uses the Project Tasks list in Project Manager.

Example

JScript

g_oWssSoap.getAllListItems( TimeCardResources.LISTNAME_TASKS, 
                          new Array("ID", "Title"), onGetTaskResults);

Time Card Functionality

Capturing Elapsed Time

After the Project Tasks list has been populated, employees can select the project task that they want to time. When a user clicks Punch In, a global variable g_oTaskTimer is initialized in the initializePage function. This code is in tasktimer.jsx.

Recording and Storing Time Records

When you run the Time Card code sample, an Office Live Small Business list named TimeCard is created in Project Manager and initialized by the createTimerList and initializeTimerList functions of the TaskTimer object. Because the sole purpose of this list is to store time record items, it is hidden by default.

An item is added to this list for each time recording session. This time record item is:

  • Created when the user clicks Punch In.

  • Modified when the user clicks Punch Out.

The duration is calculated by taking the difference between the created and modified times for the list item. The total duration for a task is calculated by adding the durations of all list items associated with a particular task.

TaskTimer Methods

The following table summarizes the main methods available for a TaskTimer object.

Method Functionality Provided

startTimer

Starts the timer for the selected task and then executes the function passed as parameter.

stopTimer

Stops the timer and then executes the function passed as parameter.

createTimerList

Creates a list to store time records.

initializeTimerList

Initializes the list to store time records.

getCurrentDuration

Returns the difference between the created and modified times for the current TaskTimer object.

getTotalDuration

Returns the sum of the durations of all list items associated with a particular task.

switchTask

Stops the timer and switches to a different task for the timer.

constructTaskQuery

Constructs the query for timer items associated with the selected task.

See also

Automate List Creation
Windows SharePoint Services 3.0 Features Used in Office Live Small Business
Contact Map Code Sample
Property Value Estimator Code Sample