Project Flow & Tracker "Paris" - Part 3: Towards integration with Open Atrium via our very own branded Feature Server!

So today finally Project Flow & Tracker meets Open Atrium, and does so in style. My friends at Development Seed just told me about the new availability of the feature server code (w00t! out just a couple of days right here: http://code.developmentseed.org/featureserver/dashboard), not to mention a spanking new theme, singular,

"a minimal theme that can be rebranded quickly and simply using background images a la Twitter. The theme comes with several prepackaged backgrounds and site administrators are encouraged to upload their own."

also out just a couple of days, and which can be found at http://code.developmentseed.org/singular/dashboard . Singular and depends on the base theme Tao:  http://code.developmentseed.org/singular/dashboard (also fresh meat!).

So we will be diving right in. Here are the steps we will be taking, so hang on to your mice, it's going to be a fun ride:

Here we go...

First steps with Open Atrium itself (ok, what is it?):

Installing

In Part I of this series we describe installation of Open Atrium from the current tarball, which is definitely the most straightforward way of going. However... we are going to be developing Project Flow and Tracker on top of Open Atrium, so no matter how we plan on setting up our ultimate environment, we definitely want to check out the project from its home on github. That way we can update as new releases are tagged. At this point, I opted to initialize Project Flow & Tracker "Paris" with an "anonymous clone" from the Open Atrium Git repository.

First of all I needed to install Git on my Ubuntu dev box:

$ sudo apt-get update
$ sudo apt-get install git

Then, following the suggestions in the GitHub Guides (also for me, having used SVN for many years, the Git - SVN Crash Course on the Git site was particularly useful), I did the following to get Open Atrium's beta1 tag up and running in the subdirectory www:

$ git clone git://github.com/developmentseed/Atrium.git www
Initialized empty Git repository in /home/victorkane/Work/AWebFactory/projects/PFT/Paris/www/.git/
remote: Counting objects: 6695, done.
remote: Compressing objects: 100% (4748/4748), done.
remote: Total 6695 (delta 2033), reused 5504 (delta 1262)
Receiving objects: 100% (6695/6695), 7.42 MiB | 242 KiB/s, done.
Resolving deltas: 100% (2033/2033), done.
Checking out files: 100% (2855/2855), done.
$

From this point on, I created a virtual host and a database and installed following the same procedure as for the downloaded tarball, choosing the "Atrium by Development Seed" installation profile, choosing English (although there were Spanish and Arabic language alternative!!!), specifying Project Flow & Tracker as the site name, entering details and finally being congratulated upon having completed the installation:

Atrium installation complete

First login as admin

Clicking on the "your new site" link, or logging in for the first time as admin, ushers you into Atrium world, where you are urged to get started by creating a group:

Getting started with Open Atrium

Creating a group

I clicked on the Create group button and entered a Title (PFT dev), Description and Path value (pft-dev) for the group and indicated that it was a Private group

Creating an initial open atrium group and assigning it a path and access type

and clicked the Save button. I was taken to my group page:

New Open Atrium group

Now, Project Flow & Tracker needs more than just the Blog, Documents and Dashboard icons. So I clicked on the Settings button, which by default allowed me to edit the group title, description, path value and access type (private or public), and then clicked on the Features tab. I just knew it was going to let me enable and disable group action icons! Not only that, but also whether the default page for the group's space (associated with its path value) should be the dashboard, the documents (hierarchical books) or any of the enabled features! Plus the possibility of uploading a group logo and changing the color of the group page:

Customizing the Open Atrium group space

So I enabled all the features (which would be needed by Project Flow & Tracker). Here's what the PFT dev section looks like customized with my favorite #cc0000 red and with a couple of bells and whistles (all of which I set to private, even though some can be public, like you can have public docs and private case tracker, etc.), and I got my twit shout on:

Starting to customize the dev group in Open Atrium

But what about adding members, where do I have to go for that. Well, then I was in for a really sweet surprise! Didn't have to go anywhere, the Members button was right there next to the Settings button; and not only that, but you can invite people to your group who aren't even registered on the site! So the first thing I did was to invite myself: I clicked on the Members button, and then on the Add new account tab. I filled in the details, noticing that the new user would be automatically added to the PFT group!

Add new account to existing Open Atrium group

After hitting the Add button, a nifty pop up and dismissable status box appears telling you what's up, really smooth way of theming Drupal status, warning and error messges:

Open Atrium Status boxes

I'm really excited because a lot of people have used Project Flow & Tracker and I just know with Open Atrium I'm going to be able to build a really sweet user interface with a lot of the usability problems solved, some out of the box, like with this group invite: and each group can have several projects, very cool. And I just realized that the whole shebang is Project Flow & Tracker, and that the features will not be PFT itself, but rather different methodological approaches: I can have a generic agile feature and then disable case tracker, I can have a Scrum plugin, and a WIP Kanban plugin, or Scrum and Kanban, things are already starting to take shape as I prototype!

So I am going to do my first login as victorkane the manager here, and take charge, invite a couple more people, get the project and the project docs going...

Creating a project and some project docs

So victorkane logs in for the first time after receiving the mail in the usual Drupal way, and is taken to his own dashboard (which will show all personal activity on the site). And clicking on the My groups button, the options pop down from above with a handy button to easily get to each section (at this point just the PFT dev group is listed):

Invited group manager logs into Open Atrium for the first time

Or you can just click on the Groups icon for a more detailed listing of your groups. Clicking on the Members icon gives this manager user administration functionality (user directory, Drupal all users, the ability to manage users roles and email and to add users to the site) and the Home icon takes you back to the activity dashboard. Very sweet. I'm not going to go into all the nifty Open Atrium details, you are going to want to download it and play with it yourself (for example, the ability to customize your own profile layout: what is this, MySpace?).

So getting down to business I click on the PFT dev group link, and get to my Dashboard view (for that is the default starting page for the group).

Initial Open Atrium group manager dashboard

So I won't bore you with the details, I clicked on the Case Tracker icon, created a Project and a couple of cases, clicked on the Documents icon and wrote up some docs, just to get things moving. In creating the project I did notice some nice usability touches though; notice below the more inobtrusive format type drop down box and popup Formatting help, and above all the notification options:

Creating a project in Open Atrium

And there was similiar functionality with the cases I added to the project, and in creating a group document. In regard to the PFT Architecture Document I wanted to start, one thing I am going to have to do is associate somehow group documents with a specific Project, so each project can have its own docs. For the present I stuck in a keyword tag which'll do me for now. Another thing I will need to do is integrate user story tasks with the calendar, and maybe get some additional calendar views (Gantt?)... OK, all in good time. Anyway, dashboard is starting to get populated:

Open Atrium Group Dashboard

Inviting some more team members

I needed to get our designer Laura Graph on board, as well as Fred Testy, our all around dev make it happen guy here at AWebFactory. So as a manager I intuitively clicked on Members... but could only see Faces and List. Yeah, I should be able to add members right here. I'm the manager, aren't I? Yeah, I guess a user invited to a Group as manager should automatically be given _group_ manager standing also (actually, I visited GitHub and posted a feature request on this one :) ). The saving factor, though, was that I was able to get Laura and Fred on board by clicking on Home, then clicking on the Members Icon and a form opened up on the right for managing users (automatically added to PFT dev since that is my only group).

