HoshinoKoji/jsPsych
1
0
Fork 0
mirror of https://github.com/jspsych/jsPsych.git synced 2025-05-13 00:58:12 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity
bb85a7a0f0
jsPsych/7.2/plugins/browser-check/index.html

2284 lines
63 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="canonical" href="https://www.jspsych.org/7.2/plugins/browser-check/">
<link rel="icon" href="../../img/jspsych-favicon.png">
<meta name="generator" content="mkdocs-1.3.0, mkdocs-material-8.2.13">
<title>browser-check - jsPsych</title>
<link rel="stylesheet" href="../../assets/stylesheets/main.e411adfe.min.css">
<link rel="stylesheet" href="../../assets/stylesheets/palette.cc9b2e1e.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,300i,400,400i,700,700i%7CRoboto+Mono:400,400i,700,700i&display=fallback">
<style>:root{--md-text-font:"Roboto";--md-code-font:"Roboto Mono"}</style>
<script>__md_scope=new URL("../..",location),__md_get=(e,_=localStorage,t=__md_scope)=>JSON.parse(_.getItem(t.pathname+"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=>{try{t.setItem(a.pathname+"."+e,JSON.stringify(_))}catch(e){}}</script>
<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">
<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="#browser-check" class="md-skip">
Skip to content
</a>
</div>
<div data-md-component="announce">
</div>
<div data-md-component="outdated" hidden>
<aside class="md-banner md-banner--warning">
</aside>
</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">
browser-check
</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"><!--! Font Awesome Free 6.1.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2022 Fonticons, Inc.--><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"><!--! Font Awesome Free 6.1.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2022 Fonticons, Inc.--><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/extensions/" class="md-nav__link">
Extensions
</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/simulation/" class="md-nav__link">
Simulation Modes
</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/events/" class="md-nav__link">
Events
</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>
<li class="md-nav__item">
<a href="../../overview/timing-accuracy/" class="md-nav__link">
Timing Accuracy
</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_4" type="checkbox" id="__nav_4" >
<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">
<a href="../../reference/jspsych/" class="md-nav__link">
jsPsych
</a>
</li>
<li class="md-nav__item">
<a href="../../reference/jspsych-data/" class="md-nav__link">
jsPsych.data
</a>
</li>
<li class="md-nav__item">
<a href="../../reference/jspsych-randomization/" class="md-nav__link">
jsPsych.randomization
</a>
</li>
<li class="md-nav__item">
<a href="../../reference/jspsych-turk/" class="md-nav__link">
jsPsych.turk
</a>
</li>
<li class="md-nav__item">
<a href="../../reference/jspsych-pluginAPI/" class="md-nav__link">
jsPsych.pluginAPI
</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_5" type="checkbox" id="__nav_5" checked>
<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="../list-of-plugins/" class="md-nav__link">
List of Plugins
</a>
</li>
<li class="md-nav__item">
<a href="../animation/" class="md-nav__link">
animation
</a>
</li>
<li class="md-nav__item">
<a href="../audio-button-response/" class="md-nav__link">
audio-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../audio-keyboard-response/" class="md-nav__link">
audio-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../audio-slider-response/" class="md-nav__link">
audio-slider-response
</a>
</li>
<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">
browser-check
<span class="md-nav__icon md-icon"></span>
</label>
<a href="./" class="md-nav__link md-nav__link--active">
browser-check
</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="#parameters" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#data-generated" class="md-nav__link">
Data Generated
</a>
</li>
<li class="md-nav__item">
<a href="#simulation-mode" class="md-nav__link">
Simulation Mode
</a>
</li>
<li class="md-nav__item">
<a href="#install" class="md-nav__link">
Install
</a>
</li>
<li class="md-nav__item">
<a href="#examples" class="md-nav__link">
Examples
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="../call-function/" class="md-nav__link">
call-function
</a>
</li>
<li class="md-nav__item">
<a href="../canvas-button-response/" class="md-nav__link">
canvas-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../canvas-keyboard-response/" class="md-nav__link">
canvas-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../canvas-slider-response/" class="md-nav__link">
canvas-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../categorize-animation/" class="md-nav__link">
categorize-animation
</a>
</li>
<li class="md-nav__item">
<a href="../categorize-html/" class="md-nav__link">
categorize-html
</a>
</li>
<li class="md-nav__item">
<a href="../categorize-image/" class="md-nav__link">
categorize-image
</a>
</li>
<li class="md-nav__item">
<a href="../cloze/" class="md-nav__link">
cloze
</a>
</li>
<li class="md-nav__item">
<a href="../external-html/" class="md-nav__link">
external-html
</a>
</li>
<li class="md-nav__item">
<a href="../free-sort/" class="md-nav__link">
free-sort
</a>
</li>
<li class="md-nav__item">
<a href="../fullscreen/" class="md-nav__link">
fullscreen
</a>
</li>
<li class="md-nav__item">
<a href="../html-audio-response/" class="md-nav__link">
html-audio-response
</a>
</li>
<li class="md-nav__item">
<a href="../html-button-response/" class="md-nav__link">
html-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../html-keyboard-response/" class="md-nav__link">
html-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../html-slider-response/" class="md-nav__link">
html-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../iat-html/" class="md-nav__link">
iat-html
</a>
</li>
<li class="md-nav__item">
<a href="../iat-image/" class="md-nav__link">
iat-image
</a>
</li>
<li class="md-nav__item">
<a href="../image-button-response/" class="md-nav__link">
image-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../image-keyboard-response/" class="md-nav__link">
image-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../image-slider-response/" class="md-nav__link">
image-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../initialize-microphone/" class="md-nav__link">
initialize-microphone
</a>
</li>
<li class="md-nav__item">
<a href="../instructions/" class="md-nav__link">
instructions
</a>
</li>
<li class="md-nav__item">
<a href="../maxdiff/" class="md-nav__link">
maxdiff
</a>
</li>
<li class="md-nav__item">
<a href="../preload/" class="md-nav__link">
preload
</a>
</li>
<li class="md-nav__item">
<a href="../reconstruction/" class="md-nav__link">
reconstruction
</a>
</li>
<li class="md-nav__item">
<a href="../resize/" class="md-nav__link">
resize
</a>
</li>
<li class="md-nav__item">
<a href="../same-different-html/" class="md-nav__link">
same-different-html
</a>
</li>
<li class="md-nav__item">
<a href="../same-different-image/" class="md-nav__link">
same-different-image
</a>
</li>
<li class="md-nav__item">
<a href="../serial-reaction-time/" class="md-nav__link">
serial-reaction-time
</a>
</li>
<li class="md-nav__item">
<a href="../serial-reaction-time-mouse/" class="md-nav__link">
serial-reaction-time-mouse
</a>
</li>
<li class="md-nav__item">
<a href="../sketchpad/" class="md-nav__link">
sketchpad
</a>
</li>
<li class="md-nav__item">
<a href="../survey/" class="md-nav__link">
survey
</a>
</li>
<li class="md-nav__item">
<a href="../survey-html-form/" class="md-nav__link">
survey-html-form
</a>
</li>
<li class="md-nav__item">
<a href="../survey-likert/" class="md-nav__link">
survey-likert
</a>
</li>
<li class="md-nav__item">
<a href="../survey-multi-choice/" class="md-nav__link">
survey-multi-choice
</a>
</li>
<li class="md-nav__item">
<a href="../survey-multi-select/" class="md-nav__link">
survey-multi-select
</a>
</li>
<li class="md-nav__item">
<a href="../survey-text/" class="md-nav__link">
survey-text
</a>
</li>
<li class="md-nav__item">
<a href="../video-button-response/" class="md-nav__link">
video-button-response
</a>
</li>
<li class="md-nav__item">
<a href="../video-keyboard-response/" class="md-nav__link">
video-keyboard-response
</a>
</li>
<li class="md-nav__item">
<a href="../video-slider-response/" class="md-nav__link">
video-slider-response
</a>
</li>
<li class="md-nav__item">
<a href="../virtual-chinrest/" class="md-nav__link">
virtual-chinrest
</a>
</li>
<li class="md-nav__item">
<a href="../visual-search-circle/" class="md-nav__link">
visual-search-circle
</a>
</li>
<li class="md-nav__item">
<a href="../webgazer-calibrate/" class="md-nav__link">
webgazer-calibrate
</a>
</li>
<li class="md-nav__item">
<a href="../webgazer-init-camera/" class="md-nav__link">
webgazer-init-camera
</a>
</li>
<li class="md-nav__item">
<a href="../webgazer-validate/" class="md-nav__link">
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/list-of-extensions/" class="md-nav__link">
List of Extensions
</a>
</li>
<li class="md-nav__item">
<a href="../../extensions/mouse-tracking/" class="md-nav__link">
mouse-tracking
</a>
</li>
<li class="md-nav__item">
<a href="../../extensions/webgazer/" class="md-nav__link">
webgazer
</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">
Developers
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Developers" data-md-level="1">
<label class="md-nav__title" for="__nav_7">
<span class="md-nav__icon md-icon"></span>
Developers
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../developers/configuration/" class="md-nav__link">
Configuration
</a>
</li>
<li class="md-nav__item">
<a href="../../developers/contributing/" class="md-nav__link">
Contributing to jsPsych
</a>
</li>
<li class="md-nav__item">
<a href="../../developers/plugin-development/" class="md-nav__link">
Plugin Development
</a>
</li>
<li class="md-nav__item">
<a href="../../developers/extension-development/" class="md-nav__link">
Extension Development
</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_8" type="checkbox" id="__nav_8" >
<label class="md-nav__link" for="__nav_8">
Support
<span class="md-nav__icon md-icon"></span>
</label>
<nav class="md-nav" aria-label="Support" data-md-level="1">
<label class="md-nav__title" for="__nav_8">
<span class="md-nav__icon md-icon"></span>
Support
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../support/support/" class="md-nav__link">
Getting Help
</a>
</li>
<li class="md-nav__item">
<a href="../../support/migration-v7/" class="md-nav__link">
Migrating from 6.x to 7.x
</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_9" type="checkbox" id="__nav_9" >
<label class="md-nav__link" for="__nav_9">
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_9">
<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/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="#parameters" class="md-nav__link">
Parameters
</a>
</li>
<li class="md-nav__item">
<a href="#data-generated" class="md-nav__link">
Data Generated
</a>
</li>
<li class="md-nav__item">
<a href="#simulation-mode" class="md-nav__link">
Simulation Mode
</a>
</li>
<li class="md-nav__item">
<a href="#install" class="md-nav__link">
Install
</a>
</li>
<li class="md-nav__item">
<a href="#examples" class="md-nav__link">
Examples
</a>
</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/main/docs/plugins/browser-check.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="browser-check">browser-check<a class="headerlink" href="#browser-check" title="Permanent link">&para;</a></h1>
<p>Current version: 1.0.0. <a href="https://github.com/jspsych/jsPsych/blob/main/packages/plugin-browser-check/CHANGELOG.md">See version history</a>.</p>
<p>This plugin measures and records various features of the participant's browser and can end the experiment if defined inclusion criteria are not met.</p>
<p>The plugin currently can record the following features:</p>
<ul>
<li>The width and height of the browser window in pixels.</li>
<li>The type of browser used (e.g., Chrome, Firefox, Edge, etc.) and the version number of the browser.*</li>
<li>Whether the participant is using a mobile device.*</li>
<li>The operating system.*</li>
<li>Support for the WebAudio API.</li>
<li>Support for the Fullscreen API, e.g., through the <a href="../fullscreen/">fullscreen plugin</a>.</li>
<li>The display refresh rate in frames per second.</li>
<li>Whether the device has a webcam and microphone. Note that this only reveals whether a webcam/microphone exists. The participant still needs to grant permission in order for the experiment to use these devices.</li>
</ul>
<div class="admonition warning">
<p class="admonition-title">Warning</p>
<p>Features with an * are recorded by parsing the <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent">user agent string</a>.
This method is accurate most of the time, but is not guaranteed to be correct.
The plugin uses the <a href="https://github.com/DamonOehlman/detect-browser">detect-browser package</a> to perform user agent parsing.
You can find a list of supported browsers and OSes in the <a href="https://github.com/DamonOehlman/detect-browser/blob/master/src/index.ts">source file</a>.</p>
</div>
<p>The plugin begins by measuring the set of features requested.
An inclusion function is evaluated to see if the paricipant passes the inclusion criteria.
If they do, then the trial ends and the experiment continues.
If they do not, then the experiment ends immediately.
If a minimum width and/or minimum height is desired, the plugin will optionally display a message to participants whose browser windows are too small to give them an opportunity to make the window larger if possible.
See the examples below for more guidance.</p>
<h2 id="parameters">Parameters<a class="headerlink" href="#parameters" title="Permanent link">&para;</a></h2>
<p>In addition to the <a href="../../overview/plugins/#parameters-available-in-all-plugins">parameters available in all plugins</a>, this plugin accepts the following parameters. Parameters with a default value of <em>undefined</em> must be specified. Other parameters can be left unspecified if the default value is acceptable.</p>
<table>
<thead>
<tr>
<th>Parameter</th>
<th>Type</th>
<th>Default Value</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>features</td>
<td>array of strings</td>
<td><code>["width", "height", "webaudio", "browser", "browser_version", "mobile", "os", "fullscreen", "vsync_rate", "webcam", "microphone"]</code></td>
<td>The list of browser features to record. The default value includes all of the available options.</td>
</tr>
<tr>
<td>skip_features</td>
<td>array of strings</td>
<td><code>[]</code></td>
<td>Any features listed here will be skipped, even if they appear in <code>features</code>. Use this when you want to run most of the defaults.</td>
</tr>
<tr>
<td>vsync_frame_count</td>
<td>int</td>
<td>60</td>
<td>The number of frames to sample when measuring the display refresh rate (<code>"vsync_rate"</code>). Increasing the number will potenially improve the stability of the estimate at the cost of increasing the amount of time the plugin takes during this test. On most devices, 60 frames takes about 1 second to measure.</td>
</tr>
<tr>
<td>allow_window_resize</td>
<td>bool</td>
<td>true</td>
<td>Whether to allow the participant to resize the browser window if the window is smaller than <code>minimum_width</code> and/or <code>minimum_height</code>. If <code>false</code>, then the <code>minimum_width</code> and <code>minimum_height</code> parameters are ignored and you can validate the size in the <code>inclusion_function</code>.</td>
</tr>
<tr>
<td>minimum_height</td>
<td>int</td>
<td>0</td>
<td>If <code>allow_window_resize</code> is <code>true</code>, then this is the minimum height of the window (in pixels) that must be met before continuing.</td>
</tr>
<tr>
<td>minimum_width</td>
<td>int</td>
<td>0</td>
<td>If <code>allow_window_resize</code> is <code>true</code>, then this is the minimum width of the window (in pixels) that must be met before continuing.</td>
</tr>
<tr>
<td>window_resize_message</td>
<td>string</td>
<td>see description</td>
<td>The message that will be displayed during the interactive resize when <code>allow_window_resize</code> is <code>true</code> and the window is too small. If the message contains HTML elements with the special IDs <code>browser-check-min-width</code>, <code>browser-check-min-height</code>, <code>browser-check-actual-height</code>, and/or <code>browser-check-actual-width</code>, then the contents of those elements will be dynamically updated to reflect the <code>minimum_width</code>, <code>minimum_height</code> and measured width and height of the browser. The default message is: <code>&lt;p&gt;Your browser window is too small to complete this experiment. Please maximize the size of your browser window. If your browser window is already maximized, you will not be able to complete this experiment.&lt;/p&gt;&lt;p&gt;The minimum window width is &lt;span id="browser-check-min-width"&gt;&lt;/span&gt; px.&lt;/p&gt;&lt;p&gt;Your current window width is &lt;span id="browser-check-actual-width"&gt;&lt;/span&gt; px.&lt;/p&gt;&lt;p&gt;The minimum window height is &lt;span id="browser-check-min-height"&gt;&lt;/span&gt; px.&lt;/p&gt;&lt;p&gt;Your current window height is &lt;span id="browser-check-actual-height"&gt;&lt;/span&gt; px.&lt;/p&gt;</code>.</td>
</tr>
<tr>
<td>resize_fail_button_text</td>
<td>string</td>
<td><code>"I cannot make the window any larger"</code></td>
<td>During the interactive resize, a button with this text will be displayed below the <code>window_resize_message</code> for the participant to click if the window cannot meet the minimum size needed. When the button is clicked, the experiment will end and <code>exclusion_message</code> will be displayed.</td>
</tr>
<tr>
<td>inclusion_function</td>
<td>function</td>
<td><code>() =&gt; { return true; }</code></td>
<td>A function that evaluates to <code>true</code> if the browser meets all of the inclusion criteria for the experiment, and <code>false</code> otherwise. The first argument to the function will be an object containing key value pairs with the measured features of the browser. The keys will be the same as those listed in <code>features</code>. See example below.</td>
</tr>
<tr>
<td>exclusion_message</td>
<td>function</td>
<td><code>() =&gt; { return &lt;p&gt;Your browser does not meet the requirements to participate in this experiment.&lt;/p&gt; }</code></td>
<td>A function that returns the message to display if <code>inclusion_function</code> evaluates to <code>false</code> or if the participant clicks on the resize fail button during the interactive resize. In order to allow customization of the message, the first argument to the function will be an object containing key value pairs with the measured features of the browser. The keys will be the same as those listed in <code>features</code>. See example below.</td>
</tr>
</tbody>
</table>
<h2 id="data-generated">Data Generated<a class="headerlink" href="#data-generated" title="Permanent link">&para;</a></h2>
<p>In addition to the <a href="../../overview/plugins/#data-collected-by-all-plugins">default data collected by all plugins</a>, this plugin collects the following data for each trial.</p>
<table>
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr>
<td>width</td>
<td>int</td>
<td>The width of the browser window in pixels. If interactive resizing happens, this is the width <em>after</em> resizing.</td>
</tr>
<tr>
<td>height</td>
<td>int</td>
<td>The height of the browser window in pixels. If interactive resizing happens, this is the height <em>after</em> resizing.</td>
</tr>
<tr>
<td>browser</td>
<td>string</td>
<td>The browser used.</td>
</tr>
<tr>
<td>browser_version</td>
<td>string</td>
<td>The version number of the browser.</td>
</tr>
<tr>
<td>os</td>
<td>string</td>
<td>The operating system used.</td>
</tr>
<tr>
<td>mobile</td>
<td>bool</td>
<td>Whether the browser is a mobile device.</td>
</tr>
<tr>
<td>webaudio</td>
<td>bool</td>
<td>Whether the browser supports the WebAudio API.</td>
</tr>
<tr>
<td>fullscreen</td>
<td>bool</td>
<td>Whether the browser supports the Fullscreen API.</td>
</tr>
<tr>
<td>vsync_rate</td>
<td>number</td>
<td>An estimate of the refresh rate of the screen, in frames per second.</td>
</tr>
<tr>
<td>webcam</td>
<td>bool</td>
<td>Whether there is a webcam device available. Note that the participant still must grant permission to access the device before it can be used.</td>
</tr>
<tr>
<td>microphone</td>
<td>bool</td>
<td>Whether there is an audio input device available. Note that the participant still must grant permission to access the device before it can be used.</td>
</tr>
</tbody>
</table>
<p>Note that all of these values are only recorded when the corresponding key is included in the <code>features</code> parameter for the trial.</p>
<h2 id="simulation-mode">Simulation Mode<a class="headerlink" href="#simulation-mode" title="Permanent link">&para;</a></h2>
<p>In <a href="../../overview/simulation/">simulation mode</a> the plugin will report the actual features of the browser, with the exception of <code>vsync_rate</code>, which is always 60. </p>
<p>In <code>data-only</code> mode, if <code>allow_window_resize</code> is true and the browser's width and height are below the maximum value then the reported width and height will be equal to <code>minimum_width</code> and <code>minimum_height</code>, as if the participant resized the browser to meet the specifications.</p>
<p>In <code>visual</code> mode, if <code>allow_window_resize</code> is true and the browser's width and height are below the maximum value then the experiment will wait for 3 seconds before clicking the resize fail button. During this time, you can adjust the window if you would like to.</p>
<p>As with all simulated plugins, you can override the default (actual) data with fake data using <code>simulation_options</code>. This allows you to test your exclusion criteria by simulating other configurations.</p>
<h2 id="install">Install<a class="headerlink" href="#install" title="Permanent link">&para;</a></h2>
<p>Using the CDN-hosted JavaScript file:</p>
<div class="highlight"><pre><span></span><code><span class="o">&lt;</span><span class="nx">script</span><span class="w"> </span><span class="nx">src</span><span class="o">=</span><span class="s2">&quot;https://unpkg.com/@jspsych/plugin-browser-check@1.0.0&quot;</span><span class="o">&gt;&lt;</span><span class="err">/script&gt;</span><span class="w"></span>
</code></pre></div>
<p>Using the JavaScript file downloaded from a GitHub release dist archive:</p>
<div class="highlight"><pre><span></span><code><span class="o">&lt;</span><span class="nx">script</span><span class="w"> </span><span class="nx">src</span><span class="o">=</span><span class="s2">&quot;jspsych/plugin-browser-check.js&quot;</span><span class="o">&gt;&lt;</span><span class="err">/script&gt;</span><span class="w"></span>
</code></pre></div>
<p>Using NPM:</p>
<p><div class="highlight"><pre><span></span><code>npm install @jspsych/plugin-browser-check
</code></pre></div>
<div class="highlight"><pre><span></span><code><span class="k">import</span><span class="w"> </span><span class="nx">browserCheck</span><span class="w"> </span><span class="kr">from</span><span class="w"> </span><span class="s1">&#39;@jspsych/plugin-browser-check&#39;</span><span class="p">;</span><span class="w"></span>
</code></pre></div></p>
<h2 id="examples">Examples<a class="headerlink" href="#examples" title="Permanent link">&para;</a></h2>
<details class="example" open="open"><summary>Recording all of the available features, no exclusions</summary><div class="tabbed-set tabbed-alternate" data-tabs="1:2"><input checked="checked" id="__tabbed_1_1" name="__tabbed_1" type="radio" /><input id="__tabbed_1_2" name="__tabbed_1" type="radio" /><div class="tabbed-labels"><label for="__tabbed_1_1">Code</label><label for="__tabbed_1_2">Demo</label></div>
<div class="tabbed-content">
<div class="tabbed-block">
<div class="highlight"><pre><span></span><code><span class="kd">var</span><span class="w"> </span><span class="nx">trial</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="p">{</span><span class="w"></span>
<span class="w"> </span><span class="nx">type</span><span class="o">:</span><span class="w"> </span><span class="nx">jsPsychBrowserCheck</span><span class="w"></span>
<span class="p">};</span><span class="w"></span>
</code></pre></div>
</div>
<div class="tabbed-block">
<p><div style="text-align:center;">
<iframe src="../../demos/jspsych-browser-check-demo1.html" width="90%;" height="500px;" frameBorder="0"></iframe>
</div></p>
</div>
</div>
</div>
<p><a target="_blank" rel="noopener noreferrer" href="../../demos/jspsych-browser-check-demo1.html">Open demo in new tab</a></p>
</details>
<details class="example" open="open"><summary>Using the inclusion function to mandate the use of Chrome or Firefox as the browser</summary><div class="tabbed-set tabbed-alternate" data-tabs="2:2"><input checked="checked" id="__tabbed_2_1" name="__tabbed_2" type="radio" /><input id="__tabbed_2_2" name="__tabbed_2" type="radio" /><div class="tabbed-labels"><label for="__tabbed_2_1">Code</label><label for="__tabbed_2_2">Demo</label></div>
<div class="tabbed-content">
<div class="tabbed-block">
<div class="highlight"><pre><span></span><code><span class="kd">var</span><span class="w"> </span><span class="nx">trial</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="p">{</span><span class="w"></span>
<span class="w"> </span><span class="nx">type</span><span class="o">:</span><span class="w"> </span><span class="nx">jsPsychBrowserCheck</span><span class="p">,</span><span class="w"></span>
<span class="w"> </span><span class="nx">inclusion_function</span><span class="o">:</span><span class="w"> </span><span class="p">(</span><span class="nx">data</span><span class="p">)</span><span class="w"> </span><span class="p">=&gt;</span><span class="w"> </span><span class="p">{</span><span class="w"></span>
<span class="w"> </span><span class="k">return</span><span class="w"> </span><span class="p">[</span><span class="s1">&#39;chrome&#39;</span><span class="p">,</span><span class="w"> </span><span class="s1">&#39;firefox&#39;</span><span class="p">].</span><span class="nx">includes</span><span class="p">(</span><span class="nx">data</span><span class="p">.</span><span class="nx">browser</span><span class="p">);</span><span class="w"></span>
<span class="w"> </span><span class="p">},</span><span class="w"></span>
<span class="w"> </span><span class="nx">exclusion_message</span><span class="o">:</span><span class="w"> </span><span class="sb">`&lt;p&gt;You must use Chrome or Firefox to complete this experiment.&lt;/p&gt;`</span><span class="w"></span>
<span class="p">};</span><span class="w"></span>
</code></pre></div>
</div>
<div class="tabbed-block">
<p><div style="text-align:center;">
<iframe src="../../demos/jspsych-browser-check-demo2.html" width="90%;" height="500px;" frameBorder="0"></iframe>
</div></p>
</div>
</div>
</div>
<p><a target="_blank" rel="noopener noreferrer" href="../../demos/jspsych-browser-check-demo2.html">Open demo in new tab</a></p>
</details>
<details class="example" open="open"><summary>Setting a minimum window height &amp; width, with the option to resize the window</summary><div class="tabbed-set tabbed-alternate" data-tabs="3:2"><input checked="checked" id="__tabbed_3_1" name="__tabbed_3" type="radio" /><input id="__tabbed_3_2" name="__tabbed_3" type="radio" /><div class="tabbed-labels"><label for="__tabbed_3_1">Code</label><label for="__tabbed_3_2">Demo</label></div>
<div class="tabbed-content">
<div class="tabbed-block">
<div class="highlight"><pre><span></span><code><span class="kd">var</span><span class="w"> </span><span class="nx">trial</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="p">{</span><span class="w"></span>
<span class="w"> </span><span class="nx">type</span><span class="o">:</span><span class="w"> </span><span class="nx">jsPsychBrowserCheck</span><span class="p">,</span><span class="w"></span>
<span class="w"> </span><span class="nx">minimum_width</span><span class="o">:</span><span class="w"> </span><span class="mf">1000</span><span class="p">,</span><span class="w"></span>
<span class="w"> </span><span class="nx">minimum_height</span><span class="o">:</span><span class="w"> </span><span class="mf">600</span><span class="w"></span>
<span class="p">};</span><span class="w"></span>
</code></pre></div>
</div>
<div class="tabbed-block">
<p><div style="text-align:center;">
<p>This demo only works in a resizable window. Please <a target="_blank" rel="noopener noreferrer" href="../../demos/jspsych-browser-check-demo3.html"> open it in new tab</a>
</div></p>
</div>
</div>
</div>
<p><a target="_blank" rel="noopener noreferrer" href="../../demos/jspsych-browser-check-demo3.html">Open demo in new tab</a></p>
</details>
<details class="example" open="open"><summary>Custom exclusion message based on measured features</summary><div class="tabbed-set tabbed-alternate" data-tabs="4:2"><input checked="checked" id="__tabbed_4_1" name="__tabbed_4" type="radio" /><input id="__tabbed_4_2" name="__tabbed_4" type="radio" /><div class="tabbed-labels"><label for="__tabbed_4_1">Code</label><label for="__tabbed_4_2">Demo</label></div>
<div class="tabbed-content">
<div class="tabbed-block">
<div class="highlight"><pre><span></span><code><span class="kd">var</span><span class="w"> </span><span class="nx">trial</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="p">{</span><span class="w"></span>
<span class="w"> </span><span class="nx">type</span><span class="o">:</span><span class="w"> </span><span class="nx">jsPsychBrowserCheck</span><span class="p">,</span><span class="w"></span>
<span class="w"> </span><span class="nx">inclusion_function</span><span class="o">:</span><span class="w"> </span><span class="p">(</span><span class="nx">data</span><span class="p">)</span><span class="w"> </span><span class="p">=&gt;</span><span class="w"> </span><span class="p">{</span><span class="w"></span>
<span class="w"> </span><span class="k">return</span><span class="w"> </span><span class="nx">data</span><span class="p">.</span><span class="nx">browser</span><span class="w"> </span><span class="o">==</span><span class="w"> </span><span class="s1">&#39;chrome&#39;</span><span class="w"> </span><span class="o">&amp;&amp;</span><span class="w"> </span><span class="nx">data</span><span class="p">.</span><span class="nx">mobile</span><span class="w"> </span><span class="o">===</span><span class="w"> </span><span class="kc">false</span><span class="w"></span>
<span class="w"> </span><span class="p">},</span><span class="w"></span>
<span class="w"> </span><span class="nx">exclusion_message</span><span class="o">:</span><span class="w"> </span><span class="p">(</span><span class="nx">data</span><span class="p">)</span><span class="w"> </span><span class="p">=&gt;</span><span class="w"> </span><span class="p">{</span><span class="w"></span>
<span class="w"> </span><span class="k">if</span><span class="p">(</span><span class="nx">data</span><span class="p">.</span><span class="nx">mobile</span><span class="p">){</span><span class="w"></span>
<span class="w"> </span><span class="k">return</span><span class="w"> </span><span class="s1">&#39;&lt;p&gt;You must use a desktop/laptop computer to participate in this experiment.&lt;/p&gt;&#39;</span><span class="p">;</span><span class="w"></span>
<span class="w"> </span><span class="p">}</span><span class="w"> </span><span class="k">else</span><span class="w"> </span><span class="k">if</span><span class="p">(</span><span class="nx">data</span><span class="p">.</span><span class="nx">browser</span><span class="w"> </span><span class="o">!==</span><span class="w"> </span><span class="s1">&#39;chrome&#39;</span><span class="p">){</span><span class="w"></span>
<span class="w"> </span><span class="k">return</span><span class="w"> </span><span class="s1">&#39;&lt;p&gt;You must use Chrome as your browser to complete this experiment.&lt;/p&gt;&#39;</span><span class="w"></span>
<span class="w"> </span><span class="p">}</span><span class="w"></span>
<span class="w"> </span><span class="p">}</span><span class="w"></span>
<span class="p">};</span><span class="w"></span>
</code></pre></div>
</div>
<div class="tabbed-block">
<p><div style="text-align:center;">
<iframe src="../../demos/jspsych-browser-check-demo4.html" width="90%;" height="500px;" frameBorder="0"></iframe>
</div></p>
</div>
</div>
</div>
<p><a target="_blank" rel="noopener noreferrer" href="../../demos/jspsych-browser-check-demo4.html">Open demo in new tab</a></p>
</details>
</article>
</div>
</div>
</main>
<footer class="md-footer">
<nav class="md-footer__inner md-grid" aria-label="Footer">
<a href="../audio-slider-response/" class="md-footer__link md-footer__link--prev" aria-label="Previous: audio-slider-response" 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>
audio-slider-response
</div>
</div>
</a>
<a href="../call-function/" class="md-footer__link md-footer__link--next" aria-label="Next: call-function" rel="next">
<div class="md-footer__title">
<div class="md-ellipsis">
<span class="md-footer__direction">
Next
</span>
call-function
</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-copyright">
<div class="md-copyright__highlight">
Copyright &copy; 2012-2022 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-social">
<a href="https://github.com/jspsych" target="_blank" rel="noopener" title="github.com" class="md-social__link">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><!--! Font Awesome Free 6.1.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2022 Fonticons, Inc.--><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-social__link">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Free 6.1.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2022 Fonticons, Inc.--><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": [], "search": "../../assets/javascripts/workers/search.2a1c317c.min.js", "translations": {"clipboard.copied": "Copied to clipboard", "clipboard.copy": "Copy to clipboard", "search.config.lang": "en", "search.config.pipeline": "trimmer, stopWordFilter", "search.config.separator": "[\\s\\-]+", "search.placeholder": "Search", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.placeholder": "Type to start searching", "search.result.term.missing": "Missing", "select.version.title": "Select version"}, "version": {"provider": "mike"}}</script>
<script src="../../assets/javascripts/bundle.ed9748b7.min.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink