Commit graph

236 commits

Author SHA1 Message Date
DanielHabenicht
613cfc3246 remove style nodes for svg drawing 2021-05-27 16:37:49 +00:00
DanielHabenicht
f84950c744 resize svg stroke 2021-05-27 16:37:27 +00:00
DanielHabenicht
8850dc2f49 resolve ellipse comment 2021-05-27 15:56:17 +00:00
DanielHabenicht
991c37dc56 Merge branch 'download-button' of https://github.com/ChaituVR/whitebophir into download 2021-05-26 10:40:45 +00:00
Ophir LOJKINE
91273404f7
Merge pull request #193 from sents/selector
Replace mover tool by selector tool
2021-05-24 09:50:06 +02:00
Finn Krein
16d1140a0d Remove unneeded css for selectionRect 2021-05-24 09:27:49 +02:00
Ophir LOJKINE
22e866b8aa Remove unused functions 2021-05-23 23:53:14 +02:00
Ophir LOJKINE
d279041aec fix indentation 2021-05-23 23:51:24 +02:00
Finn Krein
e6e47ebef9 Make menu draggable 2021-05-23 22:34:49 +02:00
Finn Krein
9e1bfffa80 Make selector rect stroke width non-scaling 2021-05-21 23:56:05 +02:00
Finn Krein
e5e43b87c6 Make batch messages consistent. 2021-05-21 18:48:34 +02:00
Finn Krein
6bbb8c8d60 Add selector tool 2021-05-21 18:48:25 +02:00
lovasoa
e5673060ad
board names are case sensitive
@nneka-nu : please do not change that again

Windows has case-insensitive file names by default,
but wbo itself handles boards with case differences correctly.
If you are using wbo on windows (which I do not recommend),
please set the case sensitivity flag of the folder where you store boards.
Alternatively, use WSL or Docker.
2021-04-02 09:18:41 +02:00
Nneka
89f2ef8e8c fix translations 2021-04-01 18:46:24 -07:00
lovasoa
b0a428ab29
Convert to old javascript for compatibility 2021-04-01 20:40:55 +02:00
Nneka
4439457520 add list of recent boards to home page 2021-04-01 09:09:38 -07:00
Russ Tedrake
d5111afdc8 Adds support for query parameter "hideMenu"
This adds the ability to load a board with the menu hidden; it provides a form of "read-only" mode, but the key bindings are still active.
Use with, e.g.:
http://localhost:5001/boards/qYAZyGdym6HqjnfaGI4yNtpdx0IMHd9qp6kaJPwbJqE-?hideMenu=true

The alternative, proposed in #116, was to remove the menu completely, but this would require more substantial changes to board.js (which hangs on "Loading..." if the menu is removed).
Related to #150
Related to #116

Adds support for query parameter "hideMenu"

This adds the ability to load a board with the menu hidden; it provides a form of "read-only" mode, but the key bindings are still active.
Use with, e.g.:
http://localhost:5001/boards/qYAZyGdym6HqjnfaGI4yNtpdx0IMHd9qp6kaJPwbJqE-?hideMenu=true

