HoshinoKoji/jsPsych
1
0
Fork 0
mirror of https://github.com/jspsych/jsPsych.git synced 2025-05-10 11:10:54 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix broken event handlers in sketchpad; change Array.from()

Browse Source
This commit is contained in:
Josh de Leeuw 2024-08-08 11:04:05 -04:00
parent a7eacb1e7c
commit 4b080ca4c5
2 changed files with 20 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/poor-singers-destroy.md Normal file
View File

@ -0,0 +1,5 @@
---
"@jspsych/plugin-sketchpad": patch
---
Fixed broken event handlers in the sketchpad plugin.

24
packages/plugin-sketchpad/src/index.ts
View File

@ -409,11 +409,11 @@ class SketchpadPlugin implements JsPsychPlugin<Info> {
}); });
} }
this.sketchpad.addEventListener("pointerdown", this.start_draw); this.sketchpad.addEventListener("pointerdown", this.start_draw.bind(this));
this.sketchpad.addEventListener("pointermove", this.move_draw); this.sketchpad.addEventListener("pointermove", this.move_draw.bind(this));
this.sketchpad.addEventListener("pointerup", this.end_draw); this.sketchpad.addEventListener("pointerup", this.end_draw.bind(this));
this.sketchpad.addEventListener("pointerleave", this.end_draw); this.sketchpad.addEventListener("pointerleave", this.end_draw.bind(this));
this.sketchpad.addEventListener("pointercancel", this.end_draw); this.sketchpad.addEventListener("pointercancel", this.end_draw.bind(this));
if (this.params.key_to_draw !== null) { if (this.params.key_to_draw !== null) {
document.addEventListener("keydown", (e) => { document.addEventListener("keydown", (e) => {
@ -452,16 +452,22 @@ class SketchpadPlugin implements JsPsychPlugin<Info> {
} }
if (this.params.show_undo_button) { if (this.params.show_undo_button) {
this.display.querySelector("#sketchpad-undo").addEventListener("click", this.undo); this.display.querySelector("#sketchpad-undo").addEventListener("click", this.undo.bind(this));
if (this.params.show_redo_button) { if (this.params.show_redo_button) {
this.display.querySelector("#sketchpad-redo").addEventListener("click", this.redo); this.display
.querySelector("#sketchpad-redo")
.addEventListener("click", this.redo.bind(this));
} }
} }
if (this.params.show_clear_button) { if (this.params.show_clear_button) {
this.display.querySelector("#sketchpad-clear").addEventListener("click", this.clear); this.display
.querySelector("#sketchpad-clear")
.addEventListener("click", this.clear.bind(this));
} }
const color_btns = Array.from(this.display.querySelectorAll(".sketchpad-color-select")); const color_btns = Array.prototype.slice.call(
this.display.querySelectorAll(".sketchpad-color-select")
);
for (const btn of color_btns) { for (const btn of color_btns) {
btn.addEventListener("click", (e) => { btn.addEventListener("click", (e) => {
const target = e.target as HTMLButtonElement; const target = e.target as HTMLButtonElement;