So if you draw something into the canvas, you don’t get to attach event listeners on the objects you create within the canvas, just on the canvas itself. This means that you have to build your own event system. This isn’t that difficult if you organize your entities you’re drawing and rely on isPointInPath to do the searching for you.

/**
 * Planet.
 *
 * A planet entity to draw on a canvas.
 */
Planet = function(image, opt_x, opt_y) {
  this.image_ = image;
  this.x_ = opt_x || 0;
  this.y_ = opt_y || 0;
};
/**
 * Draw the planet.
 */
Planet.prototype.draw = function(ctx) {
  ctx.drawImage(this.image_, this.x_, this.y_);
};
/**
 * Draw the hit detection path.
 */
Planet.prototype.drawDetectionPath = function(ctx) {
  ctx.beginPath();
  var radius = this.image_.width / 2;
  ctx.arc(this.x_+radius, this.y_+radius, radius, 0, Math.PI*2, true);
  ctx.closePath();
};

/**
 * Entities Manager.
 *
 * Manage a set of entities to draw them to the screen and to
 * detect mouse hits.
 */
EntitiesManager = function(entities, rendererCtx, detectionCtx) {
  this.entities_ = entities;
  this.rendererCtx_ = rendererCtx;
  this.detectionCtx_ = detectionCtx;
};
EntitiesManager.prototype.draw = function() {
  this.rendererCtx_.clearRect(0, 0, this.rendererCtx_.canvas.width,
                              this.rendererCtx_.canvas.height);
  for (var i = 0; i < this.entities_.length; i++) {
    this.entities_[i].draw(this.rendererCtx_);
  }
};
EntitiesManager.prototype.findEntity = function(x, y) {
  // Clear out the detection canvas.
  this.detectionCtx_.clearRect(0, 0, this.detectionCtx_.canvas.width,
                               this.detectionCtx_.canvas.height);
  // Loop backwards though each entity. After drawing it onto
  // the detection canvas, see if X,Y coordinates from the mouse are
  // within the path drawn onto the canvas.
  for (var i = this.entities_.length-1; i >= 0; i--) {
    var entity = this.entities_[i];
    entity.drawDetectionPath(this.detectionCtx_);
    if (this.detectionCtx_.isPointInPath(x, y)) {
      return entity;
    }
  }
  return null;
};

canvasElement.addEventListener('click', function(evt) {
  var rect = renderer.getBoundingClientRect();
  var x = evt.clientX - rect.left;
  var y = evt.clientY - rect.top;

  var entity = entitiesManager.findEntity(x, y);
  // ...
});

At the time of this post, here’s two version of Octave to choose from: octave (version 3.2.4) and octave-devel (version 3.4.3). For my money, I like octave-devel. In my brief testing with the two, the biggest difference for me was that the graphs plotted in octave-devel looked more like their OS counterparts. With octave, I found the scaling of elements on the graph to be different sizes and that bugged me.

To install Octave, run the following from the terminal:

sudo port install octave-devel +gcc45

And then wait…as there are a lot of things that need being compiled.

I added the gcc45 variant because one of the dependencies, atlas, needs gcc45 to compile. This ensures that both of those are in sync.

Feel free to add other variants if you like, like X11 support or offline documentation. To get a full list, run:

port variants octave-devel

>> % Create some sample data
>> x = [-4 -2 0 2 4 6 8];
>> y = x .^ 2;
>>
>> % Plot X in X11.
>> setenv("GNUTERM", "x11");
>> plot(x, y);
>>
>> % Plot X in AquaTerm.
>> setenv("GNUTERM", "aqua");
>> plot(x, y);

In order for variable renaming to work, you have to behave by closure’s rules. One rule closure has is: Let me do the optimization. One of the main reasons for this is that some shortcuts can make it hard to determine your intent.

One shortcut I like to use is to create alias to JavaScript objects that have long names or long namespaces.

(function() {
  var alias = a.very.long.namespace;
  /** @constructor */
  alias.NewClass = function() {};
})();

Now, to you are I, we can easily tell that I intend to use this self-calling anonymous function as a closure to store my alias; however, how can a compiler know that this was my intent.

Intent is a key concept when you work with the advanced compilation. In the above example, Closure knows that a.very.long.namespace.NewClass is even a class because of the constructor annotation. The way to tell Closure that you intend to make aliases is by using the goog.scope function¹.

goog.require('goog.dom');
goog.require('goog.events');
goog.require('goog.events.EventType');

goog.scope(function() {
  var dom = goog.dom;
  var events = goog.events;
  var EventType = goog.events.EventType;

  var elem = dom.getElement('myElement');
  events.addEventListener(elem, EventType.CLICK, function() {
    alert('I was clicked');
  });
});

Now that I have that done, I get to play around to see what all the buzz is about.

Single file scripts are fairly easy to manage.  If you notice a new version of your script is released, then simply replace your file with the new version.  Likewise, it’s very easy to remove the script if you want to just try it out.  However, scripts spanning multiple files are much harder to manage.  For one, the script’s files get merged in with all of your other script files.

To help know what files are apart of what plugin, I manage my vim scripts in git.  Another way to keep track of things is to use a vimball.

What Are Vimballs?

Vimballs are essential vim script installers.  Each vimball contains all of the files that are needed for the script to work.  Not only that, but it also has a hook for you to easily uninstall the script as well.

Tail Bundle is a script that mimics tail -f for vim.  The downloadable artifact is a vba file.  That file is the vimball.  To actually install the file:

1. vim tail-03.vba
2. :so %
3. :q