Working together

Everyone logged in and started kicking up a storm. We leave them to their own devices now and explore the exciting new... feature server!

Our bare bones "Feature Machine" morphs into the stylishly themed and branded AWebFactory Feature Server!

In the last part of this series of articles, we had our bare-bones "feature machine" going, which enabled us to create a feature and export it to a packaged tarball even though it was nothing more than off-the-shelf Drupal plus basically the cck, views, features, diff and context modules. Now we want more: we want our very own feature server just by adding it in as a feature! And now the code is out!

Feature Server

Plan A is to load up the feature server as a feature in our bare-bones Drupal based feature machine. If that doesn't work, we'll do another install of Open Atrium and stick it there (that's Plan B).

So the Dev Seed code page lists the following dependencies:

  • CCK
  • Context
  • Features
  • Filefield
  • Views

OK, so all we are missing is Filefield, apparently. Let's get that in:

$ drush dl filefield
Project filefield (6.x-3.1) downloaded to [success]
/home/victorkane/Work/AWebFactory/projects/FeaturesMachine/features/sites/all/modules/.
$ drush enable filefield
The following modules will be enabled: filefield
Do you really want to continue? (y/n): y
FileField was enabled successfully. [ok]
$

The thing is, I need to reorganize my directories a la Open Atrium, and I am using bzr here for the Feature Machine, or Feature Server now, so some "mkdir", "bzr add" and "bzr mv" later we got the following directory tree for ./sites/all/module:

$ tree -L 2
.
|-- contrib
| |-- admin_menu
| |-- cck
| |-- context
| |-- diff
| |-- features
| |-- filefield
| `-- views
`-- features
`-- pft_lite

After clearing the cache and making sure Drupal could feel all its arms and legs, I unpacked the downloaded Feature Server package into ./sites/all/modules/features/ and went to Administer > Site building > Features and saw the feature server feature listed as a feature:

Development Seed feature server listed as a feature

So I selected the Feature Server feature checkbox and clicked on Save Settings. After a very short trundle, it looked like it was installed. I clicked on the View action link and got the inside dope:

Dev seed Feature server details

So, there are two content types (project and release), some views, and there's a menu path: ./fserver. Hitting it I am told, of course, that I have no projects :)

We stick our feature onto our Feature Server

So I go to Create content > Project ( ./node/add/fserver-project) to create the Project Flow & Tracker project:

Creating a dev seed feature server project

After saving the project, I was told how this feature server could be enabled for updates for this project:

A dev seed feature server project has been created

So shortly you will be able to update the feature from a server (right now, as you can see from the url, for the time being the feature server is on my intranet dev box).

Now I can create the first release for the project, enabling me to upload the tarball we exported as a feature last time! I go to Create content > Release:

Create release for dev seed feature server project

Hitting save:

Release created

Now the project is populated:

A project with its first release on a dev seed feature server

So we sure have a convenient place to hang features which can be downloaded, untarred and enabled on anyone's site complying with the dependencies.

Time to commit our work to bzr!

$ drush cache clear
Cache cleared.
$ drush sql dump > sites/all/backup/db/features.sql
$ bzr add
adding .directory
adding sites/default/files/fserver
adding sites/all/modules/features/fserver
adding sites/default/files/fserver/pft_lite-6.x-1.0-alpha1.tar_.gz
adding sites/all/modules/features/fserver/fserver.css
adding sites/all/modules/features/fserver/fserver.defaults.inc
....
adding sites/all/modules/features/fserver/views/fserver_plugin_style_updatexml.inc
adding sites/all/modules/features/fserver/views/theme.inc
$ bzr commit -m "Feature machine is now feature server hosting pft-lite feature"
...
Committed revision 3
$ bzr log
------------------------------------------------------------
revno: 3
committer: Victor Kane <victorkane@gmail.com>
branch nick: features
timestamp: Sat 2009-08-15 13:31:42 -0300
message:
Feature machine is now feature server hosting pft-lite feature
------------------------------------------------------------
revno: 2
committer: Victor Kane <victorkane@gmail.com>
branch nick: features
timestamp: Sun 2009-08-09 07:01:28 -0300
message:
PFT lite initial setup
------------------------------------------------------------
revno: 1
committer: Victor Kane <victorkane@gmail.com>
branch nick: features
timestamp: Sat 2009-08-08 16:59:33 -0300
message:
initial minimum install of features machine with context, features and other primary dependencies

You've come a long way, baby!


Theming

So the Feature Machine is now a fully fledged Feature Server! Does look a bit stark though. Here's where the Singular theme we were talking about earlier comes in! On the Singular project page it says Singular requires the Tao theme "to function properly".  OK, I can do that. I download and unpack both in a ./sites/all/themes directory. Added to bzr for good measure.

The singular.info file shows that it is indeed a Tao sub-theme:

; $Id$
name = "Singular"
description = "Simple theme based on tao."
version = "6.x-1.2"
core = "6.x"
engine = "phptemplate"
base theme = "tao"

So it will benefit from the Tao browser reset and other improvements (see project page).

I go to Administer > Site configuration > Administration theme and make Garland the administration theme, as I always do before dealing with the unkown. Then to Administer > Site building > Themes and enable Tao and Singular, and set Singular as the default theme.

Swimmingly!

Development Seed Singular theme off-the-shelf

Very nice. So what can you configure? Administer > Site building > Themes > Singular > Configure.

Wow! Among other options, right there in configuration you can choose between fixed and fluid widths, and between the various styles (Book, City, Clouds, Rocks, Sea (default above) and... Custom!

Branding

After experimenting with the bundled styles (very nice, transparencies, the height of twittitude!)  I clicked on Custom, which is where the real fun begins:

Dev Seed Singular theme configuration page

A very nice detail of course is the use of the farbtastic color wheel to choose the background color. It appears when you click on the Background color textfield.

So I just took the image I use for my twitter account (http://twitter.com/victorkane) and cropped the right hand side off so it was 950 wide (the bundled background images are all of different sizes, but around 600 px in height; of course it can be tiled) (should have been a bit wider, but hey...). And uploaded it in the above theme configuration page leaving a white background color. After branding the site name also, after just a few minutes we have the AWebFactory Feature Machine feature server:

Branded Features Server

OK, this has been a real picture book post today, but I really wanted to share this.

Roadmap

In the next part of this series, we will be moving forward and try out various ways of integrating Project Flow and Tracker with Open Atrium, and from that point on PFT and/or its attendant plugins (Scrum, Kanban, what have you) will be available on our feature server all through developoment and beyond, and once a beta version is reached we will publish on http://drupal.org as an install profile. We will be doing the following:

  • Importing Project Flow & Tracker as a feature into our Open Atrium based PFT site
  • First steps for integration of PFT feature into Open Atrium
  • Bringing back the full PFT feature set
  • Making PFT usable
  • Using PFT to develop PFT
  • Development environment

 

great

It great

Progres?

Hey Victor,

We're very interested in incorporating scrum and atrium in our corporate workflow, and are following your project on pft with great anticipation!

Is there any progress that's worth mentioning? Any field where we could join in your effort?

Thanks for your effort so far!

Regards,
Thijs

Would you believe, coming real soon?

Now that I am using PFT for PFT, there is at least a fighting chance!

Hang on for news!

Victor

Should I?

:)
Just picked up our atrium installation again today and wondered what the status was for PFT.

Don't want to rush you or anything, just eager to use it!

Sample version

Hi Victor -

Is the sample version of the site from drupalcon available anywhere for download while you're buttoning things up?

I'm concentrating all my time on new Project Flow & Tracker

But I will post it to a public repository as soon as I can... Contact me personally if you need it earlier.

git vs. svn

victor, nice writeup, thanks! is there any problem committing the code you checked out using git into a svn repository? i am interested in trying some of the devseed stuff but am reluctant as it's not available via normal drupal cvs, so i'm not sure if i can keep it up to date with drush in the same way, or commit it to my own repo. can git-managed code be checked into svn?

Interoperability between the DVCS and SVN will be the key!

Yes, as I understand it, it is possible. You should check out git-svn http://www.kernel.org/pub/software/scm/git/docs/git-svn.html.

There is a tutorial here you might find interesting: http://orestis.gr/blog/2008/08/23/git-svn-tutorial/

git-svn

thanks, i'll have to try it... git-svn as i understand it is different as it allows git to be used as a front-end for a subversion repository, whereas what i'm wanting is to check out and update something from git but then use my normal svn tools for revision control. i guess the fact that git-svn exists shows that there's no conflict though. next question will be whether drush will update git-managed code like it does for cvs.

I'm mostly using bazaar now

And I love the way it handles removed files, it doesn't get all confused like SVN. So I don't need drush to know anything about my version control system.

One little thing I do though (just me) check out Drupal with CVS for easy update, using:

$ drush dl drupal-5.19 --package-handler=cvs

Then tell bazaar to ignore the CVS dirs...

Hi Victor! Great write up as

Hi Victor! Great write up as always! I've been looking at Open Atrium too. (Literally stared at it... it looks sooo beautiful :)

The company I joined recently doesn't have a ticketing system yet, which I consider essential for not just the development department but for the entire organization! I think Open Atrium will do great for 90% of the tasks, but the one thing I'm not sure of is Version Control.

In your "Leveraging Drupal" book, you used Trac and SVN which is really simple, when you make a commit in SVN and include the ticket #, it will automatically update the ticket in Trac. Can the same be achieved using Open Atrium?

Not off the shelf, I believe

Will look at that, good point.

Thanks for your comments!

Victor