Multi Client White Board
This is a whiteboard app in which clients can join a room made by the organizer and the content of the whiteboard is shared with all the clients with most of the whiteboard features implemented.
Created on 10th April 2022
•
Multi Client White Board
This is a whiteboard app in which clients can join a room made by the organizer and the content of the whiteboard is shared with all the clients with most of the whiteboard features implemented.
The problem Multi Client White Board solves
With this app, people can instantly collaborate and the organizer (creator of the room) only has full access to the whiteboard initially. The organizer's whiteboard is shared with all the joined clients and the whiteboards can be saved later in the database. The saved whiteboards can be edited or deleted also. The organizer can also give access to use and edit the whiteboard to any of the joined members. Since, these rooms are temporarily created, as soon as the organizer leaves a particular room, the room is destroyed and all the other participants also get automated removed from the rooms Users can also share their saved whiteboards with some other users through the email link and hence it's very easy to share the whiteboards between different users. Users can also use the whiteboards on mobile.
Challenges we ran into
Handling the canvas for the whiteboard is the biggest problem we ran into. It was very much difficult to pan and zoom the whiteboard along with the erased section if the eraser has been used before zooming or panning. Finally, we used the famous Pythagoras theorem to cleverly get the effect of pan and zoom. Also, propagating the canvas contents to all the users was a bit challenging with all the erased sections as well. Giving whiteboard access to any of the clients was also tough. Editing and deleting the images from the database as well as from Cloudinary and updating the states were also a little bit tough to implement. Moreover, using the node server as a REST API, for HTML file serving as well as as a socket.io server and syncing all of them was the most challenging one. But with constant hard work, thinking and teamwork we were able to solve these issues.