Releases: jspsych/jsPsych
@jspsych/[email protected]
Major Changes
- #3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
- #3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
- #3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
-
#2858
f90c0ef9
Thanks @bjoluc! - - Makebutton_html
a function parameter which, given a choice's text and its index, returns the HTML string of the choice's button. If you were previously passing a string tobutton_html
, like<button>%choice%</button>
, you can now pass the functionfunction (choice) { return '<button class="jspsych-btn">' + choice + "</button>"; }
Similarly, if you were using the array syntax, like
['<button class="a">%choice%</button>', '<button class="b">%choice%</button>', '<button class="a">%choice%</button>']
an easy way to migrate your trial definition is to pass a function which accesses your array and replaces the
%choice%
placeholder:function (choice, choice_index) { return ['<button class="a">%choice%</button>', '<button class="b">%choice%</button>', '<button class="a">%choice%</button>'][choice_index].replace("%choice%", choice); }
From there on, you can further simplify your function. For instance, if the intention of the above example is to have alternating button classes, the
button_html
function might be rewritten asfunction (choice, choice_index) { return '<button class="' + (choice_index % 2 === 0 ? "a" : "b") + '">' + choice + "</button>"; }
- Simplify the button DOM structure and styling: Buttons are no longer wrapped in individual container
div
s for spacing anddata-choice
attributes. Instead, each button is assigned itsdata-choice
attribute and all buttons are direct children of the button group containerdiv
. The containerdiv
, in turn, utilizes a flexbox layout to position the buttons.
- Simplify the button DOM structure and styling: Buttons are no longer wrapped in individual container
-
#3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
- #3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
- #3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
- #3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
- #3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
- #3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()
Minor Changes
@jspsych/[email protected]
Major Changes
-
#3152
2852cda6
Thanks @jodeleeuw! - Button plugins now support eitherdisplay: grid
ordisplay: flex
on the container element that hold the buttons. If the layout isgrid
, the number of rows and/or columns can be specified. Themargin_horizontal
andmargin_vertical
parameters have been removed from the button plugins. If you need control over the button CSS, you can add inline style to the button element using thebutton_html
parameter.jspsych.css has new layout classes to support this feature.
-
#2858
f90c0ef9
Thanks @bjoluc! - - Makebutton_html
a function parameter which, given a choice's text and its index, returns the HTML string of the choice's button. If you were previously passing a string tobutton_html
, like<button>%choice%</button>
, you can now pass the functionfunction (choice) { return '<button class="jspsych-btn">' + choice + "</button>"; }
Similarly, if you were using the array syntax, like
['<button class="a">%choice%</button>', '<button class="b">%choice%</button>', '<button class="a">%choice%</button>']
an easy way to migrate your trial definition is to pass a function which accesses your array and replaces the
%choice%
placeholder:function (choice, choice_index) { return ['<button class="a">%choice%</button>', '<button class="b">%choice%</button>', '<button class="a">%choice%</button>'][choice_index].replace("%choice%", choice); }
From there on, you can further simplify your function. For instance, if the intention of the above example is to have alternating button classes, the
button_html
function might be rewritten asfunction (choice, choice_index) { return '<button class="' + (choice_index % 2 === 0 ? "a" : "b") + '">' + choice + "</button>"; }
- Simplify the button DOM structure and styling: Buttons are no longer wrapped in individual container
div
s for spacing anddata-choice
attributes. Instead, each button is assigned itsdata-choice
attribute and all buttons are direct children of the button group containerdiv
. The containerdiv
, in turn, utilizes a flexbox layout to position the buttons.
- Simplify the button DOM structure and styling: Buttons are no longer wrapped in individual container
-
#3339
74b4adc7
Thanks @jodeleeuw! -finishTrial()
now clears the display and any timeouts set withpluginApi.setTimeout()