Commit graph

5 commits

Author SHA1 Message Date
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
Ophir LOJKINE
8daa48e84e Fix race condition in integration tests 2020-05-07 18:07:31 +02:00
finnboeger
3c453e15c2
Add an ellipse and circle tool (#40)
* Added Circle tool as alternative function of Rectangle tool

* change toggle function to work with new icon structure and toggle name

* split circle into separate tool and added ellipse as secondary function. Also added server side rendering for svg export

* change ellipse to be default

* change circle behaviour to same as inkscape

* toggle to alternative while holding shift

* append to drawing area instead of svg root

* don't update shape after it has been drawn

* Stop logging all rectangles

* Remove es6

* Remove more es6

* Fix a few bugs with circle to ellipse toggling

* Calculate the circle params at creation time, not at rendering time

* Make the behavior of the shift key consistent

When shift is pressed, the current function is reversed: the circle tool draws an ellipse and the ellipse tool draws a circle.
This makes the tool easier to grasp.

* Add required translations

* german translation

* Update the shape immediately when pressing shift

* Fix server-side ellipse rendering

* Add a test for the circle tool

Co-authored-by: Robert Beach <rdbeach@gmail.com>
Co-authored-by: Ophir LOJKINE <pere.jobs@gmail.com>
2020-05-03 17:53:44 +02:00
finnboeger
fce694df28
Add a cursor (#46)
* Added cursors

* Prepare cursor code for future settings to toggle cursors on or off.
Let cursor be the color the person has currently selected

* fix cursor on mobile (still won't display it in most cases as there is no hover on mobile but at least it won't throw errors)

* use correct size for cursor

* throttle cursor update rate to dramatically improve performance by eliminating congestion

* fix remote cursor size on desktop

* show own cursor by default and renove offset

* use svg as mouse cursor for pencil to be able to apply a reduced opacity to it and view our cursor

* don't throttle local cursor

* throttle local cursor at an independent higher rate. This could be made user adjustable for low power devices

* remove let and const from client-side code

* get emit count and emit count period from configuration

* reduce network cursor updates a lot to prevent instantly getting banned with the current defaults

* prevent eraser from deleting cursors

* use group inside of svg as drawing area and only delete elements inside it with the eraser

* use transform: translate to move cursors around instead of manipulating x and y directly

* fix: add socket ids to cursor messages

* fix incorrect remote cursor scaling and make local cursor visible again after it has been moved after being hidden due to inactivity

* create cursors in a proper fashion and keep them in a separate group

* scaling has been fixed in a1a5580

* move duplicated cursor creation code to function

* show cursors above content

* pass some of ther server configuration through to the client

* fix bug introduced in a833ce9

* allocate at most half of the allowed traffic to cursor updates

* remove debugging leftover

* use feature detection instead of ua sniffing

Co-Authored-By: Ophir LOJKINE <ophir.lojkine@auto-grid.com>

* fix regression where local cursor color was not updated on color change

* Define the cursor as a tool

* Remove the cursor tool from the UI

* Throttle remote cursor updates, not local ones

* Do not increment notification count on cursor move

* Use only one pencil icon

Use the same image for the pencil icon in the menu
and the pencil cursor that appears while drawing

* Add a test for the new cursor feature

* only stop drawing remote cursor when using some tools and always draw local cursor

* increase idle period before hiding cursor

* change idle duration back and set whether a cursor should be sent when using a tool in the respective tool

Co-authored-by: Robert Beach <rdbeach@gmail.com>
Co-authored-by: Ophir LOJKINE <ophir.lojkine@auto-grid.com>
Co-authored-by: ophir <pere.jobs@gmail.com>
2020-05-02 06:13:48 +02:00
ophir
2b64897733 Add an integration test 2020-04-27 23:50:15 +02:00