Directory

← Back

CollabSketch Add-on

Collaborative Sketch Add-on for Vaadin

Author

Rating

Popularity

<100

The widget allows drawing into same collaborative sketching canvas for multiple users and each of them will be assigned with their own color. When anyone of the users edit the sketch its automaticly pushed for all the other users.

When you use this component you should handle CollabSketchLineContainer-class and share it between each instance of the server-side component. If you want to share the canvas for all the users you should make the CollabSketchLineContainer-instance as singleton.

Sample code

public class DemoUI extends UI
{
    public static CollabSketchLineContainer lines = new CollabSketchLineContainer();
	
    @Override
    protected void init(VaadinRequest request) {
    	final VerticalLayout layout = new VerticalLayout();
        layout.setSizeFull();
    	final CollabSketch collabsketch = new CollabSketch(DemoUI.lines, 800, 600);
        layout.addComponent(new Button("Reset canvas", new Button.ClickListener() {
			
			@Override
			public void buttonClick(ClickEvent event) {
				collabsketch.clearCanvas();
			}
		}));
        layout.addComponent(collabsketch);
        layout.setExpandRatio(collabsketch, 1.0f);
        setContent(layout);
    }

}

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

This widget is in alpha state. Main features:

  • Concurrent and collaborative use of HTML Canvas for Chrome
  • Automatic push without need of client side activity
  • Selecting the size of the canvas
  • Touch handling for mobile devices
  • Clearing the whole canvas
  • Feature to save image as file
Released
2013-04-21
Maturity
EXPERIMENTAL
License
Apache License 2.0

Compatibility

Framework
Vaadin 7.1+
Browser
Safari
Google Chrome
iOS Browser

CollabSketch Add-on - Vaadin Add-on Directory

Collaborative Sketch Add-on for Vaadin CollabSketch Add-on - Vaadin Add-on Directory
The widget allows drawing into same collaborative sketching canvas for multiple users and each of them will be assigned with their own color. When anyone of the users edit the sketch its automaticly pushed for all the other users. When you use this component you should handle CollabSketchLineContainer-class and share it between each instance of the server-side component. If you want to share the canvas for all the users you should make the CollabSketchLineContainer-instance as singleton.
Online