Awesome breakpoints & gridbuilder UI

During the Acquia Engineering Week Hackathon on September 27, Gábor Hojtsy, Kevin O'Leary, Kevin Hankens and I chose to implement Kevin O'Leary's (@tkoleary) incredibly awesome gridbuilder UI prototype. See the interactive prototype.

The current Breakpoints module UI is a simple form-based UI. That's fine, but it's not stellar. It's not intuitive. That's where this new UI will try to make the difference: live previews, drag-and-drop, both breakpoints *and* the corresponding grid in a single, clearly laid out view.
Whenever you'd make a change in the "fancy" breakpoint and/or gridbuilder UI, the form version of the UI (which is still present, it's just hidden from view in a collapsed fieldset) is also updated. They are effectively different "views" of the same data.

• Before:
• After:
• The grid builder UI that unfortunately hasn't been merged into the above single page UI yet:
• A HTML+CSS prototype of the fully fledged breakpoint builder UI: http://drupalcode.org/project/gridbuilder.git/tree/refs/heads/fancyui:/p...

Implementation notes:

• gbp.module (better name needed) is the thing that ties the breakpoints and gridbuilder modules together. It does that through alter hooks.
• The breakpoints UI is powered by http://drupalcode.org/project/gridbuilder.git/blob/refs/heads/fancyui:/j....
• The overall UI is powered by Backbone.js. It's what makes the different views of the same data possible. See http://drupalcode.org/project/gridbuilder.git/blob/refs/heads/fancyui:/j....

@attiks has even already started rolling patches against this: #1797894: Cleanup patch for integration with breakpoints - branch formcontroller.

It'd be great if other people could continue the development of this. We (the Spark team) would love to work on this, but we simply don't have the bandwidth to work on that, definitely not before feature freeze. The code lives at http://drupalcode.org/project/gridbuilder.git/tree/refs/heads/fancyui.