The alternative, proposed in #116, was to remove the menu completely, but this would require more substantial changes to board.js (which hangs on "Loading..." if the menu is removed).
Related to #150
Related to #116
2021-02-17 08:35:22 -05:00
Ophir LOJKINE
5bc3f02dae Revert "Adds support for query parameter "hideMenu" (#170)"
This reverts commit 71d8be5df1.
2021-02-17 12:09:41 +01:00
Russ Tedrake
71d8be5df1
Adds support for query parameter "hideMenu" (#170)
This adds the ability to load a board with the menu hidden; it provides a form of "read-only" mode, but the key bindings are still active.
Use with, e.g.:
http://localhost:5001/boards/qYAZyGdym6HqjnfaGI4yNtpdx0IMHd9qp6kaJPwbJqE-?hideMenu

The alternative, proposed in #116, was to remove the menu completely, but this would require more substantial changes to board.js (which hangs on "Loading..." if the menu is removed).
Related to #150
Related to #116
2021-02-17 12:05:38 +01:00
Ilya Shabalin
89faff35b6
Remember and restore white-out size (#166)
There is now a separate size for the main pencil and the whiteout tool. This is helpful when using "White-Out" as an eraser and switching frequently, as one typically wants eraser to have larger radius.

* Remember and restore white-out size

* Isolate size toggle in pencil.js

* Undo toggle back to Pencil on tool change, replace Pencil size concept with Drawing size

Co-authored-by: ishabalin <ishabalin@apple.com>
2021-02-08 11:35:09 +01:00
Ilya Shabalin
edf31cd6c2
Auto white-out with a finger when using apple stylus (#167)
When using an iPad with an apple stylus, finger touches now trigger the whiteout tool.
This behavior can be disabled by setting the environment variable AUTO_FINGER_WHITEOUT=disabled

* Auto white-out with a finger when using stylus

* Add AUTO_FINGER_WHITEOUT config variable

* Use local variable to remember if stylus was used and make behavior configurable

* Delete "stylus" property

* Make AUTO_FINGER_WHITEOUT on by default

Co-authored-by: Ophir LOJKINE <pere.jobs@gmail.com>

* Delete parseBool, add note about iPad/Pencil

Co-authored-by: ishabalin <ishabalin@apple.com>
Co-authored-by: Ophir LOJKINE <pere.jobs@gmail.com>
2021-02-08 11:28:24 +01:00
ophir
a1dfb9871d Fix cropped language selection menu 2021-01-31 17:06:24 +01:00
ophir
244eaf3895 formatting 2021-01-10 21:25:12 +01:00
ophir
6e8d99d57a Better zooming and scrooling experience 2021-01-10 20:52:15 +01:00
ophir
a10347695b prevent zooming out further than the whole canvas 2021-01-10 20:22:46 +01:00
ophir
69db0af4c2 remove useless function call 2021-01-10 20:11:34 +01:00
ophir
4069cb88d7 Fix a comment 2021-01-10 19:59:50 +01:00
ophir
233d756cc7 Use the server's global max_board_size on the client 2021-01-10 19:58:11 +01:00
ophir
fe6ab2bdaa Use mouse wheel to zoom by default
The old behavior was wheel to scroll and ctrl+wheel to zoom.
The new behavior is the opposite.
2021-01-10 19:45:43 +01:00
lovasoa
7df603c249
index: Display an error on empty board name 2020-11-28 21:39:39 +01:00
jamesdeacon
96414aa2f1
Added secondary tool icon (#141)
* Added secondary tool icon

* Create secondary icon in html instead of js

* Revert change to handlebars integrity

* revert package.lock changes

* revert package.lock changes

* Set styles in css instead of js+html

Co-authored-by: James Deacon <james@volute.co.uk>
Co-authored-by: Ophir LOJKINE <pere.jobs@gmail.com>
Co-authored-by: Ophir LOJKINE <ophir.lojkine@auto-grid.com>
2020-10-14 23:35:14 +02:00
Chaitanya Raju
a33e557c79 Download Svg Button 2020-08-22 18:29:31 +05:30
David Roundy
407538af96
make pencil more responsive, and even more so if the server throttles its input less (addresses #81) (#114) 2020-08-11 18:00:08 +02:00
David Roundy
245e8fbffe
rename MAX_CURSOR_UPDATES_INTERVAL_MS to MIN_CURSOR_UPDATES_INTERVAL_MS since it is the minimum interval, not the maximum (#113) 2020-08-11 17:38:49 +02:00
Ophir LOJKINE
a6eba9b293 Fix #107 2020-07-27 12:11:27 +02:00
Ophir LOJKINE
7777c5bb42 Add apple-touch-icon-precomposed.png 2020-06-23 18:36:51 +02:00
Ophir LOJKINE
50da719bda
Move (#97)
* Add mover skeleton

Atm it is just the eraser with new icons and renamed variables

* The mover not detect the object to move

* We can move ellipses and rectangles

* The mover now moves all types of objects

* Add the move everything functionality

* Aesthetic changes

* Replace the use of const and let with classic var

* Undo few commits

* Start the transform-translate implementation

* Mover now moves with transform translate

* Put the function to get the translation matrix in the Tools

* Shapes (ellipse, line, pencil, rect, and text) now properly load translate coords

* Add the transform-translate to the createSVG functions

* Done movement using transform-translate

* Fix parenthesization bug in the SVG create

* Fix comment about mover states

* Undo translation loading from Ellipse, Mover, Pencil, and Text tools

* Makes the board send update message to the mover as needed

* Remove the old code from the line tool too

* Simplify the mover tool

See #86

* update the mover icon

* Merge the mover and the hand tools

* Improve preview for pre-rendered elements

* v1.6.0

Co-authored-by: Paolo Bolzoni <paolo.bolzoni1@studenti.unipr.it>
2020-06-21 23:48:32 +02:00
ophir
b77d26a9e8 Add a square as a secondary tool for the rectangle 2020-05-14 00:02:14 +02:00
ophir
de973e0a05 Improve the straight line tool
The straight line tool can now draw "sticky" lines
which have a vertical angle that is a multiple of 2pi/16
2020-05-13 23:39:16 +02:00
finnboeger
740246528f
Add a whiteout tool as the secondary function of the pencil tool (#47)
* added whiteout icon made by Freeplk on flaticon.com

* added whiteout fluid icon (public domain).

* Added whiteout tool as secondary function of pencil tool.

Co-authored-by: Robert Beach <rdbeach@gmail.com>

* shrink icon width using stroke

* shrink whiteout icon properly

* shrink whiteout fluid icon

* reduce number of allowed messages

* simplify

* remove layer code

* renmove show/hide marker code

* change white to #ffffff

* make toggle function compatible with current implementation

* Revert changes unrelated to the whiteout tool

* Refactor secondary tool logic between ellipse and pencil

* Add translations for the whiteout pen

* Fix tests

Co-authored-by: Robert Beach <rdbeach@gmail.com>
Co-authored-by: ophir <pere.jobs@gmail.com>

(@rdbeach)
2020-05-13 22:15:11 +02:00
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
finnboeger
edace1c293
add option to block tools (#66)
* add option to block tools

* use tool name instead of computing an id

Co-authored-by: Ophir LOJKINE <ophir.lojkine@auto-grid.com>

* require comma separated list as input of blocked tools environment variable

Co-authored-by: Ophir LOJKINE <ophir.lojkine@auto-grid.com>

* Log attempts to use blocked tools

Co-authored-by: Ophir LOJKINE <ophir.lojkine@auto-grid.com>

* fix syntax

* require tool names to not have a comma in them

* Update server/configuration.js

Co-authored-by: Ophir LOJKINE <pere.jobs@gmail.com>
2020-05-08 12:19:52 +02:00
Ophir LOJKINE
710c13acf4 Fix meta description 2020-05-05 15:23:52 +02:00
finnboeger
57a02c42d6
Improve compatibility with Internet Explorer (#63)
* include promise polyfill

* remove es6

* add viewBox to every icon

* change self closing to explicitly closing tags

* replace window.scroll.. with document.documentElement.scroll..

* verify document.activeElement.blur() is a function before calling

* fix visuals of color chooser (colorpicker still sometimes buggy)

* do not attach to mouseleave event in IE

* attempt removal with usecapture true in IE as well, this fixes the tool switching issue

* fix text tool for IE

* fix cursor for IE

* change curMode to boolean and rename to 'active'

* replace minified canvascolor with unminified code

* replace if else structure with switch statement

* compile polyfill for each browser individually

* remove static polyfills from board.js

* Fix broken js reference

* Fix unused variable and empty console log

* Allow serving non-minified polyfills for easier debugging

* Add proper caching for polyfill.js

This request is on the critical path, we should try to make it fast

* Include more polyfills

All the DOM polyfills were missing

* Update dependencies

* Add missing polyfill

Our custom polyfill was deleted, but the one from polyfill-library hadn't been added

* Remove feature detection for Node.contains

We now have the function in the polyfills

* Update polyfill caching logic

* Remove content-Length header

Co-authored-by: @lovasoa
2020-05-05 12:01:46 +02:00
finnboeger
1eecf2a6ef
move pattern definition back into js (#64) 2020-05-04 09:51:40 +02:00
finnboeger
efe4b38b7d
Add a grid (#61)
* Add oneTouch option when creating tool. These tools won't be selected, rather their onstart action will be executed once.

Useful for undo/redo/clear/upload/zoom-in/zoom-out

* added grid

* move pattern to dedicated file

* Reformat code in grid tool

* Restore the gradient over the active tool

* Remove some duplicated code in oneTouch handling

Co-authored-by: Robert Beach <rdbeach@gmail.com>
Co-authored-by: Ophir LOJKINE <pere.jobs@gmail.com>
2020-05-03 19:09:14 +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
Ophir LOJKINE
66646e6877 Index: change footer and add instagram link 2020-05-02 18:10:10 +02:00
finnboeger
b9605acb87
Add option to change pen size with the scroll wheel (#54)
* add option to change pen size with the scroll wheel

* Update the cursor size immediately when changing the size

* Add a tooltip with the size change shortcut

Co-authored-by: ophir <pere.jobs@gmail.com>
2020-05-02 16:27:28 +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