Extending PyDev editor in Eclipse with a side-by-side display for live coding like Bret Victor's demo
===

I've written a Eclipse plug-in for [live coding in Python][1] that adds a display column to the PyDev editor. In that column, it shows how variable values change as the code runs, including multiple columns for loops or repeated function calls. The display is updated as you edit the code.

My question is this: how can I cleanly extend the PyDev editor to add this extra column that will scroll vertically with the source code, and scroll horizontally to show many columns in a long-running loop? My vision is to create something like the window you get when you compare two text files, but still let the user edit the Python code and use the PyDev editor's syntax highlighting. For now, I'm only displaying text, but I'd also like to be able to display graphics in this column.

My current hack to get the first release working is to subclass the line number ruler and replace the line numbers with my own text. That's really ugly, particularly the way I implemented horizontal scrolling.

If anyone on the PyDev team is interested in merging the feature or exposing some extension points to make it work better, I'm happy to do the grunt work and make a pull request. I do need some guidance, though.

The idea came from Bret Victor's talk, [Inventing on Principle][2], particularly the section at 17:30-21:30. If you want to see what I've implemented so far, I posted [a demo video][3], as well as [a walk-through][4]. 

Here's an example display for a binary search algorithm. (The display is on the left, the code is on the right.)

                            # echo on                               
                            # echo width 40
    n = 4 a = [1, 2, 4]     def search(n, a):
    low = 0                     low = 0
    high = 2                    high = len(a) - 1
            |                   while low <= high:
    mid = 1 | mid = 2               mid = (low + high) / 2
    v = 2   | v = 4                 v = a[mid]
            |                       if n == v:
            | return 2                  return mid
            |                       if n < v:
            |                           high = mid - 1
            |                       else:
    low = 2 |                           low = mid + 1
                                return -1
    
    i = 2                   i = search(4, [1, 2, 4])


  [1]: https://github.com/donkirkby/live-py-plugin
  [2]: http://www.youtube.com/watch?v=PUv66718DII
  [3]: http://www.youtube.com/watch?v=ZrbIVMdChDQ
  [4]: http://donkirkby.blogspot.ca/2012/06/live-coding-in-python.html