Bespin adds collaborative features

Mozilla released version 0.4 of its online code editor Bespin last week, debuting integrated collaboration features that include project sharing and real-time live collaborative editing. Bespin is an in-browser web application, making it available from anywhere, but the "social coding" features are what really separates it from other collaborative editing solutions.

Welcome to Bespin

A Mozilla Labs project, Bespin is a free web service to which users can connect from any supported browser. The main Bespin server on which new official releases are rolled out is bespin.mozilla.com; to use it one must register a free Bespin server account. The client side of the editing environment runs entirely within the page: no extensions or other add-ons are required. Source code to the server is available under the Mozilla Public License version 1.1, and instructions for installing and running Bespin on a private server are provided on the Mozilla wiki.

Bespin was first unveiled in February of 2009, and is described as a code editor for web developers, built with web technologies. It supports line numbering, syntax highlighting (for HTML, CSS, and JavaScript by default), multiple projects, version control with Mercurial, cut-copy-paste with a clipboard, search, undo and redo, and previewing on the web. Code projects are stored on the server, but the editor can upload zipped or gzipped archives as well as clone existing Mercurial projects into the user's Bespin server account.

Once logged into their Bespin server account, users can begin using Bespin immediately. Bespin's editor takes up the entire window, save for a thin toolbar at the top that displays the current project and file and a few basic buttons. The other major mode provided by the program is the Bespin command line, which can be activated from the toolbar or by hitting Ctrl-j (which toggles between the editor and command line). The command line allows the user to create new projects, change interface settings, open files, and more. Command completion, history, and tooltip-style help assist new users in getting up to speed with the command set. For opening files and examining projects, a graphical file browser is also provided, which mimics the left-to-right navigation panes of Mac OS X's Finder rather than a more traditional Unix-like folder tree.

The Bespin editor is rendered inside of an HTML5 canvas element, so a canvas-supporting browser is required. Currently, this includes all recent versions of Firefox, Chrome/Chromium, Opera, and WebKit/Safari. The canvas is used to render the entire editing environment — window panes, menus, buttons, scroll bars, even the cursor — with JavaScript. Developer Ben Galbraith described the use of canvas as a superior alternative to building on top of the textarea tag or contentEditable property and native user interface widgets because canvas allows better flexibility to adapt the UI to users' personal preferences, better accessibility, and better performance and compatibility when editing large files. He also offered a caveat in his explanation, noting that "there may very well be a more effective way to do what we've done than with canvas. I'm not saying this is the best way to do it; I just want to explain why we did it."

One outcome from the decision to use canvas is that the Bespin team developed its own UI toolkit, which it plans to spin off into a reusable code project called Thunderhead. Likewise, the editing component itself could be easily reused in other Web applications, so it will eventually be separated out into a stand-alone, reusable component, too.

Bespin is designed to be adjustable to the individual tastes of the user, so it provides user-configurable settings. In addition to basic configuration options like auto-indentation and "strict lines" mode, each Bespin server account automatically includes a BespinSettings project that contains a config.js file for tweaking Bespin with JavaScript. Users can write their own commands, using the same syntax as Mozilla Labs' Ubiquity project, and Bespin has a plugin API which is still undergoing development.

Collaborate

The 0.4 release added some niceties to the existing feature set — such as argument completion for commands and the addition of Subversion as the second supported version control system — but the most exciting new addition is a built-in framework for sharing and live collaboration. Users must activate the collaborative features by executing set collaborate on from the Bespin command line.

The new "share" command allows users to mark projects as visible to other users on the Bespin server, as individuals, groups, or globally. Projects can be shared in read-only or read/write mode. Executing:

    share add projectname user1

shares the project in read-only mode, while

    share add projectname user1 edit

activates read-write permission. For sharing to work, the user on the receiving end of the shared project must explicitly accept shared code from the originating user with:

    follow username

This mechanism prevents spamming innocent users by sharing scores of unwanted projects with them. Substituting the string everyone for a username shares the project with everyone on the server who chooses to follow the project owner.

Other users' shared projects appear in the Bespin file browser just like locally-owned projects. If a project is shared in read-write mode, all users with access to it can edit a file simultaneously. Edits and text selection are visible in real time to all who have the file open in the editor. A collaboration window showing which users are currently editing the file appears in the upper right-hand corner of the editor window.

"Groups" in Bespin collaboration are strictly a private user-defined convenience, not a social feature; adding other people to a group simply saves keystrokes by permitting the user to type:

    share add myproject mygroup

instead of:

    share add myproject user1
    share add myproject user2
    ...

To define a group, just execute:

    group add groupname user1 user2 ... userN

Bespin uses Mobwrite to handle synchronization and conflict resolution between user edits. The system uses differential synchronization to keep copies of the file in sync. This algorithm is symmetric, repeatedly calculating the differences between each editing session's copy of the document and a previously-updated "shadow" copy, then relaying patches to every other session. Since every session receives every other session's updates, there is no "master" copy responsible for merging all of the changes and potentially creating bottlenecks. Unlike "event passing" synchronization, diffs automatically catch all changes, whether originating from typing, cut-and-paste, undo, or search-and-replace. Developer Dion Almaer said that the team has successfully tested Bespin with 30 concurrent users and 100,000-line files, making it significantly more robust than other online sharing tools.

Currently, sharing and collaborative editing are only possible between users on the same Bespin server, but Almaer said that the team very much wants to include support for federation in the future. "We want to create a compelling, fun, productive social editing experience for as many people as possible," he said. Joe Walker, who added the collaboration support to 0.4, commented that the Bespin team hopes to enable collaborative sessions between Bespin and other editors capable of collaboration, such as GEdit, Eclipse, and Emacs.

The future of Bespin will include more features to enhance this social dimension, Almaer explained:

Likewise, the Bespin team encourages users to add new features via JavaScript and the plugin API. Outside contributors have already added syntax highlighting support for Ruby and Arduino code. Almaer said that the initial feature set of the editor focuses on web technologies merely because the web is Mozilla's focus and the team has limited resources. If the Bespin development community wants to expand the scope of the project, it will.

Collaborative editing is possible in several other open source applications, from word processors like Abiword to text editors like Gobby, and via plugins for many more applications — even popular development tools like Emacs, gVim, and Eclipse. At first glance, Bespin seems to sport the same feature set as most of these other options, but it has two distinctive qualities that users may find attractive.

First, as pointed out in the initial release announcement, Bespin is available everywhere, on every platform with a modern web browser. The alternatives require installation, and in many cases are dependent on specific versions of the application for compatibility. Some are limited to specific operating systems because they rely on underlying packages like Telepathy.

Second and more importantly, Bespin is pushing the "social" nature of coding itself as the key feature, not just synchronization of files. The concepts of sharing projects and following individuals are the beginnings of a social graph implementation that could extend the concept beyond simple text changes. As Almaer hinted, and as shown in the project's roadmap and in various demo videos, more is on the way, such as a "heatmap" that graphically depicts where a codebase is changing and a dashboard that tracks what other users are doing.

Bespin 0.4 is stable and responsive enough that the Bespin team uses it for Bespin development. It should prove to be a valuable asset to remote development teams, particularly (in the short term) for those working in the core web technologies that remain its focus. Looking further out, the social coding concepts Bespin explores could significantly improve on the traditional distributed version control systems most developers use today.