Update and load jsPsych plugins dynamically - #1900
Conversation
…s, not just contents
…a, add jspsych_plugins M2M field to Study model, update the jsPsych study template to load plugins dynamically, add migration for new jsPsych plugin gable and study field, which seeds plugin list and assigns all existing plugins to all existing jsPsych studies
…108 and fix dependencies
…e and contrib packages, update form formatting, add select all and clear all buttons plugin checkbox questions
…les, categorize as jspsych-library/chs-jspsych, add file_type and order fields to jsPsychPlugin model, add new file categories to jspsych study context and load dynamically from database
…e in model Meta class)
…om real class - fixes SonarQube issues
…ych/contrib/CHS plugins, adds optional plugins to all jsPsych studies, adds jspsych-library category, sets JSPsychPlugin name in model meta, removes (contrib) from contrib-category package names
…r seeded packages in migration, set default on obj save if field is empty (manual changes persist)
…em (not checkboxes)
…rmatting plugin labels with version and/or docs link; use label_html format for plugin checkbox labels and non-checkbox plugin list
…s (labels need to be linked to a specific input element, while legend is a label for multiple elements within the fieldset); update css to override style when legend is used as a form label (form-label class); tweak styles for consistency
…-style expand/collapse sections
… add btn-no-effects class for accordion section headings
…expand/collapse events
…, update seeded data with these fields
…sych plugins conditional on autoload:true, add autoloaded packages from other categories but exclude jspsych_library/chs_jspsych (need to keep categories separate to ensure everything loads in correct order), add loading in template for autoload plugins in other categories
…oloaded plugins from those checkbox options
…w_in_ui:true; add autoload plugins that are not included inthe jspsych_library/chs_jspsych categories to list in same section
…Psych core or CHS-jsPsych categories; list any individual plugins or data source elements that are part of the package as a sublist
…ew, JSPsychPlugin model, study-jsPsych plugin relationship
…mock boto3.client as we do in other tests, which also works)
|
The organization and hiding of options all looks great! Just some potential changes to the UI structure, which I think/hope only affects html tags:
Overall proposed layout and new text: jsPsych Experiment Code(Big box of code) jsPsych OptionsStudies created with jsPsych rely on some underlying THINGS which have to be loaded in order for your study to work properly. Some of these are needed for almost every study, but in general you want to minimize how many you include, because they increase website loading times. If you aren't sure yet which ones you'll need, leave these options alone for now. If you have a THING you want to use that you don't see listed below, please [standard contact method used in this part of the site?]. We can probably add it for you! See Automatically-Loaded THINGS >Select Optional THINGS >(those are smaller headers, probably left justified if I remember what the website looks like? And the same drop-down triangle & contents) |
mekline
left a comment
There was a problem hiding this comment.
Formatting/wording changes requested!
|
Thanks for the feedback @mekline! I see what you mean about the formatting and language. I know that "plugins/extensions" is clunky, but there's an important distinction from the researcher's point-of-view and the terms are not used interchangeably in jsPsych docs, so I decided to stick with that. We could also use "packages" or "files" for everything, but I think that's too vague, including for seasoned jsPsych users. How's this version? Both collapsed:
Auto-loaded file section expanded:
Optional file section expanded:
|
|






Fixes #1484
This PR implements the dynamic loading of jsPsych plugins from the database. The plugins are stored in a table with metadata: name, URL, integrity SHA, category, file type, whether or not it should be auto-loaded, whether or not it should be displayed on the jsPsych study edit form, documentation URL. This metadata allows us to auto-load the packages that are always necessary or that we decide to add for convenience, and to display the optional plugins according to category (CHS-jsPsych, core jsPsych, jsPsych-contrib) along with their version numbers and documentation links.
This change allows us to more easily add/update the available jsPsych plugins for researchers through the admin interface, without requiring any changes to the site code (which requires build/deploy and downtime). Plugins/extensions can be added/modified/removed at any time, which makes it much easier to add newly-requested plugins and get bug fixes out quickly.
This change also addresses the slow initial load issue as studies can opt-in to plugins, which means they're only loading the packages that they actually use.
The updated jsPsych study edit page now has two sections underneath the code editor:
These sections are automatically collapsed, so as not to be overwhelming, but can be expanded to see the details/options in each section.
For backwards-compatibility, existing jsPsych studies will automatically include all optional plugins/extensions. This ensures that existing studies don't break because they've lost access to an optional plugin/extension that was automatically available before. But new studies will not have any of the optional packages selected by default.
Screenshots
jsPsych study edit page
jsPsych study edit page - expanded "Automatically-Loaded Files" section
jsPsych study edit page - expanded "Select More Plugins and Extensions" section