This week in our OSD600 course we needed to get involve with Bugzilla. Bugzilla is a web based Bug-Tracking system.

Firstly, I created an account for myself. The process is straight forward. I went to the Mozilla’s Bugzilla website and created a new account by clicking the “Log In” link on the page. Afterward I confirmed the registration and that is all you need to do.

Then I searched for bugs related to my processing.js project. I  found quite a few bugs related to the canvas tag. I finally decided to CC myself on three bug:

1. Bug 402690 – Canvas repaints slowly when scaled
2. Bug 501677 – Drawing lines in big Canvas don’t work always
3. Bug 421865 – Zero width <canvas> becomes 300pixel width wrongly

To CC yourself to the bug the only thing that need to be done is clicking in the Commit button at the end of the Bug’s page.

Another thing we needed  to do is to watch a few users. I decided to watch two users that where included in two of the three bugs I CC myself gavin.sharp and vladimir (these are the username of their respective email accounts). To do so just click in the Preferences link on the top of the page, the click in Email Preferences and then add the users emails at the bottom of the page.

I also added the following bugs to my wiki page:

1. Bug 402690 – Canvas repaints slowly when scaled
2. Bug 501677 – Drawing lines in big Canvas don’t work always
3. Bug 421865 – Zero width <canvas> becomes 300pixel width wrongly
4. Bug 408372 – canvas animation is jerky on Firefox 3 beta 1, Linux x86_64

Setting up Git/GitHub

I needed to setup Git and GitHub for my Processing.js project. Luckily, I found a blog from one of the students on my class that explains how to do it:

http://annasob.wordpress.com/2009/10/05/setting-up-gitgithub-on-windows/

Following the instruction I created and configured the accounts.

If you need more help creating the ssh key you can check the following link:

http://help.github.com/msysgit-key-setup/

Processing.js is an open source programming language. It is mainly use by students, artists, and designers who want to produce images and animations.

The limitation of original project (Processing) is that it needs Java in order to run. With the port of Processing to JavaScript all that is needed is a browser. Processing.js runs in Firefox, Safari, Opera, Chrome and will also work with Internet Explorer, using Explorer Canvas.

Main links to the Processing.js project:

Main Page: http://processingjs.org/

Mozilla Wiki: https://wiki.mozilla.org/Education/Projects/ProcessingForTheWeb

Original Processing project: http://processing.org/

Tasks to be done: https://wiki.mozilla.org/Education/Projects/ProcessingForTheWeb/Tasks

Main Source code location: http://github.com/jeresig/processing-js/tree/master

If you want to track the status of my work you can do it in this post and at my wiki page.

Release Schedule:

• Release 0.1 (October 19, 2009)
• Release 0.2 (November 16, 2009)
• Release 0.3 (December 7, 2009)

The above schedule are the official dates to the main releases, but I am planning to follow Eric S. Raymond’s advice “Release Early, Release Often”

I still need to decided in which task I will be working in. I am planning to take an easy one first to get a feeling of what I can accomplish. After that I will increase the difficulty of the task I will chose later on.

To accomplish all this work I will need to learn lot of JavaScript and css. Also I will need to get familiar with the Git revision control software. I can see lot of reading on the web and books. Also Google will be useful to look for answers, and if all this fails I will make use of the tools that we had learn about in the open source subject (OSD600) like: IRC, Blogs, Wikis, and the help of my colleagues. I am also looking forward to be presented to the Al MacDonald who is providing advice and support to the project.

Firstly, I needed to decide which platform to use. I had two choices either Windows or Linux. I read the prerequisites for Windows and Linux and decided that Linux was the best choice since the Windows steps required a lot of time and effort. I have a Virtual Machine with Ubuntu but I thought it would be too slow. Then I thought to install Linux in a different partition but remembered of a cool application that I wanted to try long time ago: Wubi.

Wubi allows me to install Linux without modifying my partitions. This feature was what I was looking for (I do not wanted to be messing around with the partitions now that I am so busy). If you want to know how it works, go to this link.

I installed Wubi restarted the pc and then installed Ubuntu. The installation was straightforward. Once done I went to the Firefox’s build instruction and did a quick scan of the page. I decided to use the “For the impatient” since that is what I am. I started to install the build tools without any problem and went to check the status of the building of Firefox on Linux here. Of course, it was in fire (just my luck). I decided to postpone it to the next day.

The next day I check the status of the building and everything was ok. I downloaded the code using Mercurial created the mozconfig file and started the building of Firefox. It took 14 minutes the building. It really surprised me how fast the whole process took and let me wondering how much time it would be in a Virtual Machine competing for resources with Windows. If I have time I will do it and post the results in another blog.

Here is the result of all the work:

I saw the demo that is posted at the potential projects in the OSD600 web site and it was jaw dropping. I could not resist and went to the Processing website and downloaded Processing to my PC. The .zip file in Windows is around 64 MB once extracted is 174 MB.

This is how Processing.js looks like.

I watched some examples and try to go through the code for the examples. I could not resist I did a small program to get a taste of how easy or hard is to work with Processing. It turned out that is really easy to work with Processing. In less than 10 minutes, I was able to do a small program.

This is the result of my small program.

And here the code I wrote:

size(200, 200);

float[] gradientValues = new float[width];

for (int i = 0; i < width; i++) {

gradientValues[i] = abs(i);

}

for (int i = 0; i < width; i++) {

stroke(gradientValues[i]);

line(i, 0, i, height/2);

}

for (int i = 0; i < width; i++) {

stroke(gradientValues[width - i - 1]);

line(i, height/2, i, height);

}

If you are interested in using Processing you can download it and play with it. You can find the reference for Processing here.

Since I want to work in Processing.js I went to their website and downloaded the source code to my PC. I created the same example this time with Processing.js. I did not need to change a bit of my code and worked as a charm. Here is the result.

And here the code:

<html>
<head>
<script src=”../../processing.js”></script>
<script src=”../init.js”></script>
</head>
<body>
<script type=”application/processing”>
size(200, 200);

float[] gradientValues = new float[width];
for (int i = 0; i < width; i++) {
gradientValues[i] = abs(i);
}

for (int i = 0; i < width; i++) {
stroke(gradientValues[i]);
line(i, 0, i, height/2);
}

for (int i = 0; i < width; i++) {
stroke(gradientValues[width - i - 1]);
line(i, height/2, i, height);
}
</script>
<canvas width=”200″ height=”200″></canvas>
</body>
</html>

I am looking forward to help to extend the source code of Processing.js.

I went to the Mozilla Developer Center (MDC) and created an account, added some basic information to it such as a link to this blog and my email address. I am planning to update the MDC page as soon as I decide in which project I will work in.

Secondly, I read about the Internet Relay Chat (IRC) to see how to use it since is my first time working with it. I think this tool will be useful to interact with other developers in real time.

Thirdly, I read the mailing list and decided to sign up to two mailing list: dev-apps-firefox and dev-builds.

I am planning to attend the Project wide weekly update call next Monday since I was not able to join any of the previous call because I had to attend classes at that time.

I will create the Mozilla Wiki and work in the first lab before the end of the week.

“The Cathedral and the Bazaar” reading was inspiring. Eric Raymond did a superb essay showing what the open source community can do and the different approach that can be taken to build an application.

I hope that during the next four month I can add something valuable to the open source community and keep doing it in the future.