Bespin Community Update; Outline View, iPhone Preview, Python Support, and Defragging

Joe Walker and Kevin Dangoor of the Developer Tools Lab joined Ben and myself for a busy few days to go heads down on working out some good direction for Bespin and our group in general. We are pretty excited for the coming months, and we all remarked at how fantastic our Bespin community is growing already. Joe and Kevin are heads down finishing up initial versions of production-ready collaborative editing and VCS integration respectively, but while we wait a touch more for that, we have seen some pretty fun and exciting things. Let’s show you:

Structured Outline View

Malte has built on his work involving rich parsers using Web Workers and taken it from the interesting function viewer to a full structured outline view that shows you your classes, methods, and subscribers.

What is particularly exciting about this is that Malte has written the functionality in a way that can be extended for the library of your choice, or the way that you write code. For example, he has code to understand how Dojo does classes (dojo.declare) and also code like the following to understand how we use pub/sub:

bespinEventPublish: {
    declaration: "bespin.publish",
    description: "Publish"

bespinEventSubscription: {
    declaration: "bespin.subscribe",
    description: "Subscribe to"

How does it work? Malte tells us:

At the heart of the outline generator is a visitor function that gets invoked for every node. It receives a stack of nodes that are lexically before and above it. It also receives a stack of indexes that tell us where a node lies within the child nodes of its parents. This allows finding predecessors and successors of nodes above us. Long story short: Once we find a string like “subscribe”, we can check our lexical predecessors for “bespin” and assume the next string node is the name of the event. Voila.

Python Syntax Highlighting

Roberto has committed python syntax highlighting support via the set syntaxengine codemirror engine:

It has some pretty fun features such as:

  • Token-based syntax highlighting – currently very little lexical analysis happens. Few lexical errors will be detected.
  • Use the normal indentation mode to enforce regular indentation, otherwise the “shift” indentation mode will give you more flexibility (not used yet in bespin).
  • Parser Options: Python version, error display

iPhone and Bespin

Roberto didn’t stop there though, and created some simple iPhone support for Web applications:

His new inline preview setting lets you see your current page in iPhone mode. Before running the new enhanced preview command, set your preference:

  • set preview window – default, an external window, as we have now.
  • set preview inline – instead of editor canvas we have an iframe containing the preview
  • set preview iphone – a non-modal popup containing an iframe with dimensions of the iPhone screen. Of course you should use Safari for this.

Defrag Command

I should have written up the defrag command for April Fools, but instead this post talks about a Bespin concept around visualising code in a way that shows you who is editing what. At this point we are very much in experimental mode and I am looking for feedback on the ideas in the article.

There have also been some great contributions from the entire team. Some subtle features such as set highlightline on (highlight the line that your cursor is on), set trimonsave on (auto trim trailing spaces before saving a file), and a great addition by Julian that has you able to use the keyboard to get around the file browser. We also have to give a big shout-out to Gordon who is doing a phenomenal job shepherding Bugzilla recently (along with fixing bugs and making tabs work well!)

We still have much to do, so if you have enough free cycles to dive in and help make Bespin a fun and productive tool for the Open Web, please join us! We are going to start to have weekly status calls on Tuesdays at 9am PT. Join us on #bespin to chat more!

— Dion Almaer, on behalf of the Bespin development team

3 responses

  1. Lucas wrote on :

    keep up the good work guys! this is some amazing stuff!

  2. josh wrote on :

    I think this looks really cool. I am a little confused how it will work… can you use it offline at all? Can it integrate with svn?

  3. Barnacles wrote on :

    Although unrelated…why is Safari 4 the browser used in the screenshots?