Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
decker
decker
Commits
31e8e7e2
Commit
31e8e7e2
authored
Jun 02, 2021
by
Mario Botsch
Browse files
next iteration of laser pointer handling
parent
03641e54
Changes
1
Hide whitespace changes
Inline
Side-by-side
resource/support/plugins/whiteboard/whiteboard.js
View file @
31e8e7e2
...
...
@@ -3,7 +3,7 @@
* A plugin for reveal.js to add slide annotations and a whiteboard.
*
* Original version by Asvin Goel, goel@telematique.eu (based on v 0.6)
* Modified version by Mario Botsch,
Bielefeld University
* Modified version by Mario Botsch,
TU Dortmund
* Further contributions by Martin Heistermann, Bern University
*
* License: MIT license
...
...
@@ -61,8 +61,13 @@ let RevealWhiteboard = (function () {
cursorCanvas
.
height
=
20
;
// store which tools are active
const
ToolType
=
{
PEN
:
1
,
ERASER
:
2
,
LASER
:
3
};
let
tool
=
ToolType
.
PEN
;
const
NOTHING
=
0
;
const
PEN
=
1
;
const
ERASER
=
2
;
const
LASER
=
3
;
const
TOGGLE_LASER
=
4
;
const
MOVE
=
5
;
let
tool
=
PEN
;
// variable used to block leaving HTML page
let
unsavedAnnotations
=
false
;
...
...
@@ -169,8 +174,8 @@ let RevealWhiteboard = (function () {
let
buttonPen
=
createButton
(
"
whiteboard fas fa-pen radiobutton
"
,
()
=>
{
if
(
tool
!=
ToolType
.
PEN
)
{
selectTool
(
ToolType
.
PEN
);
if
(
tool
!=
PEN
)
{
selectTool
(
PEN
);
}
else
{
if
(
colorPicker
.
style
.
visibility
==
"
visible
"
)
hideColorPicker
();
else
showColorPicker
();
...
...
@@ -182,7 +187,7 @@ let RevealWhiteboard = (function () {
let
buttonEraser
=
createButton
(
"
whiteboard fas fa-eraser radiobutton
"
,
()
=>
{
selectTool
(
ToolType
.
ERASER
);
selectTool
(
ERASER
);
},
false
,
"
eraser
"
...
...
@@ -190,7 +195,7 @@ let RevealWhiteboard = (function () {
let
buttonLaser
=
createButton
(
"
whiteboard fas fa-magic radiobutton
"
,
()
=>
{
selectTool
(
ToolType
.
LASER
);
selectTool
(
LASER
);
},
false
,
"
laser pointer/stroke
"
...
...
@@ -465,24 +470,32 @@ let RevealWhiteboard = (function () {
false
;
switch
(
tool
)
{
case
ToolType
.
PEN
:
case
PEN
:
buttonPen
.
dataset
.
active
=
true
;
buttonPen
.
style
.
color
=
penColor
;
selectCursor
(
penCursor
);
break
;
case
ToolType
.
ERASER
:
case
ERASER
:
buttonEraser
.
dataset
.
active
=
true
;
selectCursor
(
eraserCursor
);
break
;
case
ToolType
.
LASER
:
case
LASER
:
buttonLaser
.
dataset
.
active
=
true
;
selectCursor
(
laserCursor
);
break
;
}
}
/*
* switch between laser and pen
*/
function
toggleLaser
()
{
if
(
tool
==
LASER
)
selectTool
(
PEN
);
else
selectTool
(
LASER
);
}
function
showColorPicker
()
{
colorPicker
.
style
.
visibility
=
"
visible
"
;
}
...
...
@@ -1147,45 +1160,71 @@ let RevealWhiteboard = (function () {
* pointer and mouse callbacks
******************************************************************/
// need this to remember button state for pointerup event
let
buttonsPressed
=
null
;
function
pointerMode
(
evt
)
{
// target has to be SVG
if
(
evt
.
target
!=
svg
)
return
NOTHING
;
// no buttons -> mouse move
if
(
!
evt
.
buttons
)
return
MOVE
;
switch
(
evt
.
pointerType
)
{
case
"
pen
"
:
{
// button 2 -> toggle laser
if
(
evt
.
buttons
==
2
)
return
TOGGLE_LASER
;
// eraser selected && pen on wacom (button 1) -> eraser
if
(
tool
==
ERASER
&&
evt
.
buttons
==
1
)
return
ERASER
;
// eraser tip on wacom -> eraser
if
(
evt
.
buttons
>=
4
)
return
ERASER
;
// laser selected && pen on wacom (button 1) -> laser
if
(
tool
==
LASER
&&
evt
.
buttons
==
1
)
return
LASER
;
// pen selected && pen on wacom (button 1) -> pen
if
(
tool
==
PEN
&&
evt
.
buttons
==
1
)
return
PEN
;
break
;
}
case
"
mouse
"
:
{
// eraser selected && left mouse -> eraser
if
(
tool
==
ERASER
&&
evt
.
buttons
==
1
)
return
ERASER
;
// pen selected && middle mouse -> eraser
if
(
tool
==
PEN
&&
evt
.
buttons
==
4
)
return
ERASER
;
// laser selected && left mouse -> laser
if
(
tool
==
LASER
&&
evt
.
buttons
==
1
)
return
LASER
;
// pen selected && right mouse -> laser
if
(
tool
==
PEN
&&
evt
.
buttons
==
2
)
return
LASER
;
// pen selected && left mouse -> pen
if
(
tool
==
PEN
&&
evt
.
buttons
==
1
)
return
PEN
;
break
;
}
}
return
NOTHING
;
}
function
pointerdown
(
evt
)
{
// only when whiteboard is active
if
(
!
whiteboardActive
)
return
;
// event has to happen for SVG
if
(
evt
.
target
!=
svg
)
return
;
// only pen and mouse events
if
(
evt
.
pointerType
!=
"
pen
"
&&
evt
.
pointerType
!=
"
mouse
"
)
return
;
// remember button state
buttonsPressed
=
evt
.
buttons
;
// remove timer for cursor hiding
clearTimeout
(
hideCursorTimeout
);
switch
(
pointerMode
(
evt
))
{
case
TOGGLE_LASER
:
toggleLaser
();
return
killEvent
(
evt
);
// eraser mode or middle mouse button
if
(
tool
==
ToolType
.
ERASER
||
(
tool
==
ToolType
.
PEN
&&
evt
.
buttons
>=
4
))
{
showCursor
(
eraserCursor
);
eraseStroke
(
evt
);
return
killEvent
(
evt
);
}
case
ERASER
:
clearTimeout
(
hideCursorTimeout
);
showCursor
(
eraserCursor
);
eraseStroke
(
evt
);
return
killEvent
(
evt
);
// laser mode or right mouse button
if
(
tool
==
ToolType
.
LASER
||
(
tool
==
ToolType
.
PEN
&&
evt
.
buttons
&
2
))
{
isLaserStroke
=
true
;
hideCursor
();
startStroke
(
evt
);
return
killEvent
(
evt
);
}
case
LASER
:
clearTimeout
(
hideCursorTimeout
);
hideCursor
();
isLaserStroke
=
true
;
startStroke
(
evt
);
return
killEvent
(
evt
);
// pencil mode
if
(
tool
==
ToolType
.
PEN
)
{
hideCursor
();
startStroke
(
evt
);
return
killEvent
(
evt
);
case
PEN
:
clearTimeout
(
hideCursorTimeout
);
hideCursor
();
startStroke
(
evt
);
return
killEvent
(
evt
);
}
}
...
...
@@ -1193,59 +1232,49 @@ let RevealWhiteboard = (function () {
// only when whiteboard is active
if
(
!
whiteboardActive
)
return
;
// event has to happen for SVG
if
(
evt
.
target
!=
svg
)
return
;
// only pen and mouse events
if
(
evt
.
pointerType
!=
"
pen
"
&&
evt
.
pointerType
!=
"
mouse
"
)
return
;
// no mouse button pressed -> show cursor, active auto-hide, return
if
(
!
evt
.
buttons
)
{
showCursor
();
triggerHideCursor
();
return
;
}
switch
(
pointerMode
(
evt
))
{
case
MOVE
:
showCursor
();
triggerHideCursor
();
return
;
// eraser mode or middle mouse button
if
(
tool
==
ToolType
.
ERASER
||
(
tool
==
ToolType
.
PEN
&&
evt
.
buttons
>=
4
))
{
eraseStroke
(
evt
);
return
killEvent
(
evt
);
}
case
ERASER
:
eraseStroke
(
evt
);
return
killEvent
(
evt
);
// laser mode or right mouse button
if
(
tool
==
ToolType
.
LASER
||
(
tool
==
ToolType
.
PEN
&&
evt
.
buttons
&
2
))
{
isLaserStroke
=
true
;
continueStroke
(
evt
);
return
killEvent
(
evt
);
}
case
LASER
:
isLaserStroke
=
true
;
continueStroke
(
evt
);
return
killEvent
(
evt
);
// pencil mode
if
(
tool
==
ToolType
.
PEN
)
{
continueStroke
(
evt
);
return
killEvent
(
evt
);
case
PEN
:
continueStroke
(
evt
);
return
killEvent
(
evt
);
}
}
function
pointerup
(
evt
)
{
// only when whiteboard is active
if
(
!
whiteboardActive
)
return
;
// event has to happen for SVG
if
(
evt
.
target
!=
svg
)
return
;
// only pen and mouse events
if
(
evt
.
pointerType
!=
"
pen
"
&&
evt
.
pointerType
!=
"
mouse
"
)
return
;
// finish pen stroke
if
(
tool
==
ToolType
.
PEN
)
{
stopStroke
(
evt
);
selectCursor
(
penCursor
);
}
if
(
stroke
)
stopStroke
(
evt
);
// finish laser stroke
if
(
tool
==
ToolType
.
LASER
)
{
stopStroke
(
evt
);
selectCursor
(
laserCursor
);
// select cursor based on tool (NOT pointerMode!)
switch
(
tool
)
{
case
PEN
:
selectCursor
(
penCursor
);
break
;
case
LASER
:
selectCursor
(
laserCursor
);
break
;
case
ERASER
:
selectCursor
(
eraserCursor
);
break
;
}
// re-activate cursor hiding
...
...
@@ -1424,6 +1453,11 @@ let RevealWhiteboard = (function () {
clearSlide
);
Reveal
.
addKeyBinding
(
{
keyCode
:
76
,
key
:
"
L
"
,
description
:
"
Whiteboard: Toggle laser pointer
"
},
toggleLaser
);
Reveal
.
addKeyBinding
(
{
keyCode
:
87
,
key
:
"
W
"
,
description
:
"
Whiteboard: Toggle on/off
"
},
toggleWhiteboard
...
...
@@ -1472,7 +1506,7 @@ let RevealWhiteboard = (function () {
// set default state
toggleWhiteboard
(
false
);
selectTool
(
ToolType
.
PEN
);
selectTool
(
PEN
);
selectPenColor
(
penColors
[
0
]);
selectPenRadius
(
2
);
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment