HoshinoKoji/jsPsych
1
0
Fork 0
mirror of https://github.com/jspsych/jsPsych.git synced 2025-05-12 08:38:11 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity
824060f80c
jsPsych/6.3/core_library/jspsych-core/index.html

3870 lines
119 KiB
HTML
Executable File
Raw Blame History

<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="icon" href="../../img/jspsych-favicon.png">
<meta name="generator" content="mkdocs-1.2.2, mkdocs-material-7.2.4">
<title>jsPsych - jsPsych</title>
<link rel="stylesheet" href="../../assets/stylesheets/main.f7f47774.min.css">
<link rel="stylesheet" href="../../assets/stylesheets/palette.3f5d1f46.min.css">
<meta name="theme-color" content="#4cae4f">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700%7CRoboto+Mono&display=fallback">
<style>:root{--md-text-font-family:"Roboto";--md-code-font-family:"Roboto Mono"}</style>
<script>window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)},ga.l=+new Date,ga("create","UA-50563838-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview"),document.addEventListener("DOMContentLoaded",function(){document.forms.search&&document.forms.search.query.addEventListener("blur",function(){var e;this.value&&(e=document.location.pathname,ga("send","pageview",e+"?q="+this.value))}),"undefined"!=typeof location$&&location$.subscribe(function(e){ga("send","pageview",e.pathname)})})</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
<body dir="ltr" data-md-color-scheme="" data-md-color-primary="green" data-md-color-accent="orange">
<script>function __prefix(e){return new URL("../..",location).pathname+"."+e}function __get(e,t=localStorage){return JSON.parse(t.getItem(__prefix(e)))}</script>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" for="__drawer"></label>
<div data-md-component="skip">
<a href="#the-jspsych-core-library" class="md-skip">
Skip to content
</a>
</div>
<div data-md-component="announce">
</div>
<header class="md-header" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="jsPsych" class="md-header__button md-logo" aria-label="jsPsych" data-md-component="logo">
<img src="../../img/jspsych-logo-no-text-mono.svg" alt="logo">
</a>
<label class="md-header__button md-icon" for="__drawer">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 6h18v2H3V6m0 5h18v2H3v-2m0 5h18v2H3v-2z"/></svg>
</label>
<div class="md-header__title" data-md-component="header-title">
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
jsPsych
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
<span class="md-ellipsis">
jsPsych
</span>
</div>
</div>
</div>
<label class="md-header__button md-icon" for="__search">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5z"/></svg>
</label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" aria-label="Search" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="search-query" required>
<label class="md-search__icon md-icon" for="__search">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12z"/></svg>
</label>
<nav class="md-search__options" aria-label="Search">
<button type="reset" class="md-search__icon md-icon" aria-label="Clear" tabindex="-1">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"/></svg>
</button>
</nav>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="search-result">
<div class="md-search-result__meta">
Initializing search
</div>
<ol class="md-search-result__list"></ol>
</div>
</div>
</div>
</div>
</div>
<div class="md-header__source">
<a href="https://github.com/jspsych/jsPsych/" title="Go to repository" class="md-source" data-md-component="source">
<div class="md-source__icon md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M439.55 236.05 244 40.45a28.87 28.87 0 0 0-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 0 1-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 0 0 0 40.81l195.61 195.6a28.86 28.86 0 0 0 40.8 0l194.69-194.69a28.86 28.86 0 0 0 0-40.81z"/></svg>
</div>
<div class="md-source__repository">
jspsych/jspsych
</div>
</a>
</div>
</nav>
</header>
<div class="md-container" data-md-component="container">
<main class="md-main" data-md-component="main">
<div class="md-main__inner md-grid">
<div class="md-sidebar md-sidebar--primary" data-md-component="sidebar" data-md-type="navigation" >
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="jsPsych" class="md-nav__button md-logo" aria-label="jsPsych" data-md-component="logo">
<img src="../../img/jspsych-logo-no-text-mono.svg" alt="logo">
</a>
jsPsych
</label>
<div class="md-nav__source">
<a href="https://github.com/jspsych/jsPsych/" title="Go to repository" class="md-source" data-md-component="source">
<div class="md-source__icon md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M439.55 236.05 244 40.45a28.87 28.87 0 0 0-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 0 1-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 0 0 0 40.81l195.61 195.6a28.86 28.86 0 0 0 40.8 0l194.69-194.69a28.86 28.86 0 0 0 0-40.81z"/></svg>
</div>
<div class="md-source__repository">
jspsych/jspsych
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../.." class="md-nav__link">
Introduction
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_2" type="checkbox" id="__nav_2" >
<label class="md-nav__link" for="__nav_2">
Tutorials
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Tutorials" data-md-level="1">
<label class="md-nav__title" for="__nav_2">
<span class="md-nav__icon md-icon"></span>
Tutorials
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../tutorials/hello-world/" class="md-nav__link">
The Basics: Hello World
</a>
</li>
<li class="md-nav__item">
<a href="../../tutorials/rt-task/" class="md-nav__link">
Demo Experiment: Simple Reaction Time Task
</a>
</li>
<li class="md-nav__item">
<a href="../../tutorials/video-tutorials/" class="md-nav__link">
Video Tutorials
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_3" type="checkbox" id="__nav_3" >
<label class="md-nav__link" for="__nav_3">
Overview
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Overview" data-md-level="1">
<label class="md-nav__title" for="__nav_3">
<span class="md-nav__icon md-icon"></span>
Overview
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../overview/timeline/" class="md-nav__link">
Creating an Experiment: The Timeline
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/plugins/" class="md-nav__link">
Plugins
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/dynamic-parameters/" class="md-nav__link">
Dynamic Parameters
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/style/" class="md-nav__link">
Controlling Visual Appearance
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/data/" class="md-nav__link">
Data Storage, Aggregation, and Manipulation
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/running-experiments/" class="md-nav__link">
Running Experiments
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/experiment-options/" class="md-nav__link">
Experiment Settings
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/callbacks/" class="md-nav__link">
Event-related Callback Functions
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/record-browser-interactions/" class="md-nav__link">
Record Browser Interactions
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/media-preloading/" class="md-nav__link">
Media Preloading
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/fullscreen/" class="md-nav__link">
Fullscreen Experiments
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/eye-tracking/" class="md-nav__link">
Eye Tracking
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/exclude-browser/" class="md-nav__link">
Exclude Participants Based on Browser Features
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/progress-bar/" class="md-nav__link">
Automatic Progress Bar
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/prolific/" class="md-nav__link">
Integrating with Prolific
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/mturk/" class="md-nav__link">
Integrating with Mechanical Turk
</a>
</li>
<li class="md-nav__item">
<a href="../../overview/browser-device-support/" class="md-nav__link">
Browser and Device Support
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--active md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_4" type="checkbox" id="__nav_4" checked>
<label class="md-nav__link" for="__nav_4">
Reference
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Reference" data-md-level="1">
<label class="md-nav__title" for="__nav_4">
<span class="md-nav__icon md-icon"></span>
Reference
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item md-nav__item--active">
<input class="md-nav__toggle md-toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
jsPsych
<span class="md-nav__icon md-icon"></span>
</label>
<a href="./" class="md-nav__link md-nav__link--active">
jsPsych
</a>
<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
<label class="md-nav__title" for="__toc">
<span class="md-nav__icon md-icon"></span>
Table of contents
</label>
<ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
<li class="md-nav__item">
<a href="#jspsychaddnodetoendoftimeline" class="md-nav__link">
jsPsych.addNodeToEndOfTimeline
</a>
<nav class="md-nav" aria-label="jsPsych.addNodeToEndOfTimeline">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychalltimelinevariables" class="md-nav__link">
jsPsych.allTimelineVariables
</a>
<nav class="md-nav" aria-label="jsPsych.allTimelineVariables">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_1" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_1" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_1" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_1" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychcurrenttimelinenodeid" class="md-nav__link">
jsPsych.currentTimelineNodeID
</a>
<nav class="md-nav" aria-label="jsPsych.currentTimelineNodeID">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_2" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_2" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_2" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_2" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychcurrenttrial" class="md-nav__link">
jsPsych.currentTrial
</a>
<nav class="md-nav" aria-label="jsPsych.currentTrial">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_3" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_3" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_3" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_3" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychendcurrenttimeline" class="md-nav__link">
jsPsych.endCurrentTimeline
</a>
<nav class="md-nav" aria-label="jsPsych.endCurrentTimeline">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_4" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_4" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_4" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_4" class="md-nav__link">
Example
</a>
<nav class="md-nav" aria-label="Example">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#end-timeline-if-a-particular-key-is-pressed" class="md-nav__link">
End timeline if a particular key is pressed
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychendexperiment" class="md-nav__link">
jsPsych.endExperiment
</a>
<nav class="md-nav" aria-label="jsPsych.endExperiment">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_5" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_5" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_5" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_5" class="md-nav__link">
Example
</a>
<nav class="md-nav" aria-label="Example">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#end-the-experiment-if-a-particular-response-is-given" class="md-nav__link">
End the experiment if a particular response is given
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychfinishtrial" class="md-nav__link">
jsPsych.finishTrial
</a>
<nav class="md-nav" aria-label="jsPsych.finishTrial">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_6" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_6" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_6" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_6" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychgetdisplayelement" class="md-nav__link">
jsPsych.getDisplayElement
</a>
<nav class="md-nav" aria-label="jsPsych.getDisplayElement">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_7" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_7" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_7" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_7" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychgetprogressbarcompleted" class="md-nav__link">
jsPsych.getProgressBarCompleted
</a>
<nav class="md-nav" aria-label="jsPsych.getProgressBarCompleted">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_8" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_8" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_8" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_8" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychinit" class="md-nav__link">
jsPsych.init
</a>
<nav class="md-nav" aria-label="jsPsych.init">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_9" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_9" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_9" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_9" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychinitsettings" class="md-nav__link">
jsPsych.initSettings
</a>
<nav class="md-nav" aria-label="jsPsych.initSettings">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_10" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_10" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_10" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_10" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychpauseexperiment" class="md-nav__link">
jsPsych.pauseExperiment
</a>
<nav class="md-nav" aria-label="jsPsych.pauseExperiment">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_11" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_11" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_11" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_11" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychprogress" class="md-nav__link">
jsPsych.progress
</a>
<nav class="md-nav" aria-label="jsPsych.progress">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_12" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_12" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_12" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_12" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychresumeexperiment" class="md-nav__link">
jsPsych.resumeExperiment
</a>
<nav class="md-nav" aria-label="jsPsych.resumeExperiment">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_13" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_13" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_13" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_13" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychsetprogressbar" class="md-nav__link">
jsPsych.setProgressBar
</a>
<nav class="md-nav" aria-label="jsPsych.setProgressBar">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_14" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_14" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_14" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_14" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychstarttime" class="md-nav__link">
jsPsych.startTime
</a>
<nav class="md-nav" aria-label="jsPsych.startTime">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_15" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_15" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_15" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_15" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychtimelinevariable" class="md-nav__link">
jsPsych.timelineVariable
</a>
<nav class="md-nav" aria-label="jsPsych.timelineVariable">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_16" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_16" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_16" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#examples" class="md-nav__link">
Examples
</a>
<nav class="md-nav" aria-label="Examples">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#standard-use-as-a-parameter-for-a-trial" class="md-nav__link">
Standard use as a parameter for a trial
</a>
</li>
<li class="md-nav__item">
<a href="#invoking-immediately-in-a-function" class="md-nav__link">
Invoking immediately in a function
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychtotaltime" class="md-nav__link">
jsPsych.totalTime
</a>
<nav class="md-nav" aria-label="jsPsych.totalTime">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_17" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_17" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_17" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_16" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychversion" class="md-nav__link">
jsPsych.version
</a>
<nav class="md-nav" aria-label="jsPsych.version">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_18" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_18" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_18" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_17" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="../jspsych-data/" class="md-nav__link">
jsPsych.data
</a>
</li>
<li class="md-nav__item">
<a href="../jspsych-randomization/" class="md-nav__link">
jsPsych.randomization
</a>
</li>
<li class="md-nav__item">
<a href="../jspsych-turk/" class="md-nav__link">
jsPsych.turk
</a>
</li>
<li class="md-nav__item">
<a href="../jspsych-pluginAPI/" class="md-nav__link">
jsPsych.pluginAPI
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_5" type="checkbox" id="__nav_5" >
<label class="md-nav__link" for="__nav_5">
Plugins
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Plugins" data-md-level="1">
<label class="md-nav__title" for="__nav_5">
<span class="md-nav__icon md-icon"></span>
Plugins
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../plugins/list-of-plugins/" class="md-nav__link">
List of Plugins
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-animation/" class="md-nav__link">
jspsych-animation
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-audio-button-response/" class="md-nav__link">
jspsych-audio-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-audio-keyboard-response/" class="md-nav__link">
jspsych-audio-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-audio-slider-response/" class="md-nav__link">
jspsych-audio-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-call-function/" class="md-nav__link">
jspsych-call-function
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-canvas-button-response/" class="md-nav__link">
jspsych-canvas-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-canvas-keyboard-response/" class="md-nav__link">
jspsych-canvas-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-canvas-slider-response/" class="md-nav__link">
jspsych-canvas-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-categorize-animation/" class="md-nav__link">
jspsych-categorize-animation
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-categorize-html/" class="md-nav__link">
jspsych-categorize-html
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-categorize-image/" class="md-nav__link">
jspsych-categorize-image
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-cloze/" class="md-nav__link">
jspsych-cloze
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-external-html/" class="md-nav__link">
jspsych-external-html
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-free-sort/" class="md-nav__link">
jspsych-free-sort
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-fullscreen/" class="md-nav__link">
jspsych-fullscreen
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-html-button-response/" class="md-nav__link">
jspsych-html-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-html-keyboard-response/" class="md-nav__link">
jspsych-html-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-html-slider-response/" class="md-nav__link">
jspsych-html-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-iat-html/" class="md-nav__link">
jspsych-iat-html
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-iat-image/" class="md-nav__link">
jspsych-iat-image
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-image-button-response/" class="md-nav__link">
jspsych-image-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-image-keyboard-response/" class="md-nav__link">
jspsych-image-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-image-slider-response/" class="md-nav__link">
jspsych-image-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-instructions/" class="md-nav__link">
jspsych-instructions
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-maxdiff/" class="md-nav__link">
jspsych-maxdiff
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-preload/" class="md-nav__link">
jspsych-preload
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-rdk/" class="md-nav__link">
jspsych-rdk
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-reconstruction/" class="md-nav__link">
jspsych-reconstruction
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-resize/" class="md-nav__link">
jspsych-resize
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-same-different-html/" class="md-nav__link">
jspsych-same-different-html
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-same-different-image/" class="md-nav__link">
jspsych-same-different-image
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-serial-reaction-time/" class="md-nav__link">
jspsych-serial-reaction-time
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-serial-reaction-time-mouse/" class="md-nav__link">
jspsych-serial-reaction-time-mouse
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-survey-html-form/" class="md-nav__link">
jspsych-survey-html-form
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-survey-likert/" class="md-nav__link">
jspsych-survey-likert
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-survey-multi-choice/" class="md-nav__link">
jspsych-survey-multi-choice
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-survey-multi-select/" class="md-nav__link">
jspsych-survey-multi-select
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-survey-text/" class="md-nav__link">
jspsych-survey-text
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-video-button-response/" class="md-nav__link">
jspsych-video-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-video-keyboard-response/" class="md-nav__link">
jspsych-video-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-video-slider-response/" class="md-nav__link">
jspsych-video-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-virtual-chinrest/" class="md-nav__link">
jspsych-virtual-chinrest
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-visual-search-circle/" class="md-nav__link">
jspsych-visual-search-circle
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-vsl-animate-occlusion/" class="md-nav__link">
jspsych-vsl-animate-occlusion
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-vsl-grid-scene/" class="md-nav__link">
jspsych-vsl-grid-scene
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-webgazer-calibrate/" class="md-nav__link">
jspsych-webgazer-calibrate
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-webgazer-init-camera/" class="md-nav__link">
jspsych-webgazer-init-camera
</a>
</li>
<li class="md-nav__item">
<a href="../../plugins/jspsych-webgazer-validate/" class="md-nav__link">
jspsych-webgazer-validate
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_6" type="checkbox" id="__nav_6" >
<label class="md-nav__link" for="__nav_6">
Extensions
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Extensions" data-md-level="1">
<label class="md-nav__title" for="__nav_6">
<span class="md-nav__icon md-icon"></span>
Extensions
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../extensions/extensions/" class="md-nav__link">
Extensions
</a>
</li>
<li class="md-nav__item">
<a href="../../extensions/jspsych-ext-webgazer/" class="md-nav__link">
jspsych-ext-webgazer.js
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-nav__toggle md-toggle" data-md-toggle="__nav_7" type="checkbox" id="__nav_7" >
<label class="md-nav__link" for="__nav_7">
About
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="About" data-md-level="1">
<label class="md-nav__title" for="__nav_7">
<span class="md-nav__icon md-icon"></span>
About
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../about/about/" class="md-nav__link">
About jsPsych
</a>
</li>
<li class="md-nav__item">
<a href="../../about/support/" class="md-nav__link">
Getting Help
</a>
</li>
<li class="md-nav__item">
<a href="../../about/contributing/" class="md-nav__link">
Contributing to jsPsych
</a>
</li>
<li class="md-nav__item">
<a href="../../about/license/" class="md-nav__link">
License
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-sidebar md-sidebar--secondary" data-md-component="sidebar" data-md-type="toc" >
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
<label class="md-nav__title" for="__toc">
<span class="md-nav__icon md-icon"></span>
Table of contents
</label>
<ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
<li class="md-nav__item">
<a href="#jspsychaddnodetoendoftimeline" class="md-nav__link">
jsPsych.addNodeToEndOfTimeline
</a>
<nav class="md-nav" aria-label="jsPsych.addNodeToEndOfTimeline">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychalltimelinevariables" class="md-nav__link">
jsPsych.allTimelineVariables
</a>
<nav class="md-nav" aria-label="jsPsych.allTimelineVariables">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_1" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_1" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_1" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_1" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychcurrenttimelinenodeid" class="md-nav__link">
jsPsych.currentTimelineNodeID
</a>
<nav class="md-nav" aria-label="jsPsych.currentTimelineNodeID">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_2" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_2" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_2" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_2" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychcurrenttrial" class="md-nav__link">
jsPsych.currentTrial
</a>
<nav class="md-nav" aria-label="jsPsych.currentTrial">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_3" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_3" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_3" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_3" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychendcurrenttimeline" class="md-nav__link">
jsPsych.endCurrentTimeline
</a>
<nav class="md-nav" aria-label="jsPsych.endCurrentTimeline">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_4" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_4" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_4" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_4" class="md-nav__link">
Example
</a>
<nav class="md-nav" aria-label="Example">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#end-timeline-if-a-particular-key-is-pressed" class="md-nav__link">
End timeline if a particular key is pressed
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychendexperiment" class="md-nav__link">
jsPsych.endExperiment
</a>
<nav class="md-nav" aria-label="jsPsych.endExperiment">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_5" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_5" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_5" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_5" class="md-nav__link">
Example
</a>
<nav class="md-nav" aria-label="Example">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#end-the-experiment-if-a-particular-response-is-given" class="md-nav__link">
End the experiment if a particular response is given
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychfinishtrial" class="md-nav__link">
jsPsych.finishTrial
</a>
<nav class="md-nav" aria-label="jsPsych.finishTrial">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_6" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_6" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_6" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_6" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychgetdisplayelement" class="md-nav__link">
jsPsych.getDisplayElement
</a>
<nav class="md-nav" aria-label="jsPsych.getDisplayElement">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_7" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_7" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_7" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_7" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychgetprogressbarcompleted" class="md-nav__link">
jsPsych.getProgressBarCompleted
</a>
<nav class="md-nav" aria-label="jsPsych.getProgressBarCompleted">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_8" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_8" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_8" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_8" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychinit" class="md-nav__link">
jsPsych.init
</a>
<nav class="md-nav" aria-label="jsPsych.init">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_9" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_9" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_9" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_9" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychinitsettings" class="md-nav__link">
jsPsych.initSettings
</a>
<nav class="md-nav" aria-label="jsPsych.initSettings">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_10" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_10" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_10" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_10" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychpauseexperiment" class="md-nav__link">
jsPsych.pauseExperiment
</a>
<nav class="md-nav" aria-label="jsPsych.pauseExperiment">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_11" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_11" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_11" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_11" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychprogress" class="md-nav__link">
jsPsych.progress
</a>
<nav class="md-nav" aria-label="jsPsych.progress">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_12" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_12" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_12" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_12" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychresumeexperiment" class="md-nav__link">
jsPsych.resumeExperiment
</a>
<nav class="md-nav" aria-label="jsPsych.resumeExperiment">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_13" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_13" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_13" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_13" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychsetprogressbar" class="md-nav__link">
jsPsych.setProgressBar
</a>
<nav class="md-nav" aria-label="jsPsych.setProgressBar">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_14" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_14" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_14" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_14" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychstarttime" class="md-nav__link">
jsPsych.startTime
</a>
<nav class="md-nav" aria-label="jsPsych.startTime">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_15" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_15" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_15" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_15" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychtimelinevariable" class="md-nav__link">
jsPsych.timelineVariable
</a>
<nav class="md-nav" aria-label="jsPsych.timelineVariable">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_16" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_16" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_16" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#examples" class="md-nav__link">
Examples
</a>
<nav class="md-nav" aria-label="Examples">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#standard-use-as-a-parameter-for-a-trial" class="md-nav__link">
Standard use as a parameter for a trial
</a>
</li>
<li class="md-nav__item">
<a href="#invoking-immediately-in-a-function" class="md-nav__link">
Invoking immediately in a function
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychtotaltime" class="md-nav__link">
jsPsych.totalTime
</a>
<nav class="md-nav" aria-label="jsPsych.totalTime">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_17" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_17" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_17" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_16" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#jspsychversion" class="md-nav__link">
jsPsych.version
</a>
<nav class="md-nav" aria-label="jsPsych.version">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#parameters_18" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#return-value_18" class="md-nav__link">
Return value
</a>
</li>
<li class="md-nav__item">
<a href="#description_18" class="md-nav__link">
Description
</a>
</li>
<li class="md-nav__item">
<a href="#example_17" class="md-nav__link">
Example
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-content" data-md-component="content">
<article class="md-content__inner md-typeset">
<a href="https://github.com/jspsych/jsPsych/edit/master/docs/core_library/jspsych-core.md" title="Edit this page" class="md-content__button md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z"/></svg>
</a>
<h1 id="the-jspsych-core-library">The jsPsych core library<a class="headerlink" href="#the-jspsych-core-library" title="Permanent link">&para;</a></h1>
<hr />
<h2 id="jspsychaddnodetoendoftimeline">jsPsych.addNodeToEndOfTimeline<a class="headerlink" href="#jspsychaddnodetoendoftimeline" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">addNodeToEndOfTimeline</span><span class="p">(</span><span class="nx">node_parameters</span><span class="p">)</span>
</code></pre></div>
<h3 id="parameters">Parameters<a class="headerlink" href="#parameters" title="Permanent link">&para;</a></h3>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>node_parameters</td>
<td>object</td>
<td>An object defining a timeline. It must have, at a minimum, a <code>timeline</code> parameter with a valid timeline array as the value for that parameter.</td>
</tr>
</tbody>
</table>
<h3 id="return-value">Return value<a class="headerlink" href="#return-value" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="description">Description<a class="headerlink" href="#description" title="Permanent link">&para;</a></h3>
<p>Adds the timeline to the end of the experiment.</p>
<h3 id="example">Example<a class="headerlink" href="#example" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;html-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="s1">&#39;This is a new trial.&#39;</span>
<span class="p">}</span>
<span class="kd">var</span> <span class="nx">new_timeline</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">timeline</span><span class="o">:</span> <span class="p">[</span><span class="nx">trial</span><span class="p">]</span>
<span class="p">}</span>
<span class="nx">jsPsych</span><span class="p">.</span><span class="nx">addNodeToEndOfTimeline</span><span class="p">(</span><span class="nx">new_timeline</span><span class="p">)</span>
</code></pre></div>
<hr />
<h2 id="jspsychalltimelinevariables">jsPsych.allTimelineVariables<a class="headerlink" href="#jspsychalltimelinevariables" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">allTimelineVariables</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_1">Parameters<a class="headerlink" href="#parameters_1" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_1">Return value<a class="headerlink" href="#return-value_1" title="Permanent link">&para;</a></h3>
<p>Returns an object with all available timeline variables at this moment in the experiment, represented as <code>key: value</code> pairs.</p>
<h3 id="description_1">Description<a class="headerlink" href="#description_1" title="Permanent link">&para;</a></h3>
<p>This function can be used to get all the timeline variables at a particular moment in the experiment. Can be useful for annotating
data, such as in the example below.</p>
<h3 id="example_1">Example<a class="headerlink" href="#example_1" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;html-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="s1">&#39;Just a demo&#39;</span><span class="p">,</span>
<span class="nx">on_finish</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">){</span>
<span class="c1">// merge all timeline variables available at this trial into the data for this trial</span>
<span class="nb">Object</span><span class="p">.</span><span class="nx">assign</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">allTimelineVariables</span><span class="p">())</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre></div>
<hr />
<h2 id="jspsychcurrenttimelinenodeid">jsPsych.currentTimelineNodeID<a class="headerlink" href="#jspsychcurrenttimelinenodeid" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">currentTimelineNodeID</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_2">Parameters<a class="headerlink" href="#parameters_2" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_2">Return value<a class="headerlink" href="#return-value_2" title="Permanent link">&para;</a></h3>
<p>Returns the ID of the TimelineNode that is currently active.</p>
<h3 id="description_2">Description<a class="headerlink" href="#description_2" title="Permanent link">&para;</a></h3>
<p>Gets the ID of the active TimelineNode. The ID is a string that follows a specific format:</p>
<ul>
<li><code>"0.0"</code> is the ID of the first top-level TimelineNode</li>
<li><code>"1.0"</code> is the ID of the second top-level TimelineNode</li>
<li><code>"2.0"</code> is the ID of the third top-level TimelineNode, and so on...</li>
</ul>
<p>If a TimelineNode iterates multiple times (using the loop function, for example), then the iterations are indicated in the second number:</p>
<ul>
<li><code>"0.0"</code> is the ID of the first top-level TimelineNode during the first iteration</li>
<li><code>"0.1"</code> is the ID of the first top-level TimelineNode during the second iteration</li>
<li><code>"0.2"</code> is the ID of the first top-level TimelineNode during the third iteration, and so on...</li>
</ul>
<p>If TimelineNodes are nested in other TimelineNodes, then the hierarchical structure is shown with <code>"."</code>:</p>
<ul>
<li><code>"0.0-1.0"</code> is the ID of the second TimelineNode on the timeline of the first top-level TimelineNode.</li>
<li><code>"0.0-2.0"</code> is the ID of the third TimelineNode on the timeline of the first top-level TimelineNode, and so on...</li>
</ul>
<p>The rules about iterations apply throughout the hierarchical ID:</p>
<ul>
<li><code>"0.2-1.3"</code> is the ID of the second TimelineNode, executing for the fourth time, on the timeline of the first top-level TimelineNode, executing for the third time.</li>
</ul>
<h3 id="example_2">Example<a class="headerlink" href="#example_2" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">id</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">currentTimelineNodeID</span><span class="p">();</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s1">&#39;The current TimelineNode ID is &#39;</span><span class="o">+</span><span class="nx">id</span><span class="p">);</span>
</code></pre></div>
<hr />
<h2 id="jspsychcurrenttrial">jsPsych.currentTrial<a class="headerlink" href="#jspsychcurrenttrial" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">currentTrial</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_3">Parameters<a class="headerlink" href="#parameters_3" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_3">Return value<a class="headerlink" href="#return-value_3" title="Permanent link">&para;</a></h3>
<p>Returns the object describing the current trial. The object will contain all of the parameters associated with the current trial.</p>
<h3 id="description_3">Description<a class="headerlink" href="#description_3" title="Permanent link">&para;</a></h3>
<p>Get a description of the current trial</p>
<h3 id="example_3">Example<a class="headerlink" href="#example_3" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">currentTrial</span><span class="p">();</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s1">&#39;The current trial is using the &#39;</span><span class="o">+</span><span class="nx">trial</span><span class="p">.</span><span class="nx">type</span><span class="o">+</span><span class="s1">&#39; plugin&#39;</span><span class="p">);</span>
</code></pre></div>
<hr />
<h2 id="jspsychendcurrenttimeline">jsPsych.endCurrentTimeline<a class="headerlink" href="#jspsychendcurrenttimeline" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">endCurrentTimeline</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_4">Parameters<a class="headerlink" href="#parameters_4" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_4">Return value<a class="headerlink" href="#return-value_4" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="description_4">Description<a class="headerlink" href="#description_4" title="Permanent link">&para;</a></h3>
<p>Ends the current timeline. If timelines are nested, then only the timeline that contains the current trial is ended.</p>
<h3 id="example_4">Example<a class="headerlink" href="#example_4" title="Permanent link">&para;</a></h3>
<h4 id="end-timeline-if-a-particular-key-is-pressed">End timeline if a particular key is pressed<a class="headerlink" href="#end-timeline-if-a-particular-key-is-pressed" title="Permanent link">&para;</a></h4>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">images</span> <span class="o">=</span> <span class="p">[</span>
<span class="s2">&quot;img/1.gif&quot;</span><span class="p">,</span> <span class="s2">&quot;img/2.gif&quot;</span><span class="p">,</span> <span class="s2">&quot;img/3.gif&quot;</span><span class="p">,</span> <span class="s2">&quot;img/4.gif&quot;</span><span class="p">,</span>
<span class="s2">&quot;img/5.gif&quot;</span><span class="p">,</span> <span class="s2">&quot;img/6.gif&quot;</span><span class="p">,</span> <span class="s2">&quot;img/7.gif&quot;</span><span class="p">,</span> <span class="s2">&quot;img/8.gif&quot;</span><span class="p">,</span>
<span class="s2">&quot;img/9.gif&quot;</span><span class="p">,</span> <span class="s2">&quot;img/10.gif&quot;</span>
<span class="p">];</span>
<span class="kd">var</span> <span class="nx">trials</span> <span class="o">=</span> <span class="p">[];</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mf">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">images</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">trials</span><span class="p">.</span><span class="nx">push</span><span class="p">({</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="nx">images</span><span class="p">[</span><span class="nx">i</span><span class="p">]</span>
<span class="p">});</span>
<span class="p">}</span>
<span class="kd">var</span> <span class="nx">block</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;image-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">choices</span><span class="o">:</span> <span class="p">[</span><span class="s1">&#39;y&#39;</span><span class="p">,</span> <span class="s1">&#39;n&#39;</span><span class="p">],</span>
<span class="nx">prompt</span><span class="o">:</span> <span class="s1">&#39;&lt;p&gt;Press &quot;y&quot; to Continue. Press &quot;n&quot; to end this node of the experiment.&lt;/p&gt;&#39;</span><span class="p">,</span>
<span class="nx">on_finish</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">pluginAPI</span><span class="p">.</span><span class="nx">compareKeys</span><span class="p">(</span><span class="nx">data</span><span class="p">.</span><span class="nx">response</span><span class="p">,</span> <span class="s1">&#39;n&#39;</span><span class="p">))</span> <span class="p">{</span>
<span class="nx">jsPsych</span><span class="p">.</span><span class="nx">endCurrentTimeline</span><span class="p">();</span>
<span class="p">}</span>
<span class="p">},</span>
<span class="nx">timeline</span><span class="o">:</span> <span class="nx">trials</span>
<span class="p">}</span>
<span class="kd">var</span> <span class="nx">after_block</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;html-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="s1">&#39;&lt;p&gt;The next node&lt;/p&gt;&#39;</span>
<span class="p">}</span>
<span class="nx">jsPsych</span><span class="p">.</span><span class="nx">init</span><span class="p">({</span>
<span class="nx">timeline</span><span class="o">:</span> <span class="p">[</span><span class="nx">block</span><span class="p">,</span> <span class="nx">after_block</span><span class="p">],</span>
<span class="nx">on_finish</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="nx">jsPsych</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">displayData</span><span class="p">();</span>
<span class="p">}</span>
<span class="p">});</span>
</code></pre></div>
<hr />
<h2 id="jspsychendexperiment">jsPsych.endExperiment<a class="headerlink" href="#jspsychendexperiment" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">endExperiment</span><span class="p">(</span><span class="nx">end_message</span><span class="p">)</span>
</code></pre></div>
<h3 id="parameters_5">Parameters<a class="headerlink" href="#parameters_5" title="Permanent link">&para;</a></h3>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>end_message</td>
<td>string</td>
<td>A message to display on the screen after the experiment is over.</td>
</tr>
</tbody>
</table>
<h3 id="return-value_5">Return value<a class="headerlink" href="#return-value_5" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="description_5">Description<a class="headerlink" href="#description_5" title="Permanent link">&para;</a></h3>
<p>Ends the experiment, skipping all remaining trials.</p>
<h3 id="example_5">Example<a class="headerlink" href="#example_5" title="Permanent link">&para;</a></h3>
<h4 id="end-the-experiment-if-a-particular-response-is-given">End the experiment if a particular response is given<a class="headerlink" href="#end-the-experiment-if-a-particular-response-is-given" title="Permanent link">&para;</a></h4>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;image-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="s1">&#39;image1.jpg&#39;</span><span class="p">,</span>
<span class="nx">choices</span><span class="o">:</span> <span class="p">[</span><span class="s1">&#39;y&#39;</span><span class="p">,</span> <span class="s1">&#39;n&#39;</span><span class="p">]</span>
<span class="nx">prompt</span><span class="o">:</span> <span class="s1">&#39;&lt;p&gt;Press &quot;y&quot; to Continue. Press &quot;n&quot; to end the experiment&lt;/p&gt;&#39;</span><span class="p">,</span>
<span class="nx">on_finish</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">){</span>
<span class="k">if</span><span class="p">(</span><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">pluginAPI</span><span class="p">.</span><span class="nx">compareKeys</span><span class="p">(</span><span class="nx">data</span><span class="p">.</span><span class="nx">response</span><span class="p">,</span> <span class="s2">&quot;n&quot;</span><span class="p">)){</span>
<span class="nx">jsPsych</span><span class="p">.</span><span class="nx">endExperiment</span><span class="p">(</span><span class="s1">&#39;The experiment was ended by pressing &quot;n&quot;.&#39;</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre></div>
<hr />
<h2 id="jspsychfinishtrial">jsPsych.finishTrial<a class="headerlink" href="#jspsychfinishtrial" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">finishTrial</span><span class="p">(</span><span class="nx">data</span><span class="p">)</span>
</code></pre></div>
<h3 id="parameters_6">Parameters<a class="headerlink" href="#parameters_6" title="Permanent link">&para;</a></h3>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>data</td>
<td>object</td>
<td>The data to store for the trial.</td>
</tr>
</tbody>
</table>
<h3 id="return-value_6">Return value<a class="headerlink" href="#return-value_6" title="Permanent link">&para;</a></h3>
<p>Returns nothing.</p>
<h3 id="description_6">Description<a class="headerlink" href="#description_6" title="Permanent link">&para;</a></h3>
<p>This method tells jsPsych that the current trial is over. It is used in all of the plugins to end the current trial. When the trial ends a few things happen:</p>
<ul>
<li>The data is stored using <code>jsPsych.data.write()</code></li>
<li>The on_finish callback function is executed for the trial</li>
<li>The on_trial_finish callback function is executed</li>
<li>The progress bar is updated if it is being displayed</li>
<li>The experiment ends if the trial is the last one (and the on_finish callback function is executed).</li>
<li>The next trial, if one exists, is started.</li>
</ul>
<h3 id="example_6">Example<a class="headerlink" href="#example_6" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="c1">// this code would be in a plugin</span>
<span class="nx">jsPsych</span><span class="p">.</span><span class="nx">finishTrial</span><span class="p">({</span><span class="nx">correct_response</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
</code></pre></div>
<hr />
<h2 id="jspsychgetdisplayelement">jsPsych.getDisplayElement<a class="headerlink" href="#jspsychgetdisplayelement" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">getDisplayElement</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_7">Parameters<a class="headerlink" href="#parameters_7" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_7">Return value<a class="headerlink" href="#return-value_7" title="Permanent link">&para;</a></h3>
<p>Returns the HTML DOM element used for displaying the experiment.</p>
<h3 id="description_7">Description<a class="headerlink" href="#description_7" title="Permanent link">&para;</a></h3>
<p>Get the DOM element that displays the experiment.</p>
<h3 id="example_7">Example<a class="headerlink" href="#example_7" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">el</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">getDisplayElement</span><span class="p">();</span>
<span class="c1">// hide the jsPsych display</span>
<span class="nx">el</span><span class="p">.</span><span class="nx">style</span><span class="p">.</span><span class="nx">visibility</span> <span class="o">=</span> <span class="s1">&#39;hidden&#39;</span><span class="p">;</span>
</code></pre></div>
<hr />
<h2 id="jspsychgetprogressbarcompleted">jsPsych.getProgressBarCompleted<a class="headerlink" href="#jspsychgetprogressbarcompleted" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">getProgressBarCompleted</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_8">Parameters<a class="headerlink" href="#parameters_8" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_8">Return value<a class="headerlink" href="#return-value_8" title="Permanent link">&para;</a></h3>
<p>Returns a value between 0 and 1 representing how full the progress bar currently is.</p>
<h3 id="description_8">Description<a class="headerlink" href="#description_8" title="Permanent link">&para;</a></h3>
<p>Used to get the current value of the progress bar. Works for automated and manual control.</p>
<h3 id="example_8">Example<a class="headerlink" href="#example_8" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">progress_bar_amount</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">getProgressBarCompleted</span><span class="p">();</span>
</code></pre></div>
<hr />
<h2 id="jspsychinit">jsPsych.init<a class="headerlink" href="#jspsychinit" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">init</span><span class="p">(</span><span class="nx">settings</span><span class="p">)</span>
</code></pre></div>
<h3 id="parameters_9">Parameters<a class="headerlink" href="#parameters_9" title="Permanent link">&para;</a></h3>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>settings</td>
<td>object</td>
<td>The settings object for initializing jsPsych. See table below.</td>
</tr>
</tbody>
</table>
<p>The settings object can contain several parameters. The only <em>required</em> parameter is <code>timeline</code>.</p>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>timeline</td>
<td>array</td>
<td>An array containing the objects that describe the experiment timeline. See <a href="../../overview/timeline/">Creating an Experiment: The Timeline</a>.</td>
</tr>
<tr>
<td>display_element</td>
<td>string</td>
<td>The ID of an HTML element to display the experiment in. If left blank, jsPsych will use the <code>&lt;body&gt;</code> element to display content. All keyboard event listeners are bound to this element. In order for a keyboard event to be detected, this element must have focus (be the last thing that the subject clicked on).</td>
</tr>
<tr>
<td>on_finish</td>
<td>function</td>
<td>Function to execute when the experiment ends.</td>
</tr>
<tr>
<td>on_trial_start</td>
<td>function</td>
<td>Function to execute when a new trial begins.</td>
</tr>
<tr>
<td>on_trial_finish</td>
<td>function</td>
<td>Function to execute when a trial ends.</td>
</tr>
<tr>
<td>on_data_update</td>
<td>function</td>
<td>Function to execute every time data is stored using the <code>jsPsych.data.write</code> method. All plugins use this method to save data (via a call to <code>jsPsych.finishTrial</code>, so this function runs every time a plugin stores new data.</td>
</tr>
<tr>
<td>on_interaction_data_update</td>
<td>function</td>
<td>Function to execute every time a new interaction event occurs. Interaction events include clicking on a different window (blur), returning to the experiment window (focus), entering full screen mode (fullscreenenter), and exiting full screen mode (fullscreenexit).</td>
</tr>
<tr>
<td>on_close</td>
<td>function</td>
<td>Function to execute when the user leaves the page. Can be used, for example, to save data before the page is closed.</td>
</tr>
<tr>
<td>exclusions</td>
<td>object</td>
<td>Specifies restrictions on the browser the subject can use to complete the experiment. See list of options below.</td>
</tr>
<tr>
<td>show_progress_bar</td>
<td>boolean</td>
<td>If true, then <a href="../../overview/progress-bar/">a progress bar</a> is shown at the top of the page.</td>
</tr>
<tr>
<td>message_progress_bar</td>
<td>string</td>
<td>Message to display next to the progress bar. The default is 'Completion Progress'.</td>
</tr>
<tr>
<td>auto_update_progress_bar</td>
<td>boolean</td>
<td>If true, then the progress bar at the top of the page will automatically update as every top-level timeline or trial is completed.</td>
</tr>
<tr>
<td>use_webaudio</td>
<td>boolean</td>
<td>If false, then jsPsych will not attempt to use the WebAudio API for audio playback. Instead, HTML5 Audio objects will be used. The WebAudio API offers more precise control over the timing of audio events, and should be used when possible. The default value is true.</td>
</tr>
<tr>
<td>default_iti</td>
<td>numeric</td>
<td>The default inter-trial interval in ms. The default value if none is specified is 0ms.</td>
</tr>
<tr>
<td>experiment_width</td>
<td>numeric</td>
<td>The desired width of the jsPsych container in pixels. If left undefined, the width will be 100% of the display element. Usually this is the <code>&lt;body&gt;</code> element, and the width will be 100% of the screen size.</td>
</tr>
<tr>
<td>minimum_valid_rt</td>
<td>numeric</td>
<td>The minimum valid response time for key presses during the experiment. Any key press response time that is less than this value will be treated as invalid and ignored. Note that this parameter only applies to <em>keyboard responses</em>, and not to other response types such as buttons and sliders. The default value is 0.</td>
</tr>
<tr>
<td>override_safe_mode</td>
<td>boolean</td>
<td>Running a jsPsych experiment directly in a web browser (e.g., by double clicking on a local HTML file) will load the page using the <code>file://</code> protocol. Some features of jsPsych don't work with this protocol. By default, when jsPsych detects that it's running on a page loaded via the <code>file://</code> protocol, it runs in <em>safe mode</em>, which automatically disables features that don't work in this context. Specifically, the use of Web Audio is disabled (audio will be played using HTML5 audio instead, even if <code>use_webaudio</code> is <code>true</code>) and video preloading is disabled. The <code>override_safe_mode</code> parameter defaults to <code>false</code>, but you can set it to <code>true</code> to force these features to operate under the <code>file://</code> protocol. In order for this to work, you will need to disable web security (CORS) features in your browser - this is safe to do if you know what you are doing. Note that this parameter has no effect when you are running the experiment on a web server, because the page will be loaded via the <code>http://</code> or <code>https://</code> protocol.</td>
</tr>
<tr>
<td>case_sensitive_responses</td>
<td>boolean</td>
<td>If true, then jsPsych will make a distinction between uppercase and lowercase keys when evaluating keyboard responses, e.g. "A" (uppercase) will not be recognized as a valid response if the trial only accepts "a" (lowercase). If false, then jsPsych will not make a distinction between uppercase and lowercase keyboard responses, e.g. both "a" and "A" responses will be valid when the trial's key choice parameter is "a". Setting this parameter to false is useful if you want key responses to be treated the same way when CapsLock is turned on or the Shift key is held down. The default value is false.</td>
</tr>
<tr>
<td>extensions</td>
<td>array</td>
<td>Array containing information about one or more jsPsych extensions that are used during the experiment. Each extension should be specified as an object with <code>type</code> (required), which is the name of the extension, and <code>params</code> (optional), which is an object containing any parameter-value pairs to be passed to the extension's <code>initialize</code> function. Default value is an empty array.</td>
</tr>
</tbody>
</table>
<p>Possible values for the exclusions parameter above.</p>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>min_width</td>
<td>numeric</td>
<td>The minimum width of the browser window. If the width is below this value, a message will be displayed to the subject asking them to maximize their browser window. The experiment will sit on this page until the browser window is large enough.</td>
</tr>
<tr>
<td>min_height</td>
<td>numeric</td>
<td>Same as above, but with height.</td>
</tr>
<tr>
<td>audio</td>
<td>boolean</td>
<td>Set to true to require support for the WebAudio API (used by plugins that play audio files).</td>
</tr>
</tbody>
</table>
<h3 id="return-value_9">Return value<a class="headerlink" href="#return-value_9" title="Permanent link">&para;</a></h3>
<p>Returns nothing.</p>
<h3 id="description_9">Description<a class="headerlink" href="#description_9" title="Permanent link">&para;</a></h3>
<p>This method configures and starts the experiment.</p>
<h3 id="example_9">Example<a class="headerlink" href="#example_9" title="Permanent link">&para;</a></h3>
<p>See any of the plugin examples in the <a href="https://github.com/jodeleeuw/jsPsych/tree/master/examples">examples folder</a> in the GitHub repository.</p>
<hr />
<h2 id="jspsychinitsettings">jsPsych.initSettings<a class="headerlink" href="#jspsychinitsettings" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">initSettings</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_10">Parameters<a class="headerlink" href="#parameters_10" title="Permanent link">&para;</a></h3>
<p>None</p>
<h3 id="return-value_10">Return value<a class="headerlink" href="#return-value_10" title="Permanent link">&para;</a></h3>
<p>Returns the settings object used to initialize the experiment.</p>
<h3 id="description_10">Description<a class="headerlink" href="#description_10" title="Permanent link">&para;</a></h3>
<p>Gets the object containing the settings for the current experiment.</p>
<h3 id="example_10">Example<a class="headerlink" href="#example_10" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">settings</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">initSettings</span><span class="p">();</span>
<span class="c1">// check the experiment structure</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">settings</span><span class="p">.</span><span class="nx">timeline</span><span class="p">));</span>
</code></pre></div>
<hr />
<h2 id="jspsychpauseexperiment">jsPsych.pauseExperiment<a class="headerlink" href="#jspsychpauseexperiment" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">pauseExperiment</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_11">Parameters<a class="headerlink" href="#parameters_11" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_11">Return value<a class="headerlink" href="#return-value_11" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="description_11">Description<a class="headerlink" href="#description_11" title="Permanent link">&para;</a></h3>
<p>Pauses the experiment. The experiment will finish the current trial, but will not execute any additional trials until <code>jsPsych.resumeExperiment()</code> is called.</p>
<h3 id="example_11">Example<a class="headerlink" href="#example_11" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;html-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="s1">&#39;Press p to take a 30 second break. Otherwise, press c to continue immediately.&#39;</span><span class="p">,</span>
<span class="nx">choices</span><span class="o">:</span> <span class="p">[</span><span class="s1">&#39;p&#39;</span><span class="p">,</span><span class="s1">&#39;c&#39;</span><span class="p">],</span>
<span class="nx">on_finish</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">){</span>
<span class="k">if</span><span class="p">(</span><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">pluginAPI</span><span class="p">.</span><span class="nx">compareKeys</span><span class="p">(</span><span class="nx">data</span><span class="p">.</span><span class="nx">response</span><span class="p">,</span> <span class="s2">&quot;p&quot;</span><span class="p">))</span> <span class="p">{</span>
<span class="nx">jsPsych</span><span class="p">.</span><span class="nx">pauseExperiment</span><span class="p">();</span>
<span class="nx">setTimeout</span><span class="p">(</span><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">resumeExperiment</span><span class="p">,</span> <span class="mf">30000</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre></div>
<hr />
<h2 id="jspsychprogress">jsPsych.progress<a class="headerlink" href="#jspsychprogress" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">progress</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_12">Parameters<a class="headerlink" href="#parameters_12" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_12">Return value<a class="headerlink" href="#return-value_12" title="Permanent link">&para;</a></h3>
<p>Returns an object with the following properties:</p>
<table>
<thead>
<tr>
<th>Property</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>total_trials</td>
<td>numeric</td>
<td>Indicates the number of trials in the experiment. Note that this does not count possible loops or skipped trials due to conditional statements.</td>
</tr>
<tr>
<td>current_trial_global</td>
<td>numeric</td>
<td>Returns the trial index of the current trial in a global scope. Every trial will increase this count by 1.</td>
</tr>
<tr>
<td>percent_complete</td>
<td>numeric</td>
<td>Estimates the percent of the experiment that is complete. Works as expected for experiments without conditional or looping timelines. For complex timelines, the percent is an approximation.</td>
</tr>
</tbody>
</table>
<h3 id="description_12">Description<a class="headerlink" href="#description_12" title="Permanent link">&para;</a></h3>
<p>This method returns information about the length of the experiment and the subject's current location in the experiment timeline.</p>
<h3 id="example_12">Example<a class="headerlink" href="#example_12" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">progress</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">progress</span><span class="p">();</span>
<span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;You have completed approximately &#39;</span><span class="o">+</span><span class="nx">progress</span><span class="p">.</span><span class="nx">percent_complete</span><span class="o">+</span><span class="s1">&#39;% of the experiment&#39;</span><span class="p">);</span>
</code></pre></div>
<hr />
<h2 id="jspsychresumeexperiment">jsPsych.resumeExperiment<a class="headerlink" href="#jspsychresumeexperiment" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">resumeExperiment</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_13">Parameters<a class="headerlink" href="#parameters_13" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_13">Return value<a class="headerlink" href="#return-value_13" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="description_13">Description<a class="headerlink" href="#description_13" title="Permanent link">&para;</a></h3>
<p>Resumes the experiment after a call to <code>jsPsych.pauseExperiment()</code>. If the post trial delay (<code>post_trial_gap</code>) has not yet been reached, then the experiment will not continue until the delay is finished. For example, if <code>post_trial_gap</code> was 10,000ms and <code>jsPsych.resumeExperiment()</code> was called 6,000ms after the previous trial finished, then the experiment would not continue for another 4,000ms.</p>
<h3 id="example_13">Example<a class="headerlink" href="#example_13" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;html-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="s1">&#39;Press p to take a 30 second break. Otherwise, press c to continue immediately.&#39;</span><span class="p">,</span>
<span class="nx">choices</span><span class="o">:</span> <span class="p">[</span><span class="s1">&#39;p&#39;</span><span class="p">,</span><span class="s1">&#39;c&#39;</span><span class="p">],</span>
<span class="nx">on_finish</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">){</span>
<span class="k">if</span><span class="p">(</span><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">pluginAPI</span><span class="p">.</span><span class="nx">compareKeys</span><span class="p">(</span><span class="nx">data</span><span class="p">.</span><span class="nx">response</span><span class="p">,</span> <span class="s2">&quot;p&quot;</span><span class="p">))</span> <span class="p">{</span>
<span class="nx">jsPsych</span><span class="p">.</span><span class="nx">pauseExperiment</span><span class="p">();</span>
<span class="nx">setTimeout</span><span class="p">(</span><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">resumeExperiment</span><span class="p">,</span> <span class="mf">30000</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre></div>
<hr />
<h2 id="jspsychsetprogressbar">jsPsych.setProgressBar<a class="headerlink" href="#jspsychsetprogressbar" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">setProgressBar</span><span class="p">(</span><span class="nx">value</span><span class="p">)</span>
</code></pre></div>
<h3 id="parameters_14">Parameters<a class="headerlink" href="#parameters_14" title="Permanent link">&para;</a></h3>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>value</td>
<td>numeric</td>
<td>Proprotion (between 0 and 1) to fill the progress bar.</td>
</tr>
</tbody>
</table>
<h3 id="return-value_14">Return value<a class="headerlink" href="#return-value_14" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="description_14">Description<a class="headerlink" href="#description_14" title="Permanent link">&para;</a></h3>
<p>Set the progress bar to a custom amount. Proportion must be between 0 and 1. Values larger than 1 are treated as 1.</p>
<h3 id="example_14">Example<a class="headerlink" href="#example_14" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">setProgressBar</span><span class="p">(</span><span class="mf">0.85</span><span class="p">);</span>
</code></pre></div>
<hr />
<h2 id="jspsychstarttime">jsPsych.startTime<a class="headerlink" href="#jspsychstarttime" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">startTime</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_15">Parameters<a class="headerlink" href="#parameters_15" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_15">Return value<a class="headerlink" href="#return-value_15" title="Permanent link">&para;</a></h3>
<p>Returns a <code>Date</code> object indicating when the experiment began.</p>
<h3 id="description_15">Description<a class="headerlink" href="#description_15" title="Permanent link">&para;</a></h3>
<p>Get the time that the experiment began.</p>
<h3 id="example_15">Example<a class="headerlink" href="#example_15" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">start_time</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">startTime</span><span class="p">();</span>
</code></pre></div>
<hr />
<h2 id="jspsychtimelinevariable">jsPsych.timelineVariable<a class="headerlink" href="#jspsychtimelinevariable" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">timelineVariable</span><span class="p">(</span><span class="nx">variable</span><span class="p">,</span> <span class="nx">call_immediate</span><span class="p">)</span>
</code></pre></div>
<h3 id="parameters_16">Parameters<a class="headerlink" href="#parameters_16" title="Permanent link">&para;</a></h3>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>variable</td>
<td>string</td>
<td>Name of the timeline variable</td>
</tr>
<tr>
<td>call_immediate</td>
<td>bool</td>
<td>This parameter is optional and can usually be omitted. It determines the return value of <code>jsPsych.timelineVariable</code>. If <code>true</code>, the function returns the <em>value</em> of the current timeline variable. If <code>false</code>, the function returns <em>a function that returns the value</em> of the current timeline variable. When <code>call_immediate</code> is omitted, the appropriate option is determined automatically based on the context in which this function is called. When <code>jsPsych.timelineVariable</code> is used as a parameter value, <code>call_immediate</code> will be <code>false</code>. This allows it to be used as a <a href="../overview/dynamic-parameters">dynamic trial parameter</a>. When <code>jsPsych.timelineVariable</code> is used inside of a function, <code>call_immediate</code> will be <code>true</code>. It is possible to explicitly set this option to <code>true</code> to force the function to immediately return the current value of the timeline variable.</td>
</tr>
</tbody>
</table>
<h3 id="return-value_16">Return value<a class="headerlink" href="#return-value_16" title="Permanent link">&para;</a></h3>
<p>Either a function that returns the value of the timeline variable, or the value of the timeline variable, depending on the context in which it is used. See <code>call_immediate</code> description above.</p>
<h3 id="description_16">Description<a class="headerlink" href="#description_16" title="Permanent link">&para;</a></h3>
<p><a href="../overview/timeline/#timeline-variables">Timeline variables</a> are a powerful technique for generating experiments with repetitive procedures but different parameter values. This function fetches the current value of a particular timeline variable. It must be used in conjunction with a timeline that has timeline variables. See the <a href="../overview/timeline/#timeline-variables">timeline variable section</a> for details.</p>
<h3 id="examples">Examples<a class="headerlink" href="#examples" title="Permanent link">&para;</a></h3>
<h4 id="standard-use-as-a-parameter-for-a-trial">Standard use as a parameter for a trial<a class="headerlink" href="#standard-use-as-a-parameter-for-a-trial" title="Permanent link">&para;</a></h4>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;image-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">timelineVariable</span><span class="p">(</span><span class="s1">&#39;image&#39;</span><span class="p">)</span>
<span class="p">}</span>
<span class="kd">var</span> <span class="nx">procedure</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">timeline</span><span class="o">:</span> <span class="p">[</span><span class="nx">trial</span><span class="p">],</span>
<span class="nx">timeline_variables</span><span class="o">:</span> <span class="p">[</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face1.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face2.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face3.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face4.png&#39;</span><span class="p">}</span>
<span class="p">]</span>
<span class="p">}</span>
</code></pre></div>
<h4 id="invoking-immediately-in-a-function">Invoking immediately in a function<a class="headerlink" href="#invoking-immediately-in-a-function" title="Permanent link">&para;</a></h4>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;html-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
<span class="k">return</span> <span class="s2">&quot;&lt;img style=&#39;width:100px; height:100px;&#39; src=&#39;&quot;</span><span class="o">+</span><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">timelineVariable</span><span class="p">(</span><span class="s1">&#39;image&#39;</span><span class="p">)</span><span class="o">+</span><span class="s2">&quot;&#39;&gt;&lt;/img&gt;&quot;</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="kd">var</span> <span class="nx">procedure</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">timeline</span><span class="o">:</span> <span class="p">[</span><span class="nx">trial</span><span class="p">],</span>
<span class="nx">timeline_variables</span><span class="o">:</span> <span class="p">[</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face1.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face2.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face3.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face4.png&#39;</span><span class="p">}</span>
<span class="p">]</span>
<span class="p">}</span>
</code></pre></div>
<p>Prior to jsPsych v6.3.0, the <code>call_immediate</code> parameter must be set to <code>true</code> when <code>jsPsych.timelineVariable</code> is called from within a function, such as a <a href="../overview/dynamic-parameters">dynamic parameter</a>:</p>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;html-keyboard-response&#39;</span><span class="p">,</span>
<span class="nx">stimulus</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
<span class="k">return</span> <span class="s2">&quot;&lt;img style=&#39;width:100px; height:100px;&#39; src=&#39;&quot;</span><span class="o">+</span><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">timelineVariable</span><span class="p">(</span><span class="s1">&#39;image&#39;</span><span class="p">,</span> <span class="kc">true</span><span class="p">)</span><span class="o">+</span><span class="s2">&quot;&#39;&gt;&lt;/img&gt;&quot;</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="kd">var</span> <span class="nx">procedure</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">timeline</span><span class="o">:</span> <span class="p">[</span><span class="nx">trial</span><span class="p">],</span>
<span class="nx">timeline_variables</span><span class="o">:</span> <span class="p">[</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face1.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face2.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face3.png&#39;</span><span class="p">},</span>
<span class="p">{</span><span class="nx">image</span><span class="o">:</span> <span class="s1">&#39;face4.png&#39;</span><span class="p">}</span>
<span class="p">]</span>
<span class="p">}</span>
</code></pre></div>
<hr />
<h2 id="jspsychtotaltime">jsPsych.totalTime<a class="headerlink" href="#jspsychtotaltime" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">totalTime</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_17">Parameters<a class="headerlink" href="#parameters_17" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_17">Return value<a class="headerlink" href="#return-value_17" title="Permanent link">&para;</a></h3>
<p>Returns a numeric value indicating the number of milliseconds since <code>jsPsych.init</code> was called.</p>
<h3 id="description_17">Description<a class="headerlink" href="#description_17" title="Permanent link">&para;</a></h3>
<p>Gets the total time the subject has been in the experiment.</p>
<h3 id="example_16">Example<a class="headerlink" href="#example_16" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">time</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">totalTime</span><span class="p">();</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">time</span><span class="p">);</span>
</code></pre></div>
<hr />
<h2 id="jspsychversion">jsPsych.version<a class="headerlink" href="#jspsychversion" title="Permanent link">&para;</a></h2>
<div class="highlight"><pre><span></span><code><span class="nx">jsPsych</span><span class="p">.</span><span class="nx">version</span><span class="p">()</span>
</code></pre></div>
<h3 id="parameters_18">Parameters<a class="headerlink" href="#parameters_18" title="Permanent link">&para;</a></h3>
<p>None.</p>
<h3 id="return-value_18">Return value<a class="headerlink" href="#return-value_18" title="Permanent link">&para;</a></h3>
<p>Returns the version number as a string.</p>
<h3 id="description_18">Description<a class="headerlink" href="#description_18" title="Permanent link">&para;</a></h3>
<p>Gets the version of jsPsych.</p>
<h3 id="example_17">Example<a class="headerlink" href="#example_17" title="Permanent link">&para;</a></h3>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">version</span> <span class="o">=</span> <span class="nx">jsPsych</span><span class="p">.</span><span class="nx">version</span><span class="p">();</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">version</span><span class="p">);</span>
</code></pre></div>
</article>
</div>
</div>
</main>
<footer class="md-footer">
<nav class="md-footer__inner md-grid" aria-label="Footer">
<a href="../../overview/browser-device-support/" class="md-footer__link md-footer__link--prev" aria-label="Previous: Browser and Device Support" rel="prev">
<div class="md-footer__button md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12z"/></svg>
</div>
<div class="md-footer__title">
<div class="md-ellipsis">
<span class="md-footer__direction">
Previous
</span>
Browser and Device Support
</div>
</div>
</a>
<a href="../jspsych-data/" class="md-footer__link md-footer__link--next" aria-label="Next: jsPsych.data" rel="next">
<div class="md-footer__title">
<div class="md-ellipsis">
<span class="md-footer__direction">
Next
</span>
jsPsych.data
</div>
</div>
<div class="md-footer__button md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11H4z"/></svg>
</div>
</a>
</nav>
<div class="md-footer-meta md-typeset">
<div class="md-footer-meta__inner md-grid">
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2012-2021 Josh de Leeuw
</div>
Made with
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
Material for MkDocs
</a>
</div>
<div class="md-footer-social">
<a href="https://github.com/jspsych" target="_blank" rel="noopener" title="github.com" class="md-footer-social__link">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg>
</a>
<a href="https://twitter.com/joshdeleeuw" target="_blank" rel="noopener" title="twitter.com" class="md-footer-social__link">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"/></svg>
</a>
</div>
</div>
</div>
</footer>
</div>
<div class="md-dialog" data-md-component="dialog">
<div class="md-dialog__inner md-typeset"></div>
</div>
<script id="__config" type="application/json">{"base": "../..", "features": [], "translations": {"clipboard.copy": "Copy to clipboard", "clipboard.copied": "Copied to clipboard", "search.config.lang": "en", "search.config.pipeline": "trimmer, stopWordFilter", "search.config.separator": "[\\s\\-]+", "search.placeholder": "Search", "search.result.placeholder": "Type to start searching", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.term.missing": "Missing", "select.version.title": "Select version"}, "search": "../../assets/javascripts/workers/search.709b4209.min.js", "version": {"provider": "mike"}}</script>
<script src="../../assets/javascripts/bundle.febc23d1.min.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink