jsPsych icon indicating copy to clipboard operation
jsPsych copied to clipboard

Slider responses using keyboard keys

Open Max-Lovell opened this issue 2 years ago • 2 comments

Hi,

So I'm running an experiment that asks participants to press one of two keys to indicate which of two stimuli is the target stim, and then to give a confidence response on a slider, which in JsPsych requires the user to click. I think responses would be much quicker and user friendly if they could just give responses for a slider on a keyboard.

I've got a working example of how this can look using vanilla javascript here: https://jsfiddle.net/vjs4ykb8/

I'd like to add this feature to an experiment I'm currently running, would this be doable by editing a JsPsych plugin myself, do you think?

Thanks!

Max-Lovell avatar Apr 04 '22 11:04 Max-Lovell

Hi @Max-Lovell,

That's a great idea. I'd be open to adding this as a parameter for all slider plugins. I think it should be quite doable by editing the existing plugins.

jodeleeuw avatar Apr 07 '22 14:04 jodeleeuw

thanks @jodeleeuw, implementation that can sit anywhere in the main body of the html-slider-response plugin is below, with enter key triggering submit too:

    document.addEventListener('keydown', key_listener)
    function key_listener(e){
      if(["1","2","3","4","5","6"].includes(e.key)){
        display_element.querySelector('#jspsych-html-slider-response-response').value = e.key
        display_element.querySelector('#jspsych-html-slider-response-next').disabled = false;
      } else if(e.key==="Enter" && display_element.querySelector('#jspsych-html-slider-response-next').disabled === false){
        display_element.querySelector('#jspsych-html-slider-response-next').click()
      }
    }

and the event listener is then removed in the next button click event handler.

Max-Lovell avatar Apr 20 '22 14:04 Max-Lovell