So what that all means is that you’re opening the vimball in vim.  From there, you’re executing the instructions that are in the file.  Lastly, you’re just quitting.  You see, a vimball is a vim script in of itself.  So executing it writes everything out to where it’s supposed to go.

While the tail bundle makes use of the vimball, not every script does.  Luckily, it’s easy to make vimballs out of most script downloads.

Converting Scripts to a Vimball

In order to make a vimball, it’s quite easy. List out all of the files you want to include in your bundle, relative to where your current directory is.  For instance:

doc/myawesomeplugin.txt
plugin/myawesomeplugin.vim
syntax/myawesomeplugin.vim

Next thing, while in visual mode, type ggVG:MkVimball myawesomeplugin. The ggVG is a akin to doing a “select all”.

This will create your install file named myawesomeplugin.vba.  Now just install it like any other vimball.

You don’t have to just make vimballs for your own scripts.  I love xpt, but there are so many files to manage.  Well, you can make the vimball script even when the author does not.

Open a new buffer and use the command :r! find . -type f.  This will find all of the files and print them out into the buffer.  If you want to do any cleanup, like remove blank lines and removing the extra ./ before each entry, feel free to do so.  Now that you easily got a list of all the files, create the vimball from that.

Now you have records of what went in with the script and you have a super easy way of uninstalling the script too.  Speaking of which…

Removing Scripts

To remove a vimball script, simply execute :RmVimball myawesomeplugin.  That will go through and delete all files created by the plugin.

After figuring this out, I now know that when I want to use and install vim scripts, I’m going to do so via vimballs.  It’s too easy not to, and the benefit of having a way to back-out scripts is just too tempting.

Say I want a playlist of cover songs.  What I will do is add a comment of “&cover” directly in the track info.

The reason I chose to use an & in front of the tag is so two fold.  One, so if you have a comment talking about the album cover, it wouldn’t get added to the list.  If you don’t like the &, leave it our or use your own.

Once I have done that to all of my songs, I create a new playlist with the following settings:

And now I have my playlist.  The benefit to this is that if I move this song to another computer, say my work desktop, I can easily re-create the playlist.

One last thing.  If you find yourself using this, or wanting to use this, a lot, check out Quick Tag

So what?

Well, you can use the global variable DATA to get the contents of what you wrote after the __END__ block. DATA is actually a File object to just that piece of text in your script.

How about a little sample to make things a little clearer?

#!/usr/bin/env ruby
%w(yaml pp).each { |dep| require dep }

obj = YAML::load(DATA)

pp obj

__END__
---
-
  name: Adam
  age: 28
  admin: true
-
  name: Maggie
  age: 28
  admin: false

So with this, I was able to embed a little bit of YAML directly into my script. I added the YAML after __END__. YAML::load will accept a File object, so I just passed it DATA and now I have a reconstituted array.

Maybe that’s not the most practical use of this information; however, Sinatra provides a really awesome use of this.  With Sinatra, you can create a whole web application that lives in one single, solitary ruby file.  Sinatra can use in-file templates.  In-file templates are added into the space after __END__ where each view file is annotated with @@view_name.

require 'rubygems'
require 'sinatra'

get '/' do
  haml :index
end

__END__

@@ layout
%html
  = yield

@@ index
%div.title Hello world!!!!!

Not bad for a useless trick!

Haml comes with a script, html2haml, which can take HTML with ERB and convert it nicely to haml. Seeing as I would have to run that command more than once, I have a little command snippet that I like to use to aid with the conversion.

$ find . -name '*erb' | \
xargs ruby -e 'ARGV.each { |i| puts "html2haml -r #{i} #{i.sub(/erb$/,"haml")}"}'

That will print out what the html2haml commands would be, it does *not* run the command. I do that step such that I can review what will be converted. If I like what’s going to be done, then I just run that command and pipe it into bash…like so

$ find . -name '*erb' | \
xargs ruby -e 'ARGV.each { |i| puts "html2haml -r #{i} #{i.sub(/erb$/,"haml")}"}' | \
bash

If you like it, it probably wouldn’t hurt storing that as a shell script somewhere :)

With multiple programmers, you can probably expect a versioning system, perhaps a centralized versioning system like SVN or Perforce. With that system, each programmer would make his/her changes and then would check in his/her changes into the repository. From there, the programmer’s peers would review the code.

What’s the problem with this system? The code is already checked in. The pressure is on the peers to ensure that the code is good, and it’s likely that this could slip through the cracks. I mean, those peers are working on getting 10 features complete themselves.

Enter Git

Well, I would argue that Git has a strong code review process built right in. This is due to the process of how distributed version control works.

Programmer A creates a fork of the master project. A makes his changes and commit his code; however, the code is committed to his local repository and not the master origin. This is because A does not have write access to that repository.

A has to contact programmer B, who has write access. A tells B that he should pull his code. Since B has to pull the code, this means that B has to review the code coming in.

It’s this workflow that promotes code review. Now that’s not to say that you can’t do code reviews in a centralized model, it just fits a little better in a distributed model

Ticgit takes a simplistic approach to issue tracking as Lighthouse has done. You can comment, add tags, manage the state of an issue, save views, and change to whom an issue is assigned. There is still more planned, like keeping track of milestones and syncing the tickets to Lighthouse.

As mentioned, there is a web interface to ticgit; however, it wasn’t my cup of tea. So I have started my own web interface, tiwatchtower. It’s still a little rough around the edges, but I would love to hear any thoughts.

Conclusion

So far, I like it and it’s exciting to see how git can be pushed. It’s great for keeping track of things that are on my mind without worrying about having to setup trac or having to use up a Lighthouse project. It’s simple, effective, and worth a look at.