Skip to content
asymmetric edited this page Nov 12, 2011 · 6 revisions

Goals

  • Improve the usability of adding worktime, by reducing the complexity and number of steps
  • Improve visibility of time spent
  • Make it harder to forget to enter worktime

Design

A gallery of images are found here

Some of these images represent just the right column of the task edit view. That is, the left column with all the fields is largely unchanged from a functional point of view. Key points to notice:

  • The task title and description have been moved from the left column to the middle
  • The task title and description are now “edit in place”. We need a good jquery library to do this. This also means that you do not need to press save in order to change these fields. Data change is immediate. In the long term the “save” button will be renamed “send message”.
  • The new banner across the top of the task contains a timer. That is completely client-side, implemented in javascript. If you reload this page or move to another task, that time starts again from 0. That time is not recorded anywhere unless you press ‘save’.
  • The save button is now a drop down menu. If the user has the “record worktime” preference enabled, then clicking the save button shows a drop down menu of three choices. The first choice creates a worktime record with the value as per the javascript timer. The second choice shows a lightbox in which you can enter worktime (this functionality is identical to the existing functionality). The third option saves the record without any worktime.
  • The pause button stops the timer in the browser. Remember, all this is purely client side. pause
  • The pin icon pin starts the persistent timer exactly in the way the existing clock icon does

Worktime properties

  • Worktime records may have custom properties. One such property is shown here: ‘type’ with the value “support (billable)”.
  • Clicking on this value shows a drop down menu with other choices. The change in value is transient and stored only in the browser. Moving to another task resets this to the default.
  • We need a way of dealing with multiple properties (probably just bullet separated). Render them as a ul for now and we’ll deal with the styling.

Attachments

In order to simplify the UI, attachments are now hidden behind the paperclip icon. paperclip Once you click on the icon, the existing attachment functionality is available within a lightbox.

Existing timer

Within the current jobsworth you are able to start and stop a timer for one task. This persists server-side, so it continues as you move between tasks. It also displays a panel at the top of the screen next to the jobsworth logo. This new functionality is preserved without change with the new pin icon. The only difference is that the timer is started with the time already elapsed on the new timer.

Workflow example

  • User visits a task page
  • New timer automatically starts
  • User clicks on pin icon
  • Timer at top of the page starts, with the new timer’s elapsed time as base

Implementation