Tag Archives: javascript

Popcorn-js Workshop Poster

This workshop is open to anyone who is interested in learning more about Popcorn.js and/or contributing to open source in general.

To learn more about Popcorn.js, see:
Official website: Mozilla Labs: Mozilla Popcorn
Interactive video editor using Popcorn.js: Popcorn Maker


Tetris in CoffeeScript

From July 26th through Aug 9th, the team conributed to a Tetris clone written in CoffeeScript: coffee-canvas-tetris

CoffeeScript is unique in that it is compiled into Javascript. Although the syntax is a bit unusual, I found it to be much more concise and easier to read than Javascript. Here is an example of something I contributed to the project:

$(canvas).click -> pause_or_unpause()

The compiled JS looks like this:

$(canvas).click(function() {
  return pause_or_unpause();

So although you’re probably confused about the arrow and dollar sign, I’m sure you can see how much nicer it is to read in CoffeeScript. If you take a look at the project source code, you’ll see just how much of a difference it makes. CoffeeScript was inspired by Ruby and Python, which is why the syntax is so concise.

Beyond just making the code look pretty, CoffeeScript offers a lot of built-in functionality that Javascript lacks. For one, it allows you to define classes, rather than forcing you to use prototypical inheritance. It also offers comprehensions, which are loops but treated as expressions– meaning they can be assigned like a variable.

The most difficult part of this project was setting up the development environment. Just about everyone on the team had difficulties with the dependencies required to run this project. The easiest way (in linux) turned out to be to just download the source and run “sudo bin/cake install” from within the downloaded folder.

Canvasteroids: Our First Project!

At our second meeting on June 7th, we picked our first project: Canvasteroids

Canvasteroids is a Javascript game framework created by David Wilhelm. It includes one example game: Asteroids!

We chose to work on this project because we felt we could make some significant improvements to the example game (plus we needed something easy to get our feet wet). In one week, we added a life and score counter, a hyperspace button, “how to play” guide, thruster animation, and a few other useful things (see all our contributions).

After the week was up, we submitted our changes to the project’s author (via a GitHub pull-request). He merged them in immediately and thanked us, and we got to pat ourselves on the back 🙂

No one on the team had worked on a Javascript game before this project, yet we made a significant contribution to Canvasteroids.

Week one: successful!

[Update: David Wilhem’s made a blog post about our contributions: Updates to Asteroids]