This site is now just an archive over the rise and fall of Flash. The domain flashmagazine.com is available for sale
Login | Register
Setting up CVS in Adobe Flex

Setting up CVS in Adobe Flex

This tutorial will show you how to get started using CVS (Concurrent Versions System) and how you use it. CVS is a great tool to backup your files, let others work on the same project and keep track of all versions of a file.

by Jens C. Brynildsen To read more about why you should use CVS, read here. If you wish to use Subversion, please refer to this tutorial. This tutorial will work for both Flex 2 and 3. Screen captures are done on OSX, but the procedure is identical for Windows (or Linux with FB3 Alpha as Adam correctly pointed out).

Getting started


CVS support is built right into Flex, so there's no additional software to download. You do however need a CVS server. If you do not want to manage the server yourself, try a free account at CVSDude (note: affiliate link) or read more here.

Start by opening the CVS perspective. Click on "Window" -> "Open perspective" -> "Other" -> "CVS Repository Exploring"

imageNote: the number of items listed may vary.

Click OK to close the dialogue. Flex will now switch to the new mode. To create a new project (a Repository), right click in the white space in the left panel called CVS Repositories and select"New" -> "Repository Location" from the popup menu.

image

Make sure you fill out all the required fields (Host, Repository path, User, Password and Connection type). If you signed up with CVSDude, they sent you an email with all the required details as part of the registration process. If you are connecting to a company server, ask the admin for the required details or if opted to set up your own server, you'll find the info you need on the web.

Switch to the "Flex Development" perspective (in the upper right corner).

If you want to start with a new project, make one by selecting File -> New -> MXML Application (or any desired option in this menu).

Right click the project you want to add and select Team -> Share Project. (you may be asked to select between CVS and SVN, choose CVS.)

Next, select to use the repository location you just added.

image

Click next to proceed. You can think of the repository as just a folder on a server. You can add as many Flex projects you want to a CVS repository, but may wish to plan how these files are organized since the initial commit will decide your future structure (The folder you commit initially will become your "root" folder). Keep this in mind when you create a proper repository. If you use CVSDude, you can easily delete repositories so lets forget about this for now and just continue.

Now select where to put the files. I first opted to use the project name option. When I did this, I got an error from the CVS server. I then chose the third option ("Use an existing module"). This refreshed the list of folders on the server and I could see that a folder with my project name was indeed created and that I could now select it. Something similar happens on this first commit in both Flex 2 and 3.

image

Next, you add the existing files. Eclipse suggests that you add all files. In this dialogue, you may right click and exclude files from CVS temporarily or completely (see cvsignore further down this article). Click Finish to close this dialogue. If the option to open the COMMIT dialogue was checked, Eclipse will do this next. If this does not happen automatically, right click your project folder and select Team -> Commit.

Eclipse will now ask you about certain hidden files (.flexProperties .actionScriptProperties .js). These are all incorrectly identified as "binary" files. These hidden XML files contain project settings an other stuff required by Flex Builder.

image

Toggle them to "ASCII Text" and click Next. The final dialogue you will see is one that you will see a lot.

image

This is the COMMIT files dialoge that you'll see every time you send files to the CVS server. Type in a suitable message such as "Initial commit of existing files" and click "Finish" to send the files off. Notice that the folders controlled by CVS in your "Flex Navigator" now have something extra on each icon - a small symbol that indicates the status of each file. Next, we'll go through what the icons mean and how you use CVS in daily life.

Working with CVS in Eclipse


We now have a working repository, so lets look closer at how to work with CVS in Flex. Start by creating a new ActionScript class File -> New -> ActionScript Class. Name the class "SomeClass". Did you notice that there is now a ">"-character in front of the new file?

image

The same character is also shown on the folder containing the file. This is how CVS tells you that something has changed. If you open a file, type a space and save it, CVS will mark it as changed. This makes it super easy to see any changes not sent to the CVS server.

Sending files to the server


Let's add the newly created file to CVS. Right click "SomeClass.as" an select Team -> Add to Version Control. Flex displays a dialogue that disappears as soon as the CVS server replies. The icon is changed, but the ">"-character remains to indicate that the file is still not COMMIT'ed to CVS (uploaded). To do this, right click the file again and select Team -> Commit...

