Shared drawing canvas / whiteboard

[jondo]

For teaching mathematics, a shared whiteboard would be useful (as e.g. Zoom has got).
For now, I will test WBO (https://wbo.ophir.dev) as workaround.

[rasos]

Integrating a WBO whiteboard could be done similar how etherpad is integrated. This would result in a larger PR with about 20 files involved, at every etherpad occurence add a whiteboard section.

[rainbyte]

My professor rejected Jitsi because it doesn't have whiteboard nor ppt/pdf presentation integrated, so we are using zoom instead :(

[poVoq]

https://github.com/spacedeck/spacedeck-open

Might be another option.

[lovasoa]

Hello ! I'm the author of WBO. Let me know if there is anything I can do to help.

[Echolon]

As long as there is no implementation please use the screen-sharing feature in combination with e.g. Drawpile - https://drawpile.net/

[ryanmartinneutrino]

Shouldn't it be possible to get it to work with etherpad and ep_draw plugin? Then opening the shared document (etherpad) would have drawing possibilities? I can't get ep_draw to work though...

[rainbyte]

As long as there is no implementation please use the screen-sharing feature in combination with e.g. Drawpile - https://drawpile.net/

This is also about usability, because for many people it is difficult to use Jitsi with 3rd party apps instead of having an integrated whiteboard and presentation.

[saghul]

Something that can be integrated with Etherpad as a plugin would be ideal here. Our Etherpad integration is not ideal, so adding another service is nontrivial. Having it as an Etherpad plugin would solve that.

I looked at ep_draw at one point, but it seemed dead. I see that it got some activity recently, but the server side, Etherdraw, seems to be dead: JohnMcLear/draw#271

I think creating an Etherpad plugin for Drawpile (or whatever other similar tool which is easy to self-host) is the way forward here.

[madappally]

WBO seems to be a good option. Has anyone tried to integrate WBO with jitsi?

[arunvc]

Self hosted wbo with meeting-id can make unique meeting boards

Example https://wbo.ophir.dev/boards/meeting-id

Possible solution

May be in screen share a new option to choose White board.
And on click of White board launches local wbo with meeting-id
that appears in the main content or in a new window,

To collaborate others would have the option to Join White board
which can launch wbo with the same meeting-id

[pandian-egnaroinc]

For teaching mathematics, a shared whiteboard would be useful (as e.g. Zoom has got).
For now, I will test https://wbo.ophir.dev (moved from https://wbo.openode.io) as workaround.

I just integrated WBO with selfhosted jitsi server and it works great!

Just configure the etherpad_base to use WBO url in the config.js and thats it.
(etherpad_base: 'https://wbo.ophir.dev/boards/' to config.js)
Jitsi will use the above as base url and attach a meeting specific UID to the base and creates a new whiteboard specific to the meeting.

After this, the WBO will appear as the collaborative document when you click 'open shared document' during the meet.

Of course it is for trying out. If you want all your data to be local, you should be hosting a WBO server (https://github.com/lovasoa/whitebophir) and adjust etherpad_base url with your server's url.

Hope it helps.

[pandian-egnaroinc]

WBO seems to be a good option. Has anyone tried to integrate WBO with jitsi?

I did and it is working great. Please refer previous post.

[pandian-egnaroinc]

My professor rejected Jitsi because it doesn't have whiteboard nor ppt/pdf presentation integrated, so we are using zoom instead :(

Share your screen => Chrome tab does not work for you?
The chrome tab can contain any content and it will be shared.
It is not totally integrated but it works.

[pandian-egnaroinc]

Hello ! I'm the author of WBO. Let me know if there is anything I can do to help.

Hi lovasoa,

I get a black background in WBO when integrated with jitsi (all functionalities are fine and same otherwise).

Any idea how to make it white like in https://wbo.ophir.dev/?
(I am unsure if it is a WBO or Jitsi specific issue as of now)

[rainbyte]

My professor rejected Jitsi because it doesn't have whiteboard nor ppt/pdf presentation integrated, so we are using zoom instead :(

Share your screen => Chrome tab does not work for you?
The chrome tab can contain any content and it will be shared.
It is not totally integrated but it works.

Professor said it is complicated that way because extra things are needed and students cannot be seen while sharing the screen.
Zoom lets you share a ppt/pdf, use whiteboard and watch other people, all at the same time pressing just one button.
I tried to provide Jitsi as alternative, but they want all these features.

[pandian-egnaroinc]

Hello ! I'm the author of WBO. Let me know if there is anything I can do to help.

Hi lovasoa,

Is there a way to clear the whole canvas? Currently it is time consuming to remove all contents. A button to clear all contents can go a long way in not limited to jitsi integration. This would improve usability of highly collaborative environment (5+ users). Currently only way is to create new whiteboard and move all the 5 users around, not ideal and time consuming.

Also let me know a better place to request improvements etc for WBO, this place is not ideal.

Thanks,

[lovasoa]

Yes, WBO is its own project, with its own issue tracker where you can open feature requests. Being able to clear the whole whiteboard has been requested before, but I am reluctant to implement it. WBO is sometimes used in massively multi-user settings, in which one wouldn't want a single misbehaving user to be able to delete a whole board. Just as you don't have a big "delete article" button on wikipedia.

[umagon]

Yes, WBO is its own project, with its own issue tracker where you can open feature requests. Being able to clear the whole whiteboard has been requested before, but I am reluctant to implement it. WBO is sometimes used in massively multi-user settings, in which one wouldn't want a single misbehaving user to be able to delete a whole board. Just as you don't have a big "delete article" button on wikipedia.

@lovasoa isn't old plain eraser kind of a problem too in that sense?

I like the suggestion in this issue lovasoa/whiteobophir#84.

[siddharthsrivastava]

Hello ! I'm the author of WBO. Let me know if there is anything I can do to help.

Hi lovasoa,

I get a black background in WBO when integrated with jitsi (all functionalities are fine and same otherwise).

Any idea how to make it white like in https://wbo.ophir.dev/?
(I am unsure if it is a WBO or Jitsi specific issue as of now)

I am also facing this issue. It is black on chrome desktop browser, but while using it from jitsi meet android app, it is white.

[awlx]

We have integrated https://github.com/lovasoa/whitebophir to https://meet.ffmuc.net with the ep_draw plugin in etherpad and it's working like a charm even on the mobile apps. Thank you very much @lovasoa for this awesome tool.

[lovasoa]

@awlx : Good work 👍 I created a page in the WBO wiki about how to setup jitsi meet with WBO. It is currently mostly empty. Maybe you can fill it with step-by-step instructions about how to setup the plugin ? It would certainly be super useful for future administrators wanting to achieve the same thing.

[pandian-egnaroinc]

@awlx : Good work 👍 I created a page in the WBO wiki about how to setup jitsi meet with WBO. It is currently mostly empty. Maybe you can fill it with step-by-step instructions about how to setup the plugin ? It would certainly be super useful for future administrators wanting to achieve the same thing.

Etherpad is really not that useful with chat directly integrated with jitsi. Direct integration as I mentioned above works great.

Please check below image.

As I also mentioned, Not sure why the background is black. Filed a bug regarding configurable canvas color.

[awlx]

@pandian-egnaroinc that's why integrated WBO as a plugin for etherpad (with ep_draw). So the background stays white and you can share everything via export functions of etherpad and send the link for reading after the session.

[pandian-egnaroinc]

@pandian-egnaroinc that's why integrated WBO as a plugin for etherpad (with ep_draw). So the background stays white and you can share everything via export functions of etherpad and send the link for reading after the session.

@awlx Are you populating the wiki page shared by lovasoa?
I think a middle ground need to be reached. The ep_draw with only middle section for other functions and full screen for WBO seem not so professional.
Will try once the wiki is ready.

[rainbyte]

@awlx : Good work +1 I created a page in the WBO wiki about how to setup jitsi meet with WBO. It is currently mostly empty. Maybe you can fill it with step-by-step instructions about how to setup the plugin ? It would certainly be super useful for future administrators wanting to achieve the same thing.

Etherpad is really not that useful with chat directly integrated with jitsi. Direct integration as I mentioned above works great.

Please check below image.

As I also mentioned, Not sure why the background is black. Filed a bug regarding configurable canvas color.

Wow, it looks really good, and with pdf it would be perfect.

[timowevel1]

1. When the desktop sharing function is activated, the draw button is activated.
2. Clicking the draw button creates a canvas, and captures and draws the desktop screen on the canvas in a fixed frame unit.
3. Create a drawing component with startEffect and stopEffect functions and do localVideo.setEffect
4. A drawing event is created on the video element, and within the event, a drawing operation is executed on the canvas.
5. Users who participated in the conference create a drawing event in the video element when the drawing flag of the user they are currently viewing is activated, and in the event, a drawing event is sent to the user with the canvas through room.sendCommand.

this is rough logic

Hey, could you share your code? Everything looks nice, but that doesnt help me :/

[tusharsonawanes]

I'd suggest you open an issue on their GH repo then.

Seems there is no issue tab in that repo.

https://github.com/JIBSIL/ep_draw

[DanielHabenicht]

I added a PR to include generic IFrames but with the main goal of adding a Whiteboard:

It will be configurable in the main config.js by adding:

genericIFrameTemplateUrl: "https://wbo.ophir.dev/boards/{room}?lang={lang}"

[1a7r0ch3]

I wrote a light and free editable beamer slideshow tool for live online lectures, maybe this could interest you. Beware that my tool is only visual, so users must use two tabs, one for voice over IP (Jitsi or Mumble or anything else) and one for my tool. I'd be glad that you report here or on the Gitlab page of my project if you find it useful!

[Piyen]

Just configure the etherpad_base to use WBO url in the config.js and thats it. (etherpad_base: 'https://wbo.ophir.dev/boards/' to config.js) Jitsi will use the above as base url and attach a meeting specific UID to the base and creates a new whiteboard specific to the meeting.

@pandian-egnaroinc
Hi pandian-egnaroinc,
It didn't create a new whiteboard but linked to someone's . How can I solve this ?

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[ImaCrea]

hey there, was wondering how is it going here? This was a great project and it seemed there was a great dynamic here.

[DanielHabenicht]

From my side I try to keep the PR #11052 up to date. Currently I am waiting for feedback.

[ankurranpariya4066]

WBO seems to be a good option. Has anyone tried to integrate WBO with jitsi?

I did and it is working great. Please refer previous post.

which post
can you pls give the link here?

[nsde]

I'd be happy to see kind of an DrawIo implementation/widget for this! :)

[saghul]

We have integrated Excalidraw. It's currently in beta and will be released soon.

[DanielHabenicht]

Does that mean the PR in #11052 will be obsolete?

[saghul]

No, it serves a different purpose, like using it for Etherpad for example.

We didn't need it in the end for whiteboards because Excalidraw can be integrated as a React component so it simplifies things.

[ImaCrea]

WOOWWWW ! Can't wait to try it :) Amazing news!

[hex-m]

You can try it already: https://beta.meet.jit.si/

[webRTCv1]

In my list of Best WebRTC Projects, I also tried MiroTalk where the collaborative whiteboard functionality and it’s very cool!
https://sfu.mirotalk.com - https://p2p.mirotalk.com that using fabric.js

[piiskop]

In my list of Best WebRTC Projects, I also tried MiroTalk where the collaborative whiteboard functionality and it’s very cool! https://sfu.mirotalk.com - https://p2p.mirotalk.com that using fabric.js

i just had my first experience with MiroTalk and the camera image was transferred non-smoothly and there is no grid on the blackboard nor can lines be drawn in any direction.

[Thatoo]

There is a whiteboard but it doesn't allow to draw on a shared screen or shared document...