Merge pull request #317 from jodeleeuw/no-jquery

Remove all jQuery, implement testing framework
2025-05-12 16:48:12 +00:00 · 2017-01-04 15:42:47 -05:00 · 2017-01-04 15:42:47 -05:00 · a89b993efe
commit a89b993efe
parent 95c6238c8e 0240b9f6c9
133 changed files with 1427 additions and 761 deletions
--- a/.gitignore
+++ b/.gitignore
@ -1,3 +1,3 @@
-
+node_modules/
 .DS_Store
 Thumbs.db
--- a/.travis.yml
+++ b/.travis.yml
@ -0,0 +1,3 @@
+language: node_js
+node_js:
+  - "6.6"
--- a/README.md
+++ b/README.md
@ -32,7 +32,7 @@ Wondering if jsPsych can be used for research that depends on accurate response
 * [de Leeuw, J. R., & Motz, B. A. (2016). Psychophysics in a Web browser? Comparing response times collected with JavaScript and Psychophysics Toolbox in a visual search task. *Behavior Research Methods*, *48*(1), 1-12.](http://link.springer.com/article/10.3758%2Fs13428-015-0567-2)
 * [Hilbig, B. E. (in press). Reaction time effects in lab- versus web-based research: Experimental evidence. *Behavior Research Methods*.](http://dx.doi.org/10.3758/s13428-015-0678-9)
 * [Pinet, S., Zielinski, C., Mathôt, S. et al. (in press). Measuring sequences of keystrokes with jsPsych: Reliability of response times and interkeystroke intervals.  *Behavior Research Methods*.](http://link.springer.com/article/10.3758/s13428-016-0776-3)
-* [Reimers, S., & Stewart, N. (2014). Presentation and response time accuracy in Adobe Flash and HTML5/JavaScript Web experiments. *Behavior Research Methods*, *47*(2), 309-327.](http://link.springer.com/article/10.3758%2Fs13428-014-0471-1)
+* [Reimers, S., & Stewart, N. (2015). Presentation and response time accuracy in Adobe Flash and HTML5/JavaScript Web experiments. *Behavior Research Methods*, *47*(2), 309-327.](http://link.springer.com/article/10.3758%2Fs13428-014-0471-1)


 Credits
--- a/css/jspsych.css
+++ b/css/jspsych.css
@ -12,11 +12,25 @@
   flex-direction: column;
   justify-content: center;
   align-items: center;
-   height: 100%;
-   width: 100%;
+   /*height: 100%;
+   width: 100%;*/
   overflow-y: scroll;
 }

+ .jspsych-content-wrapper {
+   display: flex;
+   justify-content: center;
+   align-items: center;
+   flex: 1 1 100%;
+   width: 100%;
+ }
+
+ .jspsych-content {
+   max-width: 95%; /* this is mainly an IE 10-11 fix */
+   text-align: center;
+   /*margin: auto;*/
+ }
+
 .jspsych-top {
   align-items: flex-start;
 }
@ -25,19 +39,7 @@
   align-items: center;
 }

- .jspsych-content {
-   max-width: 95%; /* this is mainly an IE 10-11 fix */
-   text-align:center;
-   margin: auto;
- }

- .jspsych-content-wrapper {
-   display: flex;
-   justify-content: center;
-   align-items: center;
-   flex: 1 1 auto;
-   width: 100%;
- }

 /* fonts and type */

--- a/docs/markdown_docs/core_library/jspsych-core.md
+++ b/docs/markdown_docs/core_library/jspsych-core.md
@ -166,7 +166,6 @@ var after_block = {
 }

 jsPsych.init({
-  display_element: $('#jspsych-target'),
  timeline: [block, after_block],
  on_finish: function() {
    jsPsych.data.displayData();
@ -264,7 +263,7 @@ None.

 ### Return value

-Returns the jQuery-object that contains the DOM element used for displaying the experiment.
+Returns the HTML DOM element used for displaying the experiment.

 ### Description

@ -276,7 +275,7 @@ Get the DOM element that displays the experiment.
 var el = jsPsych.getDisplayElement();

 // hide the jsPsych display
-el.hide();
+el.style.visibility = 'hidden';
 ```
 ---
 ## jsPsych.init
@ -296,7 +295,7 @@ The settings object can contain several parameters. The only *required* paramete
 Parameter | Type | Description
 --------- | ---- | -----------
 timeline | array | An array containing the objects that describe the experiment timeline. See [Creating an Experiment: The Timeline](../features/timeline.md).
-display_element | jQuery object | A jQuery-selected DOM element, e.g., `$('#target')` selects the element with the `id='target'` attribute. If left blank, then jsPsych will use the `<body>` element to display content (creating it if necessary). You can override this parameter at the trial level as well by specifying a display_element property on any timeline.
+display_element | string | The ID of an HTML element to display the experiment in. If left blank, then jsPsych will use the `<body>` element to display content (creating it if necessary). You can override this parameter at the trial level as well by specifying a display_element property on any timeline.
 on_finish | function | Function to execute when the experiment ends.
 on_trial_start | function | Function to execute when a new trial begins.
 on_trial_finish | function | Function to execute when a trial ends.
--- a/docs/markdown_docs/features/timeline.md
+++ b/docs/markdown_docs/features/timeline.md
@ -283,7 +283,6 @@ var after_if_trial = {
 }

 jsPsych.init({
-	display_element: $('#jspsych-target'),
 	timeline: [pre_if_trial, if_node, after_if_trial],
 	on_finish: function(){jsPsych.data.displayData(); }
 });
--- a/tests&examples/add-to-end-of-timeline.html
+++ b/tests&examples/add-to-end-of-timeline.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-text.js"></script>
    <script src="../plugins/jspsych-single-stim.js"></script>
--- a/tests&examples/all-keys-no-keys.html
+++ b/tests&examples/all-keys-no-keys.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/conditional-and-loop-functions.html
+++ b/tests&examples/conditional-and-loop-functions.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-text.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
@ -55,7 +55,8 @@

  jsPsych.init({
    timeline: [loop_node, pre_if_trial, if_node, after_if_trial],
-    on_finish: function(){jsPsych.data.displayData(); }
+    on_finish: function(){jsPsych.data.displayData(); },
+    default_iti: 200
  });

  </script>
--- a/tests&examples/conditional-first-trial.html
+++ b/tests&examples/conditional-first-trial.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-text.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/css/jquery-ui.css
+++ b/tests&examples/css/jquery-ui.css
--- a/tests&examples/data-add-properties.html
+++ b/tests&examples/data-add-properties.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/data-add-to-last-trial.html
+++ b/tests&examples/data-add-to-last-trial.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/data-as-function.html
+++ b/tests&examples/data-as-function.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/data-filters.html
+++ b/tests&examples/data-filters.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-text.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/data-from-timeline.html
+++ b/tests&examples/data-from-timeline.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/data-from-url.html
+++ b/tests&examples/data-from-url.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
    <style>
--- a/tests&examples/data-ignore.html
+++ b/tests&examples/data-ignore.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/demo-flanker.html
+++ b/tests&examples/demo-flanker.html
@ -2,7 +2,7 @@
 <html>
    <head>
        <title>Flanker Task</title>
-        <script src="js/jquery.min.js"></script>
+        
        <script src="../jspsych.js"></script>
        <script src="../plugins/jspsych-text.js"></script>
        <script src="../plugins/jspsych-single-stim.js"></script>
--- a/tests&examples/demo-simple-rt-task.html
+++ b/tests&examples/demo-simple-rt-task.html
@ -2,7 +2,6 @@
 <html>
  <head>
    <title>My experiment</title>
-    <script src="js/jquery.min.js"></script>
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-text.js"></script>
    <script src="../plugins/jspsych-single-stim.js"></script>
--- a/tests&examples/end-active-node.html
+++ b/tests&examples/end-active-node.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/end-experiment.html
+++ b/tests&examples/end-experiment.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/error-messages-for-bad-experiment-structures.html
+++ b/tests&examples/error-messages-for-bad-experiment-structures.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
    <style>
--- a/tests&examples/error-messages-for-no-plugin.html
+++ b/tests&examples/error-messages-for-no-plugin.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
    <style>
@ -23,7 +23,6 @@

  // should get error message in console about no plugin loaded
  jsPsych.init({
-    display_element: $('#jspsych-target'),
    timeline: [block_1]
  });

--- a/tests&examples/exclusions.html
+++ b/tests&examples/exclusions.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/external_html/simple_consent.html
+++ b/tests&examples/external_html/simple_consent.html
--- a/tests&examples/fullscreen-mouse-bug.html
+++ b/tests&examples/fullscreen-mouse-bug.html
@ -2,15 +2,12 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-text.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
 </head>

-<body>
-  <div id="jspsych-target"></div>
-</body>
 <script>
  var block_1 = {
    type: 'text',
@ -19,7 +16,6 @@
  }

  jsPsych.init({
-    display_element: $('#jspsych-target'),
    timeline: [block_1],
    fullscreen: true,
    on_finish: function() {
--- a/tests&examples/fullscreen.html
+++ b/tests&examples/fullscreen.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/function-parameters-reset.html
+++ b/tests&examples/function-parameters-reset.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-text.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/hierarchical-data.html
+++ b/tests&examples/hierarchical-data.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-text.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
--- a/tests&examples/img/1.gif
+++ b/tests&examples/img/1.gif
--- a/tests&examples/img/10.gif
+++ b/tests&examples/img/10.gif
--- a/tests&examples/img/11.gif
+++ b/tests&examples/img/11.gif
--- a/tests&examples/img/12.gif
+++ b/tests&examples/img/12.gif
--- a/tests&examples/img/2.gif
+++ b/tests&examples/img/2.gif
--- a/tests&examples/img/3.gif
+++ b/tests&examples/img/3.gif
--- a/tests&examples/img/4.gif
+++ b/tests&examples/img/4.gif
--- a/tests&examples/img/5.gif
+++ b/tests&examples/img/5.gif
--- a/tests&examples/img/6.gif
+++ b/tests&examples/img/6.gif
--- a/tests&examples/img/7.gif
+++ b/tests&examples/img/7.gif
--- a/tests&examples/img/8.gif
+++ b/tests&examples/img/8.gif
--- a/tests&examples/img/9.gif
+++ b/tests&examples/img/9.gif
--- a/tests&examples/img/backwardN.gif
+++ b/tests&examples/img/backwardN.gif
--- a/tests&examples/img/blue.png
+++ b/tests&examples/img/blue.png
--- a/tests&examples/img/con1.png
+++ b/tests&examples/img/con1.png
--- a/tests&examples/img/con2.png
+++ b/tests&examples/img/con2.png
--- a/tests&examples/img/fixation.gif
+++ b/tests&examples/img/fixation.gif
--- a/tests&examples/img/happy_face_1.jpg
+++ b/tests&examples/img/happy_face_1.jpg
--- a/tests&examples/img/happy_face_2.jpg
+++ b/tests&examples/img/happy_face_2.jpg
--- a/tests&examples/img/happy_face_3.jpg
+++ b/tests&examples/img/happy_face_3.jpg
--- a/tests&examples/img/happy_face_4.jpg
+++ b/tests&examples/img/happy_face_4.jpg
--- a/tests&examples/img/inc1.png
+++ b/tests&examples/img/inc1.png
--- a/tests&examples/img/inc2.png
+++ b/tests&examples/img/inc2.png
--- a/tests&examples/img/normalN.gif
+++ b/tests&examples/img/normalN.gif
--- a/tests&examples/img/orange.png
+++ b/tests&examples/img/orange.png
--- a/tests&examples/img/sad_face_1.jpg
+++ b/tests&examples/img/sad_face_1.jpg
--- a/tests&examples/img/sad_face_2.jpg
+++ b/tests&examples/img/sad_face_2.jpg
--- a/tests&examples/img/sad_face_3.jpg
+++ b/tests&examples/img/sad_face_3.jpg
--- a/tests&examples/img/sad_face_4.jpg
+++ b/tests&examples/img/sad_face_4.jpg
--- a/tests&examples/js/snap.svg-min.js
+++ b/tests&examples/js/snap.svg-min.js
--- a/tests&examples/jspsych-animation.html
+++ b/tests&examples/jspsych-animation.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-animation.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-button-response.html
+++ b/tests&examples/jspsych-button-response.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-button-response.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-call-function.html
+++ b/tests&examples/jspsych-call-function.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-call-function.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-categorize-animation.html
+++ b/tests&examples/jspsych-categorize-animation.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-categorize-animation.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-categorize.html
+++ b/tests&examples/jspsych-categorize.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-categorize.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-free-sort.html
+++ b/tests&examples/jspsych-free-sort.html
@ -1,11 +1,8 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
-    <script src="js/jquery-ui.min.js"></script>
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-free-sort.js"></script>
-    <link rel="stylesheet" href="css/jquery-ui.css"></link>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
  </head>
  <script>
--- a/tests&examples/jspsych-html.html
+++ b/tests&examples/jspsych-html.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-html.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
@ -16,7 +16,7 @@
    */

  var check_consent = function(elem) {
-    if ($('#consent_checkbox').is(':checked')) {
+    if (document.getElementById('consent_checkbox').checked) {
      return true;
    } else {
      alert("If you wish to participate, you must check the box next to the statement 'I agree to participate in this study.'");
--- a/tests&examples/jspsych-instructions.html
+++ b/tests&examples/jspsych-instructions.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-instructions.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-multi-stim-multi-response.html
+++ b/tests&examples/jspsych-multi-stim-multi-response.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-multi-stim-multi-response.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-palmer.html
+++ b/tests&examples/jspsych-palmer.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="js/snap.svg-min.js"></script>
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-palmer.js"></script>
--- a/tests&examples/jspsych-reconstruction.html
+++ b/tests&examples/jspsych-reconstruction.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-reconstruction.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-same-different.html
+++ b/tests&examples/jspsych-same-different.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-same-different.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-serial-reaction-time.html
+++ b/tests&examples/jspsych-serial-reaction-time.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-serial-reaction-time.js"></script>
  <script src="../plugins/jspsych-text.js"></script>
--- a/tests&examples/jspsych-similarity.html
+++ b/tests&examples/jspsych-similarity.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="js/jquery-ui.min.js"></script>
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-similarity.js"></script>
--- a/tests&examples/jspsych-single-audio.html
+++ b/tests&examples/jspsych-single-audio.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-single-audio.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-single-stim.html
+++ b/tests&examples/jspsych-single-stim.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-survey-likert.html
+++ b/tests&examples/jspsych-survey-likert.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-survey-likert.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-survey-multi-choice.html
+++ b/tests&examples/jspsych-survey-multi-choice.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-survey-multi-choice.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-survey-text.html
+++ b/tests&examples/jspsych-survey-text.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-survey-text.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-text.html
+++ b/tests&examples/jspsych-text.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-text.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-video.html
+++ b/tests&examples/jspsych-video.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-video.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/jspsych-visual-search-circle.html
+++ b/tests&examples/jspsych-visual-search-circle.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="js/snap.svg-min.js"></script>
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-text.js"></script>
--- a/tests&examples/jspsych-vsl-animate-occlusion.html
+++ b/tests&examples/jspsych-vsl-animate-occlusion.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="js/snap.svg-min.js"></script>
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-vsl-animate-occlusion.js"></script>
--- a/tests&examples/jspsych-vsl-grid-scene.html
+++ b/tests&examples/jspsych-vsl-grid-scene.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="js/snap.svg-min.js"></script>
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-vsl-grid-scene.js"></script>
--- a/tests&examples/jspsych-xab.html
+++ b/tests&examples/jspsych-xab.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-xab.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/lexical-decision.html
+++ b/tests&examples/lexical-decision.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-text.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
--- a/tests&examples/pause-unpause.html
+++ b/tests&examples/pause-unpause.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-text.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
--- a/tests&examples/progress-bar.html
+++ b/tests&examples/progress-bar.html
@ -1,8 +1,6 @@
 <!DOCTYPE html>
 <html>
-
 <head>
-  <script src="js/jquery.min.js"></script>
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <script src="../plugins/jspsych-text.js"></script>
@ -12,7 +10,7 @@
      width: 300px;
    }
  </style>
-</head>
+
 <script>
  var trial_1 = {
    type: 'single-stim',
@ -52,12 +50,12 @@


  jsPsych.init({
-    timeline: [trial_1, trial_2, trial_3, block_set, end_screen],
+    timeline: [trial_1, trial_2, trial_3], //block_set, end_screen],
    show_progress_bar: true,
    on_finish: function() {
      jsPsych.data.displayData();
    }
  });
 </script>
-
+</head>
 </html>
--- a/tests&examples/randomization-module.html
+++ b/tests&examples/randomization-module.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
    <style>
--- a/tests&examples/randomize-order.html
+++ b/tests&examples/randomize-order.html
@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <script src="js/jquery.min.js"></script>
+    
    <script src="../jspsych.js"></script>
    <script src="../plugins/jspsych-text.js"></script>
    <link rel="stylesheet" href="../css/jspsych.css"></link>
@ -32,7 +32,6 @@
  }

  jsPsych.init({
-    display_element: $('#jspsych-target'),
    timeline: [first,overall],
    default_iti: 0,
    on_finish: function() { jsPsych.data.displayData(); }
--- a/tests&examples/sound/hammer.mp3
+++ b/tests&examples/sound/hammer.mp3
--- a/tests&examples/sound/sound.mp3
+++ b/tests&examples/sound/sound.mp3
--- a/tests&examples/timeline-variables-sampling.html
+++ b/tests&examples/timeline-variables-sampling.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
@ -42,7 +42,6 @@
  }

  jsPsych.init({
-    display_element: $('#jspsych-target'),
    timeline: [node],
    on_finish: function() {
      jsPsych.data.displayData();
--- a/tests&examples/timeline-variables.html
+++ b/tests&examples/timeline-variables.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <script src="../plugins/jspsych-single-audio.js"></script>
@ -47,7 +47,6 @@

  jsPsych.pluginAPI.preloadAudioFiles(['sound/sound.mp3','sound/hammer.mp3'], function() {
    jsPsych.init({
-      display_element: $('#jspsych-target'),
      timeline: [node],
      on_finish: function() {
        jsPsych.data.displayData();
--- a/tests&examples/timing-post-trial-function.html
+++ b/tests&examples/timing-post-trial-function.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
@ -38,7 +38,6 @@
  }

  jsPsych.init({
-    display_element: $('#jspsych-target'),
    timeline: [block_1],
    on_finish: function() {
      jsPsych.data.displayData();
--- a/tests&examples/trial-level-display-element.html
+++ b/tests&examples/trial-level-display-element.html
@ -2,7 +2,7 @@
 <html>

 <head>
-  <script src="js/jquery.min.js"></script>
+  
  <script src="../jspsych.js"></script>
  <script src="../plugins/jspsych-single-stim.js"></script>
  <link rel="stylesheet" href="../css/jspsych.css"></link>
@ -29,7 +29,7 @@
  var trial_3 = {
    stimulus: '<p>:)</p>',
    is_html: true,
-    display_element: $('#jspsych-trial-target')
+    display_element: 'jspsych-trial-target'
  }

  var node = {
@ -44,7 +44,7 @@


  jsPsych.init({
-    display_element: $('#jspsych-target'),
+    display_element: 'jspsych-target',
    timeline: [node],
    on_finish: function() {
      jsPsych.data.displayData();
--- a/tests&examples/video/sample_video.mp4
+++ b/tests&examples/video/sample_video.mp4
--- a/jspsych.js
+++ b/jspsych.js
--- a/license.txt
+++ b/license.txt
@ -1,6 +1,6 @@
 The MIT License (MIT)

-Copyright (c) 2015 Joshua R. de Leeuw
+Copyright (c) 2014-2017 Joshua R. de Leeuw

 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
--- a/package.json
+++ b/package.json
@ -0,0 +1,25 @@
+{
+  "name": "jspsych",
+  "version": "6.0.0",
+  "description": "Behavioral experiments in a browser",
+  "main": "jspsych.js",
+  "directories": {
+    "doc": "docs"
+  },
+  "scripts": {
+    "test": "jest"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jodeleeuw/jsPsych.git"
+  },
+  "author": "Josh de Leeuw",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/jodeleeuw/jsPsych/issues"
+  },
+  "homepage": "https://github.com/jodeleeuw/jsPsych#readme",
+  "devDependencies": {
+    "jest": "^17.0.3"
+  }
+}
--- a/Show More
+++ b/Show More