1
0
mirror of https://github.com/psychopy/psychojs.git synced 2025-05-12 08:38:10 +00:00

Merge pull request #252 from thewhodidthis/bf#215--css-escape

core/GUI: refactor CSS naming of dialog box input elements
This commit is contained in:
Alain Pitiot 2021-02-20 08:53:24 +01:00 committed by GitHub
commit 6c293c1cbd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -133,10 +133,13 @@ export class GUI
// add a combobox or text areas for each entry in the dictionary:
htmlCode += '<form>';
for (const key in dictionary)
// These may include Symbols as opposed to when using a for...in loop,
// but only strings are allowed in PsychoPy
Object.keys(dictionary).forEach((key, keyIdx) =>
{
const value = dictionary[key];
const keyId = CSS.escape(key) + '_id';
const keyId = 'form-input-' + keyIdx;
// only create an input if the key is not in the URL:
let inUrl = false;
@ -158,7 +161,7 @@ export class GUI
// if the field is required:
if (key.slice(-1) === '*')
{
self._requiredKeys.push(key);
self._requiredKeys.push(keyId);
}
// if value is an array, we create a select drop-down menu:
@ -190,6 +193,7 @@ export class GUI
}
}
}
);
htmlCode += '</form>';
@ -215,15 +219,15 @@ export class GUI
// setup change event handlers for all required keys:
for (const key of this._requiredKeys)
this._requiredKeys.forEach((keyId) =>
{
const keyId = CSS.escape(key) + '_id';
const input = document.getElementById(keyId);
if (input)
{
input.oninput = (event) => GUI._onKeyChange(self, event);
}
}
);
// init and open the dialog box:
self._dialogComponent.button = 'Cancel';
@ -256,14 +260,16 @@ export class GUI
{
// update dictionary:
for (const key in dictionary)
Object.keys(dictionary).forEach((key, keyIdx) =>
{
const input = document.getElementById(CSS.escape(key) + "_id");
const input = document.getElementById('form-input-' + keyIdx);
if (input)
{
dictionary[key] = input.value;
}
}
);
self._dialogComponent.button = 'OK';
$("#expDialog").dialog('close');