Team Foundation Task Board: Auto Refresh

3 minute read

 

[Update: Version 0.3 has been released]

In a previous post I talked how you could enhance TFS task board by adding the work item ids to the cards using a bookmarklet and also mentioned several things that people usually want added to their task board (like card coloring).

In that post I didn’t mentioned a common request (was saving it for this postSmile ) is the ability for the task board to be automatically refreshed.

While a automatically refresh, isn’t very interesting when used by a person, it is kind of of mandatory if you wish to have a wallboard displayed in a screen visible to the entire team.

Since this functionality isn’t available out of the box, I’ve written a Web Access Extension to add this capability to the task board.

While extensions are supported (for now only on premises version, this feature is not enabled on Team Foundation Service) they are still a black art. Writing an extension is not an easy task, since there is no public documentation yet. To be able to do it, you have to either reverse engineering or know the right people who can give an hand at this.

Extensions are executed exclusively on the client side and are written in Javascript, since 2012 Web Access supports a client side object model, so you can call practically every API that Team Foundation Server has.

There are several types of extensions but I’m not exact sure if they are formalized. with extensions you can do a lot of things (list not extensive Smile ). I’m still scratching the surface of all of this…

  • Work Item Custom Controls – You can extend work item forms with your own controls. Creating such an extension has been documented in the ALM rangers guidance – Team Foundation Server Process Template Customization Guide
  • Custom Build sections – adding custom build sections like in Team Explorer
  • Change the look & feel of pages – like using custom colors, formatting based on conditions, change CSS styles
  • Add/remove behavior from pages – like adding missing functionality or adding support for gestures for example
  • hook up custom event handlers  – like the save event for having customized validations
  • Extend of replace existing UI Controls- For example to use a different rich editor

So in order to enable auto refresh on your task board you will have to install the provided extension (I have named it Task Board Enhancer because I intend (time permitting) to add more functionality to it, the auto refresh is the first feature.

To install it, to go the admin page , by clicking on the cog icon (FIGURE 1)

Select the instance by clicking on “control Panel”

Then click on the extensions tab

Click on the cross to upload the extension zip file.

After the upload is done, you will need to enable the extension by clicking on the enable button.

To see the result, just go to a task board (you may need to press control F5 to force a full refresh of the javascript for the first time).

A new checkbox will be added (disabled by default), if you enable it will start a countdown (30 seconds for now) and then the value reaches zero, the board will be automatically refreshed.

if you wish to disable the refresh, untick the checkbox.

If you want to enable the refresh without checking the box manually, you can pass the parameter _tspRefresh with the value 1 in the url.

This can come in handy if you wish display the taskboard in a wallboard and don’t want to manually set the refresh.

For example to start Internet Explorer in kiosk mode you could do (other browsers also support similar features)

iexplore -k http://tfs.mycompany.com:8080/tfs/myTeamProject/myTeam/_board?_tspRefresh=1

(don’t form replace the text in bold with the name of your server, team project and team name (which can be omitted for the default team)

Download the extension