psychopy.org | Reference | Downloads | Github

Accents in onscreen user keyboard input

URL of experiment: https://pavlovia.org/run/marie.cote/morphologie/html/
Source: https://gitlab.pavlovia.org/marie.cote/morphologie/

Description of the problem: I have a code component that allows the user’s keyboard input to appear onscreen. On the builder, it works like a charm. On Internet, though, only numbers and lower case letters appear. That means no capital letters, no special characters and, what really bothers me, no accents. My experiment is in French, so I REALLY need characters like “é”, “à”, “î”, etc. I saw a post about accents (Including utf-8/unicode characters in online experiments), and someone suggested to add <meta charset=“utf-8”> to the index.html file, but it’s already there. And I’m not trying to get accents in a results file, but directly online, onscreen, during the experiment.

So my question is : does PsychoPy/Pavlovia allows what I want? If so, how can I achieve this?

Thanks!

The fact that you’ve done this in a Code Component in the Python, means that you’d need a similar facility in JavsScript. I don’t know it off the top of my head but I think something in Pixi will work (that’s the library that we use for the stimulus rendering in JS).

From a google it looks like you need to create a function that runs on a uniCharCode event:
https://www.w3schools.com/jsref/event_key_which.asp

I dare say we will add functions to PsychoPy/PsychoJS to make this easier but, right now, in both cases it is a matter of custom code right now.

I’ve already wrote the equivalent Python code in JavaScript, using uniCharCode, etc., but this is not my current problem…

My problem is that it’s only in Psychopy (builder or coder) that the detection of the key I’m pressing is accurate according to my keyboard settings. On the web, the experiment registers something else.

Example:

  1. I’m pressing “é” while running my experiment with the builder. “é” appears onscreen (yay!). I go look in the data file generated : “é” is recorded in the keys pressed.
  2. I’m pressing “é” while running my experiment online. Nothing appears onscreen. I go look in the data file generated : “slash” is recorded in the keys pressed. Slash is truly the symbol written on the key I’m pressing on my physical keyboard. But with my current keyboard settings, this key is supposed to be an “é”. My problem is that I can’t just write a line of code stating that “slash” equals “é” since some users may have other keyboard settings!

So, how can I get my online experiment to reflects keys according to the user’s keyboard settings, and not the “default” keyboard settings?

I found the problem… It’s in the way PsychoJS, and more specifically EventManager, is coded (https://github.com/psychopy/psychojs/blob/master/js/core/EventManager.js). There simply is no accented characters recognized by PsychoJS, that’s why they don’t appear in my online experiment.

Is this easy for the developers to fix? 'cause it’s really restrictive for people making experiments in languages other than English… :frowning:

Thanks for looking into this. Not that I understand much of that code, but it does look like it only falls back on a restricted set of keys if the browser doesn’t support certain features.

Would you mind testing what key is detected at https://w3c.github.io/uievents/tools/key-event-viewer.html when you push é, just to confirm that this isn’t a browser limitation?

Of course! Here you go:

OK, so not a browser limitation then.

This JavaScript issue is certainly beyond me, though: would need input from the expert, Alain @apitiot

Please, @apitiot?