No description
Find a file
finnboeger 3a85e45439
Add a svg export with proper rounding (#58)
* make live version render single-point paths the same as preview does

* implemented smoothing in server side rendering

* separate preview from export

* ensure correct handling of paths with only one child

* break out rendering of 3rd point and up into separate function

* changed test for 2 points to math current implementation and added a test for a bezier curve with 3 lines

* deduplicate code to extrapolate points for bezier curves

* fix merge

* Factor more code between the client and the server

Completely remove the straight line approximation foor paths

Vastly improve preview performance

* Add support for opacity in preview

* Stream board previews to the browser

Previously, svg board previews were generated in memory
and then pushed to the client.

They are now streamed to the client without blocking the main thread.

# Performance

## Before

$ ab -n 30 -c 15 http://localhost:8080/preview/ic3
This is ApacheBench, Version 2.3 <$Revision: 1843412 $>
Copyright 1996 Adam Twiss, Zeus Technology Ltd, http://www.zeustech.net/
Licensed to The Apache Software Foundation, http://www.apache.org/

Benchmarking localhost (be patient).....done

Server Software:
Server Hostname:        localhost
Server Port:            8080

Document Path:          /preview/ic3
Document Length:        14352691 bytes

Concurrency Level:      15
Time taken for tests:   19.499 seconds
Complete requests:      30
Failed requests:        0
Total transferred:      430588920 bytes
HTML transferred:       430580730 bytes
Requests per second:    1.54 [#/sec] (mean)
Time per request:       9749.374 [ms] (mean)
Time per request:       649.958 [ms] (mean, across all concurrent requests)
Transfer rate:          21565.33 [Kbytes/sec] received

Connection Times (ms)
              min  mean[+/-sd] median   max
Connect:        0    0   0.1      0       0
Processing:   727 8885 1561.6   9220    9817
Waiting:      718 5380 2668.8   5569    9549
Total:        727 8885 1561.6   9220    9817

Percentage of the requests served within a certain time (ms)
  50%   9220
  66%   9239
  75%   9245
  80%   9248
  90%   9560
  95%   9811
  98%   9817
  99%   9817
 100%   9817 (longest request)

## After

$ ab -n 30 -c 15 http://localhost:8080/preview/ic3
This is ApacheBench, Version 2.3 <$Revision: 1843412 $>
Copyright 1996 Adam Twiss, Zeus Technology Ltd, http://www.zeustech.net/
Licensed to The Apache Software Foundation, http://www.apache.org/

Benchmarking localhost (be patient).....done

Server Software:
Server Hostname:        localhost
Server Port:            8080

Document Path:          /preview/ic3
Document Length:        14352687 bytes

Concurrency Level:      15
Time taken for tests:   17.647 seconds
Complete requests:      30
Failed requests:        0
Total transferred:      430588020 bytes
HTML transferred:       430580610 bytes
Requests per second:    1.70 [#/sec] (mean)
Time per request:       8823.254 [ms] (mean)
Time per request:       588.217 [ms] (mean, across all concurrent requests)
Transfer rate:          23828.86 [Kbytes/sec] received

Connection Times (ms)
              min  mean[+/-sd] median   max
Connect:        0    0   0.1      0       0
Processing:   719 8212 1440.6   8657    8810
Waiting:      701 4666 2324.8   4788    8769
Total:        719 8212 1440.6   8657    8811

Percentage of the requests served within a certain time (ms)
  50%   8657
  66%   8670
  75%   8691
  80%   8790
  90%   8802
  95%   8808
  98%   8811
  99%   8811
 100%   8811 (longest request)

* Write the element id and opacity only when needed

* Fix a bug in wbo_pencil_point

* Rework the integration tests for the pencil tool

* Test server-side rendering in integration tests

* Remove unused function

* Remove unused id fallback

* set return types

* fix rectangle

* set fill for rect in stylesheet instead

Co-authored-by: Ophir LOJKINE <pere.jobs@gmail.com>
2020-05-08 21:15:39 +02:00
.github Update pull_request_template.md 2020-04-29 19:04:19 +02:00
client-data Add a svg export with proper rounding (#58) 2020-05-08 21:15:39 +02:00
server Add a svg export with proper rounding (#58) 2020-05-08 21:15:39 +02:00
server-data Ignore server-data files on git 2020-04-03 14:16:39 +02:00
tests Add a svg export with proper rounding (#58) 2020-05-08 21:15:39 +02:00
.gitignore .gitignore 2020-05-03 20:27:16 +02:00
AUTHORS Initial commit 2013-08-27 19:43:49 +02:00
docker-compose.yml Fix docker compose 2019-04-12 20:50:39 +02:00
Dockerfile Update dependencies 2020-04-12 11:15:22 +02:00
LICENSE Switch the project's license from GPLv3 to AGPLv3 2018-12-02 13:49:29 +01:00
nightwatch.conf.js Fix CI 2020-04-28 00:56:13 +02:00
package-lock.json Improve compatibility with Internet Explorer (#63) 2020-05-05 12:01:46 +02:00
package.json Improve compatibility with Internet Explorer (#63) 2020-05-05 12:01:46 +02:00
README.md Merge branch 'master' of github.com:lovasoa/whitebophir 2020-05-01 19:29:01 +02:00

WBO

WBO is an online collaborative whiteboard that allows many users to draw simultaneously on a large virtual board. The board is updated in real time for all connected users, and its state is always persisted. It can be used for many different purposes, including art, entertainment, design, teaching.

A demonstration server is available at wbo.ophir.dev

Screenshots

The anonymous board collaborative diagram editing Screenshot of WBO's user interface: architecture
teaching math on WBO wbo teaching drawing art angel drawn on WBO

Running your own instance of WBO

If you have your own web server, and want to run a private instance of WBO on it, you can. It should be very easy to get it running on your own server.

Running the code in a container (safer)

If you use the docker containerization service, you can easily run WBO as a container. An official docker image for WBO is hosted on dockerhub as lovasoa/wbo.

You can run it with the following command :

docker run -it --publish 5001:80 --volume $(pwd)/wbo-boards:/opt/app/server-data lovasoa/wbo:latest

This will run WBO :

  • on port 5001
  • persisting the user data in $(pwd)/wbo-boards

You can then access WBO at http://localhost:5001.

Running the code without a container

Alternatively, you can run the code with node.js directly, without docker.

First, download the sources:

git clone git@github.com:lovasoa/whitebophir.git
cd whitebophir

Then install node.js (v10.0 or superior) if you don't have it already, then install WBO's dependencies:

npm install --production

Finally, you can start the server:

PORT=5001 npm start

This will run WBO directly on your machine, on port 5001, without any isolation from the other services.

Running WBO on a subfolder

By default, WBO launches his own web server and serves all of its content at the root of the server (on /). If you want to make the server accessible with a different path like https://your.domain.com/wbo/ you have to setup a reverse proxy. See instructions on our Wiki about how to setup a reverse proxy for WBO.

Troubleshooting

If you experience an issue or want to propose a new feature in WBO, please open a github issue.