image

Type an appropriate message to describe the file and click "Finish" to send the file to the server. The ">"-character is now gone, so all files have been commit'ed to the server.

If there are files you want CVS to ignore, you specify this by clicking the file and selecting Team -> Add to .cvsignore. This will create a text file that simply contains names of files that should not be managed with CVS. You will have to add this file as well and commit it to the server for others to get this change as well.

To remove a file from CVS, just right click it, select "Delete" and then select Team -> Commit to send this change to the server. If you accidentally deleted a file, you can bring it back using Team -> Restore from Repository.

Retrieving a former version of a file


One of the nice things about code versioning is that you can easily look through old versions of a file. Imagine that you solve a problem and later opt for a different solution. If you want to go back to the old solution, CVS will hold all your code and it's easy to switch back.

First we must ensure that we have a file that exists in several versions. For simplicity, we'll just change an existing file and commit it. Open "SomeClass.as" and add a comment in the class constructor. Commit this file (Team -> Commit). Now the file has two versions. Add more versions if you wish by changing the file and committing each version.

Now, let's have a look at the history of this file. Right click "SomeClass.as" and select Team -> Show History. A new panel will open (note: you can drag panels to where you like them) and display the full history for this file.

image

To see any of the versions, just double click it. To compare two files, select the two files from the list in the History panel and right-click to select "Compare with each other". A new panel will display that easily let you see the differences.

image

Large files with many changes will show small rectangles in the margin along the scrollbar to show where the two files differ. This view is similar to the one you use merge files manually. Merging and branching is outside scope of this tutorial, but you can find more via Google.

To bring back a former version, right click the file, select "Replace With -> History..." and browse to the correct version. Eclipse will then create a new version based on the old one. You never delete files from CVS. It's a complete record of how a project developed, who committed what and so on.

Don't forget to UPDATE!


The most common mistake when you start using CVS with other programmers is that you just start the day coding and then run into problems when you COMMIT the changes. While mostly cool, there are some things CVS does not like and the most important one of these is that you always work on a current version of a file. To prevent this:

Always start your day by right-clicking the project folder and select Team -> UPDATE

This will download any changed files. The more often there are changes to the repository, the more often you'll need to Update. Updating will not overwrite your changed files but it will alert you to possible conflicts.

Importing an existing project


To finish off this tutorial, we need to show you how to connect to an existing project. This will allow you to get all the latest files in a project no matter where you are.

Imagine it's the christmas holidays and you left your computer at home intentionally. A client calls you up while you are at your parents. It's the "classic" crisis where the client insists that you HAVE TO fix a URL since they updated it without notifying you just before the holidays started. You could of cause ask the client to go somewhere unpleasant, but it's the season to be jolly and you know it's a quick fix if you only had the files...

  • Borrow your dad's dated computer
  • Download and install the trial version of Flex 3
  • Import the project from SVN
  • Make the change and commit
  • Send the updated file to the customer

That's all. It's really that simple.

To do this, right click the white space in the Flex Navigator panel. Select Import and open "CVS" to find "Projects from CVS".

image

Go through the steps as before by creating a new repository location. This will connect you to the CVS server. Select the folder to Checkout from the CVS server.

image

Click Finish to download the latest revision of each file and you are ready to serve your favorite customer.

That's where this tutorial ends. We've been through setup and the most common tasks like committing, comparing and replacing files. There are so many other things you can do with CVS, but that's beyond the scope of this tutorial.

 

About Jens C Brynildsen

Jens has been working with Flash since version 3 came out. Since then, he's been an active member of the Flash community. He's created more than a hundred Flash games (thus the name of his blog) but he also creates web/standalone applications, does workshops and other consulting. He loves playing with new technology and he is convinced that the moment you stop learning you die (creatively speaking). Jens is also the Editor of this website.

Get new stories first

Click to follow us on Twitter!

 

Comments

No comments for this page.

Submit a comment

Only registered members can comment. Click here to login or here to register