/whiteboard

An interactive free form drawing space within the browser. What one user draws is then broadcast to any other user connected to the page. Currently uses node.js, Web sockets, and HTML5 Canvas.

Primary LanguageJavaScript

This project was started as an experiment in a few new technologies. These being:
  - node.js
  - Websockets
  - HTML5 Canvas

As users connect to the page, they can draw in the area given. When one user draws, their actions are broadcast to any other user viewing/drawing on that particular board.

Detail wise, each user gets a canvas DOM element assigned to them on each clients browser. This is done because a single HTML5 canvas element can only have a single context, and trying to simultaneously draw the actions of multiple users within a single context results in very poor results and also might just be kinda impossible to do well. As a result, it is currently implemented with a canvas per user.

The drawing seems fairly smooth with a couple of users at once, but I have no idea what would happen with a lot of users yet. Moving forward, some ideas are:

  - add users as an actual model on the server.
  - allow users to create/join new rooms to start a new whiteboard session in.
  - allow board owners to clear the board for all users.
  - better/more drawing controls
  - allow users to view multiple boards being drawn at once.