Google Wave in Silverlight – Online collaboration made easy

Google Wave is pretty cool, and was a big hype in the beginning.
I still use for sharing some notes with others…

Building something similar like Google Wave in Silverlight should be fairly easy

• Use the RichTextBox control to highlight changes from others
• Use HTTP Polling Duplex Protocol to update different clients connected to 1 wave

  
Figure: RichTextBox control in action from MSDN

 

Google Wave = Big Silverlight Richtextbox that gets updates from others

How can we build it with Silverlight?
AND
How do other applications work, like EtherPad?

 

There are actually already 2 implementations of this
No need for me to do it myself ;-)

1. beeweevee – online richtextbox similar to etherpad in Silverlight
http://www.beweevee.com/

2. Silverdraw - online drawing collaboration in Silverlight
http://silverdraw.com/

 

How does beeweevee and Silverdraw work?

Both implementations use the HTTP Polling Duplex Protocol in the background to get and send updates (implementation of a publisher subscriber scenario)

 

Beeweevee

You can see what they are doing with FireBug or Fiddler by inspecting the messages, that get sent over the wire.

Figure: beeweevee inspected by FireBug – “Net” tab shows the long polling HTTP connection

 

SilverDraw

Silverdraw is nicely documented on codeproject and you can even download the source and have a look

Get the source code

See the details on codeproject

 

 

Other examples of online collaboration

• EtherPad
  • Online web application
  • a lot of JavaScript
  • company acquired by Google
  • Had a limit of 16 users
    http://etherpad.com/
• NotAPipe.net (Italian company WOOHOO)
  • http://notapipe.net/
• SquadEdit
  • http://squadedit.com/
• SubEthaEdit
  • Desktop App for Mac
• Gobby
  • Desktop App cross plattform
• MoonEdit
  • Desktop App cross plattform

I did a quick investigation how some of them work, see below

Etherpad

Figure: Etherpad in action, in Firefox with Firebug, and shows polling every 400ms

 

 

NotAPipe

How dows notapipe work?

Notapipe.net sends patch’s to the server

 

After I type “Peter”

[{"P":{"P":"32c9cf191a244c54955c48dd7ae9a526","T":"s"},"M":["push",{"T":"j","P":2,"C":"24e777f817f2310860493e4c16acf8d4"},{"author":"xxxxyyyy","context":"990ebc5db495ef8c6a731ea5bc0f3cdfb1312de0","identity":"ca96426a4238963e6f6f0b7d0f5c6141a867b8db","patch":[{"type":"ins","index":31,"text":"PEter"}]}]}]

I delete “mal”

[{"P":{"P":"32c9cf191a244c54955c48dd7ae9a526","T":"s"},"M":["push",{"T":"j","P":2,"C":"24e777f817f2310860493e4c16acf8d4"},{"author":"xxxxyyyy","context":"5398fe37f6ad79b2051c15d8b3535d9e1956953b","identity":"8c3e328f74cce13046a14eda36db75bd358afca9","patch":[{"type":"del","index":19,"text":"mal"}]}]}]

Newline

[{"P":{"P":"32c9cf191a244c54955c48dd7ae9a526","T":"s"},"M":["push",{"T":"j","P":2,"C":"24e777f817f2310860493e4c16acf8d4"},{"author":"xxxxyyyy","context":"37741684576d8e08a71255484cc520b915212063","identity":"12be62ce1a2c8ce3f6c3890f28f0660989d35eed","patch":[{"type":"ins","index":23,"text":"\n"}]}]}]

How to apply patches from others?

All the theory here http://darcs.net/manual/node9.html

 

Fiddler and FireBug rock!