lovasoa / whitebophir

Online collaborative Whiteboard that is simple, free, easy to use and to deploy
https://wbo.ophir.dev
GNU Affero General Public License v3.0
2.01k stars 395 forks source link

New tool: mathematics #109

Open dazsmith opened 4 years ago

dazsmith commented 4 years ago

Firstly, thanks for a great piece of software! I am planning to use it in my mathematics classes, where not all students have access to a pen. I want to add a tool to accept TeX and display it, based on the existing Text tool. I am using mathjax to convert the TeX to an svg, which is then added to the canvas. I had no javascript or svg experience before this week, so please excuse my novice approach.

I am working in the branch https://github.com/dazsmith/whitebophir/tree/math-tool of my fork. As you can see at https://wb.dasmithmaths.com, the mathjax calls work, and the new tool works to display typeset mathematics (try typing something like \sqrt{x^2+1}-x^x/3). It will even sync from one user to another, and save in the board-anonymous.json file. But, when loading the page (after a refresh, for example), the svg elements that should contain the mathematics are empty. They are also missing their width, height and viewBox attributes. I also can't see how to enable editing of an existing mathematics element.

If you can offer any assistance, that would be really great! Sorry to be begging for assistance, but I am getting stuck.

dazsmith commented 4 years ago

I figured out the display problem. I was failing to call updateMathematics after createMathematicsField. I'll keep working on the selection / editing problem.

dazsmith commented 4 years ago

Selection & editing now works. The eraser does not work on these objects, yet. It also would be nice to make the typeset mathematics default to the same color as the user selected. I'll keep working on it.

dazsmith commented 4 years ago

Moving, erasing, and automatic color now works.

I also added a tool to insert image from URL. The latter is a bit clunky because I don't understand promises. If you paste in the URL of a valid image, then the image should appear. At the moment, you have to press [space] a few times while waiting for the browser to cache the image, then it will appear. The image is automatically immune from the eraser; to change that, edit INDELIBLE to DELIBLE before the image URL. Check it out at https://wb.dasmithmaths.com/.

Should I submit a pull request?

lovasoa commented 4 years ago

Hello ! This is a nice idea ! Yes, please open a pull request for the math tool.

ClaudeStabile commented 4 years ago

@lovasoa @dazsmith Is there a docker image ready to use for this wbo version ? What is the pull to get it ? I am running a wbo instance @ https://wbo.free-solutions.org , it is also integrated with our vidconf/chat services @ https://www.free-solutions.org Math option and file upload is a nice addon very needed by classroom in the COVID times

Congrats to both efforts and innovations. I love WBO as all Cobrowsing enabled apps

dazsmith commented 4 years ago

Hi @ClaudeStabile, the image tool still needs some work, but the mathematics tool is available at https://github.com/dazsmith/whitebophir/tree/math-tool. I have never used docker, so I don't know how to make a docker image, but you can clone from that repository, select the proper branch, and otherwise follow the same setup instructions as in the original README.md.

dazsmith commented 4 years ago

@ClaudeStabile I created the branch testing which has both the math tool and the image tool. You can find it at https://github.com/dazsmith/whitebophir/tree/testing. It can be installed as in the previous comment.

Because it can't accept uploads of images, it is not particularly useful for adding images to existing boards by hand. But I have scripts to convert pdf worksheets into png, then rsync to my webserver, then create boards containing each png so that students can collaborate on the worksheets. It works quite well in that context.

ClaudeStabile commented 4 years ago

@dazsmith Thanks a lot and congrats for this hack. I have deployed your latest version on my site https://wbo.free-solutions.org For docker, nothing to do except build image from git sources so unzip packages and docker build -t whiteboardtest:version1 . from folder, you get a fresh image you can use with a docker run command Feef free to explore https://www.free-solutions.org & https://cryptpad.free-solutions.org feel fre to create your Chat account. Whiteboard is used with our Jitsi servers with your package now Pls close this issue, there is none :)