HoshinoKoji/psychojs
1
0
Fork 0
mirror of https://github.com/psychopy/psychojs.git synced 2025-05-10 10:40:54 +00:00
Code Actions Packages Releases Activity
845a43338d
psychojs/docs/module-core.GUI.html
Alain Pitiot 845a43338d 3.1.4 docs
2019-07-08 09:07:09 +02:00

1863 lines
23 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: Class: GUI</title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>
<div id="main">
<h1 class="page-title">Class: GUI</h1>
<section>
<header>
<h2><span class="attribs"><span class="type-signature"></span></span>
<span class="ancestors"><a href="module-core.html">core</a>.</span>GUI<span class="signature">(psychoJS)</span><span class="type-signature"></span></h2>
<div class="class-description">Graphic User Interface</div>
</header>
<article>
<div class="container-overview">
<h2>Constructor</h2>
<h4 class="name" id="GUI"><span class="type-signature"></span>new GUI<span class="signature">(psychoJS)</span><span class="type-signature"></span></h4>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>psychoJS</code></td>
<td class="type">
<span class="param-type"><a href="PsychoJS.html">PsychoJS</a></span>
</td>
<td class="description last">the PsychoJS instance</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line18">line 18</a>
</li></ul></dd>
</dl>
</div>
<h3 class="subsection-title">Members</h3>
<h4 class="name" id="_getDialogSize"><span class="type-signature">(private) </span>_getDialogSize<span class="type-signature"></span></h4>
<div class="description">
Get the size of the dialog.
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line551">line 551</a>
</li></ul></dd>
</dl>
<h4 class="name" id="dialogMargin"><span class="type-signature">(readonly) </span>dialogMargin<span class="type-signature"> :Symbol</span></h4>
<div class="description">
Dialog window margins.
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Symbol</span>
</li>
</ul>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line604">line 604</a>
</li></ul></dd>
</dl>
<h4 class="name" id="dialogMaxSize"><span class="type-signature">(readonly) </span>dialogMaxSize<span class="type-signature"> :Symbol</span></h4>
<div class="description">
Maximal dimensions of the dialog window.
</div>
<h5>Type:</h5>
<ul>
<li>
<span class="param-type">Symbol</span>
</li>
</ul>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line593">line 593</a>
</li></ul></dd>
</dl>
<h3 class="subsection-title">Methods</h3>
<h4 class="name" id="_dialogOpen"><span class="type-signature">(private) </span>_dialogOpen<span class="signature">(dialogId)</span><span class="type-signature"> &rarr; {function}</span></h4>
<div class="description">
Get the jQuery UI callback for opening the given dialog in the middle of the screen.
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>dialogId</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">the dialog ID</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line362">line 362</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
jquery ui open function
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">function</span>
</dd>
</dl>
<h4 class="name" id="_dialogResize"><span class="type-signature">(private) </span>_dialogResize<span class="signature">(dialogId)</span><span class="type-signature"></span></h4>
<div class="description">
Ensure that the browser window's resize events redimension and reposition the dialog UI.
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>dialogId</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">the dialog ID</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line393">line 393</a>
</li></ul></dd>
</dl>
<h4 class="name" id="_estimateDialogScalingFactor"><span class="type-signature">(private) </span>_estimateDialogScalingFactor<span class="signature">()</span><span class="type-signature"> &rarr; {boolean}</span></h4>
<div class="description">
Estimate the scaling factor for the dialog popup windows.
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line520">line 520</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
whether or not the scaling factor is different from the previously estimated one
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">boolean</span>
</dd>
</dl>
<h4 class="name" id="_onKeyChange"><span class="type-signature">(private) </span>_onKeyChange<span class="signature">(gui, event)</span><span class="type-signature"></span></h4>
<div class="description">
Listener for change event for required keys.
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>gui</code></td>
<td class="type">
<span class="param-type"><a href="module-core.GUI.html">module:core.GUI</a></span>
</td>
<td class="description last">this GUI</td>
</tr>
<tr>
<td class="name"><code>event</code></td>
<td class="type">
<span class="param-type">Event</span>
</td>
<td class="description last">event</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line568">line 568</a>
</li></ul></dd>
</dl>
<h4 class="name" id="_onResourceEvents"><span class="type-signature">(private) </span>_onResourceEvents<span class="signature">(signal)</span><span class="type-signature"></span></h4>
<div class="description">
Listener for resource event from the <a href="ServerManager.html">Server Manager</a>.
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>signal</code></td>
<td class="type">
<span class="param-type">Object.&lt;string, (string|Symbol)></span>
</td>
<td class="description last">the signal</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line451">line 451</a>
</li></ul></dd>
</dl>
<h4 class="name" id="_updateOkButtonStatus"><span class="type-signature">(private) </span>_updateOkButtonStatus<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Update the status of the OK button.
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line501">line 501</a>
</li></ul></dd>
</dl>
<h4 class="name" id="dialog"><span class="type-signature"></span>dialog<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Destroy the currently opened dialog box.
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line433">line 433</a>
</li></ul></dd>
</dl>
<h4 class="name" id="dialog"><span class="type-signature"></span>dialog<span class="signature">(options)</span><span class="type-signature"></span></h4>
<div class="description">
Show a message to the participant in a dialog box.
<p>This function can be used to display both warning and error messages.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="description last">
<h6>Properties</h6>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>message</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
</td>
<td class="default">
</td>
<td class="description last">the message to be displayed</td>
</tr>
<tr>
<td class="name"><code>error</code></td>
<td class="type">
<span class="param-type">Object.&lt;string, *></span>
</td>
<td class="attributes">
</td>
<td class="default">
</td>
<td class="description last">an exception</td>
</tr>
<tr>
<td class="name"><code>warning</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
</td>
<td class="default">
</td>
<td class="description last">a warning message</td>
</tr>
<tr>
<td class="name"><code>showOK</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="default">
true
</td>
<td class="description last">specifies whether to show the OK button</td>
</tr>
<tr>
<td class="name"><code>onOK</code></td>
<td class="type">
<span class="param-type"><a href="GUI.html#.onOK">GUI.onOK</a></span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="default">
</td>
<td class="description last">function called when the participant presses the OK button</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line251">line 251</a>
</li></ul></dd>
</dl>
<h4 class="name" id="DlgFromDict"><span class="type-signature"></span>DlgFromDict<span class="signature">(options)</span><span class="type-signature"></span></h4>
<div class="description">
<p>Create a dialog box that (a) enables the participant to set some
experimental values (e.g. the session name), (b) shows progress of resource
download, and (c) enables the partipant to cancel the experiment.</p>
<b>Setting experiment values</b>
<p>DlgFromDict displays an input field for all values in the dictionary.
It is possible to specify default values e.g.:</p>
<code>let expName = 'stroop';<br>
let expInfo = {'participant':'', 'session':'01'};<br>
psychoJS.schedule(psychoJS.gui.DlgFromDict({dictionary: expInfo, title: expName}));</code>
<p>If the participant cancels (by pressing Cancel or by closing the dialog box), then
the dictionary remains unchanged.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="description last">
<h6>Properties</h6>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>dictionary</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="description last">associative array of values for the participant to set</td>
</tr>
<tr>
<td class="name"><code>title</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">name of the project</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="core_GUI.js.html">core/GUI.js</a>, <a href="core_GUI.js.html#line42">line 42</a>
</li></ul></dd>
</dl>
</article>
</section>
</div>
<nav>
<h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-core.html">core</a></li><li><a href="module-data.html">data</a></li><li><a href="module-sound.html">sound</a></li><li><a href="module-util.html">util</a></li><li><a href="module-visual.html">visual</a></li></ul><h3>Classes</h3><ul><li><a href="module-core.BuilderKeyResponse.html">BuilderKeyResponse</a></li><li><a href="module-core.EventManager.html">EventManager</a></li><li><a href="module-core.GUI.html">GUI</a></li><li><a href="module-core.Keyboard.html">Keyboard</a></li><li><a href="module-core.KeyPress.html">KeyPress</a></li><li><a href="module-core.MinimalStim.html">MinimalStim</a></li><li><a href="module-core.Mouse.html">Mouse</a></li><li><a href="module-core.PsychoJS.html">PsychoJS</a></li><li><a href="module-core.ServerManager.html">ServerManager</a></li><li><a href="module-core.Window.html">Window</a></li><li><a href="module-data.ExperimentHandler.html">ExperimentHandler</a></li><li><a href="module-data.TrialHandler.html">TrialHandler</a></li><li><a href="module-sound.Sound.html">Sound</a></li><li><a href="module-sound.TonePlayer.html">TonePlayer</a></li><li><a href="module-sound.TrackPlayer.html">TrackPlayer</a></li><li><a href="module-util.Clock.html">Clock</a></li><li><a href="module-util.Color.html">Color</a></li><li><a href="module-util.CountdownTimer.html">CountdownTimer</a></li><li><a href="module-util.EventEmitter.html">EventEmitter</a></li><li><a href="module-util.Logger.html">Logger</a></li><li><a href="module-util.MixinBuilder.html">MixinBuilder</a></li><li><a href="module-util.MonotonicClock.html">MonotonicClock</a></li><li><a href="module-util.PsychObject.html">PsychObject</a></li><li><a href="module-util.Scheduler.html">Scheduler</a></li><li><a href="module-visual.ImageStim.html">ImageStim</a></li><li><a href="module-visual.MovieStim.html">MovieStim</a></li><li><a href="module-visual.Rect.html">Rect</a></li><li><a href="module-visual.ShapeStim.html">ShapeStim</a></li><li><a href="module-visual.Slider.html">Slider</a></li><li><a href="module-visual.TextStim.html">TextStim</a></li><li><a href="module-visual.VisualStim.html">VisualStim</a></li></ul><h3>Mixins</h3><ul><li><a href="module-core.WindowMixin.html">WindowMixin</a></li><li><a href="module-util.ColorMixin.html">ColorMixin</a></li></ul><h3>Interfaces</h3><ul><li><a href="module-sound.SoundPlayer.html">SoundPlayer</a></li></ul><h3>Global</h3><ul><li><a href="global.html#offerDataForDownload">offerDataForDownload</a></li></ul>
</nav>
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.5</a> on Mon Jul 08 2019 09:06:18 GMT+0200 (CEST)
</footer>
<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>
View Git Blame Copy Permalink