From 25c99cc4c0da54b67df2abefba24a96e82dc6003 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Fri, 13 Dec 2024 11:49:36 +0100
Subject: [PATCH 01/17] Add a grammar for stimuli

---
 build.bash         |   3 +
 package.json       |  17 ++++
 plugins/grammar.ne | 149 +++++++++++++++++++++++++++++++
 plugins/parts.js   | 212 +++++++++++++++++++++++++++++++++++++++++++++
 4 files changed, 381 insertions(+)
 create mode 100755 build.bash
 create mode 100644 package.json
 create mode 100644 plugins/grammar.ne
 create mode 100644 plugins/parts.js

diff --git a/build.bash b/build.bash
new file mode 100755
index 0000000..66a93bd
--- /dev/null
+++ b/build.bash
@@ -0,0 +1,3 @@
+#!/bin/bash
+
+npx nearleyc -o ./plugins/grammar.js ./plugins/grammar.ne
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..23de4e6
--- /dev/null
+++ b/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "jspsych-spr-mw",
+  "version": "1.0.0",
+  "description": "## A self paced reading with moving window experiment using jsPsych",
+  "main": "main.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "./build.bash"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "moo": "^0.5.2",
+    "nearley": "^2.20.1"
+  }
+}
diff --git a/plugins/grammar.ne b/plugins/grammar.ne
new file mode 100644
index 0000000..04c9cca
--- /dev/null
+++ b/plugins/grammar.ne
@@ -0,0 +1,149 @@
+
+@{%
+    import * as parts from "./parts";
+
+    import * as moo from 'moo';
+
+    const lexer = moo.compile({
+        rec_group_start : "{{#"                 ,
+        group_start     : "{{"                  ,
+        group_end       : "}}"                  ,
+        bold_start      : /<[ ]*b[ ]*>/u        ,
+        bold_end        : /<[ ]*[/]b[ ]*>/u     ,
+        italic_start    : /<[ ]*i[ ]*>/u        ,
+        italic_end      : /<[ ]*[/]i[ ]*>/u     ,
+        word            : /\p{L}+/u             ,
+        ws              : /[ \r\t]+/u           ,
+        newline         : {match : "\n", lineBreaks: true},
+    })
+%}
+
+@lexer lexer
+
+# We parse a number of groups to present to the user.
+group_list ->
+      group                 # a single group can be a group_list
+    | group_list group      # a group may be a group followed by more groups
+    | group_list WS group   # allow white space between groups
+    | group_list WS         # allow trailing white space
+
+# A group starts with {{ or {{# and ends with a}} we don't allow empty groups
+# {{}} or {{#}}
+group ->
+	  %group_start sentence %group_end
+	| %rec_group_start sentence %group_end
+
+
+sentence ->
+	  Word                          {%
+                                        function(data) {
+                                            let sentence = new parts.SentenceList(
+                                                data[0].text_position,
+                                            );
+                                            sentence.push(data[0]);
+                                            return sentence;
+                                        }
+                                    %}
+	| WS                            {%
+                                        function(data) {
+                                            let sentence = new parts.SentenceList(
+                                                data[0].text_position,
+                                            );
+                                            sentence.push(data[0]);
+                                            return sentence;
+                                        }
+                                    %}
+    | special_sentence              {% id %}
+
+	| sentence Word                 {%
+                                        function(data) {
+                                            let sentence: parts.SentenceList;
+                                            sentence = data[0];
+                                            sentence.push(data[1]);
+                                            return sentence;
+                                        }
+                                    %}
+    | sentence WS                   {%
+                                        function(data) {
+                                            let sentence: parts.SentenceList;
+                                            sentence = data[0];
+                                            sentence.push(data[1]);
+                                            return sentence;
+                                        }
+                                    %}
+    | sentence special_sentence     {%
+                                        function(data) {
+                                            let sentence: parts.SentenceList;
+                                            let special_sentence: parts.SentenceList;
+
+                                            sentence = data[0];
+                                            special_sentence = data[1];
+
+                                            function append_to_sentence(
+                                                    part: parts.SentencePart)
+                                            {
+                                                sentence.parts.push(part);
+                                            }
+
+                                            special_sentence.parts.forEach(
+                                                append_to_sentence
+                                            )
+                                            return sentence;
+                                        }
+                                    %}
+
+special_sentence ->  # sentences in bold/italics
+      bold_sentence                 {% id %} # id just returns the first element.
+    | italic_sentence               {% id %}
+
+bold_sentence -> %bold_start sentence %bold_end {%
+                                        // drop italic_start and italic_end, return
+                                        // the sentence with all word marked italic.
+                                        function(data) {
+                                            let sentence_fragment: parts.SentenceList
+                                            sentence_fragment = data[1];
+                                            sentence_fragment.mark_bold();
+                                            return data[1]; // strip start and end
+                                        }
+                                    %}
+
+italic_sentence -> %italic_start sentence %italic_end {%
+                                        // drop italic_start and italic_end, return
+                                        // the sentence with all word marked italic.
+                                        function(data) {
+                                            let sentence_fragment: parts.SentenceList
+                                            sentence_fragment = data[1];
+                                            sentence_fragment.mark_italian();
+                                            return data[1]; // strip start and end
+                                        }
+                                    %}
+
+Word -> %word                       {%
+                                        function(data, pos) {
+                                            let word = new parts.Word(
+                                                data[0],
+                                                data[0].toString()
+                                            );
+                                            return word;
+                                        }
+                                    %}
+
+WS ->
+      %ws                           {%
+                                        function(data, pos) {
+                                            let ws = new parts.WhiteSpace(
+                                                data[0],
+                                                data[0].toString()
+                                            );
+                                            return ws;
+                                        }
+                                    %}
+    | %newline                      {%
+                                        function(data, pos) {
+                                            let ws = new parts.WhiteSpace(
+                                                data[0],
+                                                data[0].toString()
+                                            );
+                                            return ws;
+                                        }
+                                    %}
diff --git a/plugins/parts.js b/plugins/parts.js
new file mode 100644
index 0000000..058a13d
--- /dev/null
+++ b/plugins/parts.js
@@ -0,0 +1,212 @@
+
+/**
+ * Class representing the position of a portion of the grammar
+ */
+export class PositionInfo {
+
+    /**
+     * 
+     * @param {object} tokenised Where the token is found by the lexer
+     * @param {number} tokenised.col
+     * @param {number} tokenised.line
+     * @param {number} tokenised.lineBreaks
+     * @param {number} tokenised.offset
+     */
+    constructor(tokenised) {
+        try {
+            if (typeof tokenised.col !== "number") {
+                throw new TypeError("tokenised.column should be a number");
+            }
+            if (typeof tokenised.line !== "number") {
+                throw new TypeError("tokenised.line should be a number");
+            }
+            if (typeof tokenised.lineBreaks !== "number") {
+                throw new TypeError("tokenised.lineBreaks should be a number");
+            }
+            if (typeof tokenised.offset !== "number") {
+                throw new TypeError("tokenised.offset should be a number");
+            }
+        } catch (e) {
+            let breakpoint = e;
+        }
+
+        this.col = tokenised.col;
+        this.line = tokenised.line;
+        this.lineBreaks = tokenised.lineBreaks;
+        this.offset = tokenised.offset;
+    }
+}
+
+/**
+ * A grammar part is one symbol inside of the parsed text.
+ * It can be a terminal or non terminal part of the grammar.
+ */
+export class GrammarPart {
+
+    /**
+     * 
+     * @param {string} type_name What constinuent of the grammar this object is
+     * @param {PositionInfo} text_position Where is the constinuent in the parsed string
+     */
+    constructor(type_name, text_position) {
+        if (typeof typename !== "string") {
+            throw new TypeError("type_name should be a string");
+        }
+        if (typeof text_position !== "object") {
+            throw new TypeError("type_name should be an object");
+        }
+        this.grammar_type_name = type_name;
+        this.text_position = new PositionInfo(text_position);
+    }
+
+    /**
+     * 
+     * @returns {string} What kind of symbol of the grammar this is
+     */
+    get_type () {
+        return this.grammar_type_name;
+    }
+
+    /**
+     * 
+     * @returns {PositionInfo} Information about where this grammar symol
+     *                         is inside the text.
+     */
+    get_position() {
+        return this.text_position;
+    }
+}
+
+export class SentenceList extends GrammarPart {
+
+    /**
+     * 
+     * @param {PositionInfo} position 
+     */
+    constructor(position) {
+        super("SentenceList", position)
+        this.parts = [];
+    }
+
+    /**
+     * 
+     * @param {SentencePart} part 
+     */
+    push(part) {
+        if (part instanceof SentencePart)
+            this.parts.push(part);
+        else
+            throw new TypeError("Part was expected to be a SentencePart")
+    }
+
+    mark_bold() {
+        this.parts.forEach(
+            function(value) {
+                if (value.grammar_type_name == "Word") {
+                    wordval.mark_bold();
+                }
+            }
+        );
+    }
+    
+    mark_italian() {
+        this.parts.forEach(
+            function(value) {
+                if (value.grammar_type_name == "Word") {
+                    value.mark_italian();
+                }
+            }
+        );
+    }
+}
+
+export class SentencePart extends GrammarPart {
+
+    /**
+     * 
+     * @param {string} type 
+     * @param {PositionInfo} position 
+     * @param {string} content 
+     */
+    constructor(type, position, content) {
+        super(type, position);
+        if (typeof(content) !== "string")
+            throw TypeError("text is not a string.");
+        this.content = content;
+    }
+
+    get_content() {
+        return this.content;
+    }
+}
+
+export class Word extends SentencePart {
+
+    bold = false;
+    italian = false;
+
+    /**
+     * 
+     * @param {PositionInfo} position 
+     * @param {string} text 
+     */
+
+    constructor (position, text) {
+        super("Word", position, text);
+        this.bold = false;
+        this.italic = false
+    }
+
+    mark_bold() {this.bold = true;}
+    mark_italic() {this.italic = true;}
+}
+
+export class WhiteSpace extends SentencePart {
+
+    /**
+     * 
+     * @param {PositionInfo} position 
+     * @param {string} text 
+     */
+    constructor (position, text) {
+        super("WhiteSpace", position, text);
+    }
+};
+
+
+export class Group extends GrammarPart {
+
+    /**
+     * @param {PositionInfo} position 
+     * @param {boolean} record 
+     * @param {SentenceList} sentence_parts 
+     */
+    constructor(position, record, sentence_parts) {
+        super("Group", position);
+        if (typeof record !== "boolean")
+            throw new TypeError("Record was expected to be boolean")
+        this.record = record
+        this.sentence_parts = sentence_parts;
+    }
+}
+
+export class GroupList extends GrammarPart {
+    /**
+     * 
+     * @param {PositionInfo} position 
+     */
+    constructor (position) {
+        super("GroupList", position);
+        this.groups = []
+    }
+
+    /**
+     * Push a single group to the list of groups
+     * 
+     * @param {Group} group 
+     */
+    push(group) {
+        this.groups.push(group)
+    }
+};
+

From d086e9c7f03d3ba81d58ded970e29cc2a961ed48 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Mon, 16 Dec 2024 11:03:39 +0100
Subject: [PATCH 02/17] Setup npm project with nearley

---
 .gitignore                           |  6 ++++++
 build.bash                           |  2 +-
 package.json                         |  3 ++-
 plugins/.gitignore                   |  3 +++
 plugins/grammar.ne                   | 27 ++++++++++-----------------
 plugins/jspsych-spr-moving-window.js |  2 ++
 6 files changed, 24 insertions(+), 19 deletions(-)
 create mode 100644 plugins/.gitignore

diff --git a/.gitignore b/.gitignore
index d103455..0ccc27a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -9,3 +9,9 @@ upload-experiment.sh
 
 # Ignore the key used for testing purposes
 key.txt
+
+# node
+node_modules
+
+#vs code
+.vscode
diff --git a/build.bash b/build.bash
index 66a93bd..505713a 100755
--- a/build.bash
+++ b/build.bash
@@ -1,3 +1,3 @@
 #!/bin/bash
 
-npx nearleyc -o ./plugins/grammar.js ./plugins/grammar.ne
+npx nearleyc -o ./plugins/grammar.js ./plugins/grammar.ne -e spr_grammar
diff --git a/package.json b/package.json
index 23de4e6..eb4b16b 100644
--- a/package.json
+++ b/package.json
@@ -3,8 +3,9 @@
   "version": "1.0.0",
   "description": "## A self paced reading with moving window experiment using jsPsych",
   "main": "main.js",
+  "type": "module",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "./build.bash && node ./plugins/test.js",
     "build": "./build.bash"
   },
   "keywords": [],
diff --git a/plugins/.gitignore b/plugins/.gitignore
new file mode 100644
index 0000000..512979c
--- /dev/null
+++ b/plugins/.gitignore
@@ -0,0 +1,3 @@
+
+# ignore grammar.js as it is generated from grammar.ne using nearley
+grammar.js
diff --git a/plugins/grammar.ne b/plugins/grammar.ne
index 04c9cca..5d49732 100644
--- a/plugins/grammar.ne
+++ b/plugins/grammar.ne
@@ -1,8 +1,9 @@
 
 @{%
-    import * as parts from "./parts";
 
-    import * as moo from 'moo';
+    const parts = require("./parts.js");
+    const moo = require("moo");
+//    import * as moo from "moo";
 
     const lexer = moo.compile({
         rec_group_start : "{{#"                 ,
@@ -57,30 +58,24 @@ sentence ->
 
 	| sentence Word                 {%
                                         function(data) {
-                                            let sentence: parts.SentenceList;
-                                            sentence = data[0];
+                                            let sentence = data[0];
                                             sentence.push(data[1]);
                                             return sentence;
                                         }
                                     %}
     | sentence WS                   {%
                                         function(data) {
-                                            let sentence: parts.SentenceList;
-                                            sentence = data[0];
+                                            let sentence = data[0];
                                             sentence.push(data[1]);
                                             return sentence;
                                         }
                                     %}
     | sentence special_sentence     {%
                                         function(data) {
-                                            let sentence: parts.SentenceList;
-                                            let special_sentence: parts.SentenceList;
+                                            let sentence = data[0];
+                                            let special_sentence = data[1];
 
-                                            sentence = data[0];
-                                            special_sentence = data[1];
-
-                                            function append_to_sentence(
-                                                    part: parts.SentencePart)
+                                            function append_to_sentence(part)
                                             {
                                                 sentence.parts.push(part);
                                             }
@@ -100,8 +95,7 @@ bold_sentence -> %bold_start sentence %bold_end {%
                                         // drop italic_start and italic_end, return
                                         // the sentence with all word marked italic.
                                         function(data) {
-                                            let sentence_fragment: parts.SentenceList
-                                            sentence_fragment = data[1];
+                                            let sentence_fragment = data[1];
                                             sentence_fragment.mark_bold();
                                             return data[1]; // strip start and end
                                         }
@@ -111,8 +105,7 @@ italic_sentence -> %italic_start sentence %italic_end {%
                                         // drop italic_start and italic_end, return
                                         // the sentence with all word marked italic.
                                         function(data) {
-                                            let sentence_fragment: parts.SentenceList
-                                            sentence_fragment = data[1];
+                                            let sentence_fragment = data[1];
                                             sentence_fragment.mark_italian();
                                             return data[1]; // strip start and end
                                         }
diff --git a/plugins/jspsych-spr-moving-window.js b/plugins/jspsych-spr-moving-window.js
index 3ce0d5b..3e21be0 100644
--- a/plugins/jspsych-spr-moving-window.js
+++ b/plugins/jspsych-spr-moving-window.js
@@ -1,3 +1,5 @@
+
+
 var sprMovingWindow = (function(jspsych) {
 
     const SPR_MW_PLUGIN_NAME = 'spr-moving-window';

From 8d3dac02930e55a092c90a5288722a3269bc4594 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Mon, 16 Dec 2024 11:03:59 +0100
Subject: [PATCH 03/17] Wish list of features to add

---
 index.html |  2 ++
 main.js    |  1 +
 stimuli.js | 16 +++++++++++++++-
 3 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 73d37b5..8fb1be6 100644
--- a/index.html
+++ b/index.html
@@ -29,6 +29,8 @@
         <!--maybe one day this plugin will be put in the mainline jsPsych
              repository.-->
         <script src="plugins/jspsych-spr-moving-window.js"></script>
+        <script type="module" src="plugins/grammar.js"></script>
+        <script type="module" src="plugins/parts.js"></script>
 
         <script src="main.js"></script>
         <style>
diff --git a/main.js b/main.js
index 5e9eb8c..c856d2a 100644
--- a/main.js
+++ b/main.js
@@ -209,6 +209,7 @@ function main() {
 
     // Option 1: client side randomization:
     let stimuli = pickRandomList();
+    checkStimuliSyntax(stimuli.table);
     kickOffExperiment(getTimeline(stimuli.table), stimuli.list_name);
 
     // Option 2: server side balancing:
diff --git a/stimuli.js b/stimuli.js
index f4114fc..60e01d7 100644
--- a/stimuli.js
+++ b/stimuli.js
@@ -158,4 +158,18 @@ const TEST_ITEMS = [
     // {list_name: LISTS[1], table: LIST_GROUP3}
 ];
 
-
+/**
+ * 
+ * @param {Array.<object>} trials is a list of trials
+ * @param {Array.<object>.stimulus} stimulus a stimulus for this trial
+ * 
+ */
+function checkStimuliSyntax(list )
+{
+    list.forEach(trial => {
+        const parser = new nearley.Parser(nearley.Grammar.fromCompiled(spr_grammar))
+        parser.feed(trial.stimulus)
+        tree = parser.results
+        console.log()
+    });
+}

From 7fbc272effce58122d344a6817b1976c791e8626 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Mon, 16 Dec 2024 14:29:47 +0100
Subject: [PATCH 04/17] Build with esbuild

---
 build.bash                           |  4 ++++
 index.html                           | 11 +++--------
 main.js                              |  8 ++++++++
 package.json                         |  6 ++++--
 plugins/jspsych-spr-moving-window.js | 25 ++++++++++++++++++++++---
 plugins/parts.js                     |  6 +++---
 stimuli.js                           | 15 ---------------
 7 files changed, 44 insertions(+), 31 deletions(-)

diff --git a/build.bash b/build.bash
index 505713a..7b0fff4 100755
--- a/build.bash
+++ b/build.bash
@@ -1,3 +1,7 @@
 #!/bin/bash
 
+# "Compile" grammar.js, from grammar.ne
 npx nearleyc -o ./plugins/grammar.js ./plugins/grammar.ne -e spr_grammar
+
+# package it using esbuild
+node ./build.mjs
diff --git a/index.html b/index.html
index 8fb1be6..9a9be13 100644
--- a/index.html
+++ b/index.html
@@ -28,11 +28,10 @@
 
         <!--maybe one day this plugin will be put in the mainline jsPsych
              repository.-->
-        <script src="plugins/jspsych-spr-moving-window.js"></script>
-        <script type="module" src="plugins/grammar.js"></script>
-        <script type="module" src="plugins/parts.js"></script>
+        <script type="module" src="dist/grammar.js"></script>
+        <script type="module" src="dist/parts.js"></script>
 
-        <script src="main.js"></script>
+        <script type="module" src="main.js"></script>
         <style>
             .jspsych-survey-multi-choice-text {
                 text-align: left !important;
@@ -42,8 +41,4 @@
 
     </head>
     <body></body>
-    <script>
-        // see main.js for the main function and experiment timeline
-        window.addEventListener('load', main);
-    </script>
 </html>
diff --git a/main.js b/main.js
index c856d2a..13d0cad 100644
--- a/main.js
+++ b/main.js
@@ -1,3 +1,8 @@
+import {
+    sprMovingWindow,
+    checkStimuliSyntax
+} from './dist/jspsych-spr-moving-window.js'
+
 let jsPsych = initJsPsych({
     exclusions: {
         min_width : MIN_WIDTH,
@@ -281,3 +286,6 @@ function findList(name) {
     }
     return list;
 }
+
+// start the experiment
+window.addEventListener('load', main);
diff --git a/package.json b/package.json
index eb4b16b..58d59ed 100644
--- a/package.json
+++ b/package.json
@@ -3,9 +3,8 @@
   "version": "1.0.0",
   "description": "## A self paced reading with moving window experiment using jsPsych",
   "main": "main.js",
-  "type": "module",
   "scripts": {
-    "test": "./build.bash && node ./plugins/test.js",
+    "test": "./build.bash && node ./dist/test.js",
     "build": "./build.bash"
   },
   "keywords": [],
@@ -14,5 +13,8 @@
   "dependencies": {
     "moo": "^0.5.2",
     "nearley": "^2.20.1"
+  },
+  "devDependencies": {
+    "esbuild": "0.24.0"
   }
 }
diff --git a/plugins/jspsych-spr-moving-window.js b/plugins/jspsych-spr-moving-window.js
index 3e21be0..9d0a2fb 100644
--- a/plugins/jspsych-spr-moving-window.js
+++ b/plugins/jspsych-spr-moving-window.js
@@ -1,6 +1,8 @@
 
+import * as spr_grammar from "./grammar.js";
+import * as nearley from "nearley";
 
-var sprMovingWindow = (function(jspsych) {
+export var sprMovingWindow = (function(jspsych) {
 
     const SPR_MW_PLUGIN_NAME = 'spr-moving-window';
 
@@ -171,9 +173,9 @@ var sprMovingWindow = (function(jspsych) {
         constructor(text, position, ctx, font_family, font_size) {
             if (typeof(text) !== "string")
                 console.error("TextInfo constructor text was not a String");
-            if (!position instanceof Pos)
+            if (!(position instanceof Pos))
                 console.error("TextInfo constructor position was not a Pos");
-            if (!ctx instanceof CanvasRenderingContext2D)
+            if (!(ctx instanceof CanvasRenderingContext2D))
                 console.error("TextInfo constructor cts was not a valid "+
                               "CanvasRenderingContext2D");
             if (typeof(font_family) !== "string")
@@ -583,3 +585,20 @@ var sprMovingWindow = (function(jspsych) {
     return SprMovingWindowPlugin;
 
 })(jsPsychModule);
+
+
+/**
+ * 
+ * @param {Array.<object>} trials is a list of trials
+ * @param {Array.<object>.stimulus} stimulus a stimulus for this trial
+ * 
+ */
+export function checkStimuliSyntax(list)
+{
+    list.forEach(trial => {
+        const parser = new nearley.Parser(nearley.Grammar.fromCompiled(spr_grammar))
+        parser.feed(trial.stimulus)
+        tree = parser.results
+        console.log()
+    });
+}
diff --git a/plugins/parts.js b/plugins/parts.js
index 058a13d..25ca518 100644
--- a/plugins/parts.js
+++ b/plugins/parts.js
@@ -49,7 +49,7 @@ export class GrammarPart {
      * @param {PositionInfo} text_position Where is the constinuent in the parsed string
      */
     constructor(type_name, text_position) {
-        if (typeof typename !== "string") {
+        if (typeof type_name !== "string") {
             throw new TypeError("type_name should be a string");
         }
         if (typeof text_position !== "object") {
@@ -103,7 +103,7 @@ export class SentenceList extends GrammarPart {
         this.parts.forEach(
             function(value) {
                 if (value.grammar_type_name == "Word") {
-                    wordval.mark_bold();
+                    value.mark_bold();
                 }
             }
         );
@@ -113,7 +113,7 @@ export class SentenceList extends GrammarPart {
         this.parts.forEach(
             function(value) {
                 if (value.grammar_type_name == "Word") {
-                    value.mark_italian();
+                    value.mark_italic();
                 }
             }
         );
diff --git a/stimuli.js b/stimuli.js
index 60e01d7..2260424 100644
--- a/stimuli.js
+++ b/stimuli.js
@@ -158,18 +158,3 @@ const TEST_ITEMS = [
     // {list_name: LISTS[1], table: LIST_GROUP3}
 ];
 
-/**
- * 
- * @param {Array.<object>} trials is a list of trials
- * @param {Array.<object>.stimulus} stimulus a stimulus for this trial
- * 
- */
-function checkStimuliSyntax(list )
-{
-    list.forEach(trial => {
-        const parser = new nearley.Parser(nearley.Grammar.fromCompiled(spr_grammar))
-        parser.feed(trial.stimulus)
-        tree = parser.results
-        console.log()
-    });
-}

From f0ccc403736c92821eb7e107a9f9902a27ad7668 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Mon, 16 Dec 2024 14:33:38 +0100
Subject: [PATCH 05/17] Remove scripts that are not necessary

---
 index.html | 2 --
 1 file changed, 2 deletions(-)

diff --git a/index.html b/index.html
index 9a9be13..df44a8f 100644
--- a/index.html
+++ b/index.html
@@ -28,8 +28,6 @@
 
         <!--maybe one day this plugin will be put in the mainline jsPsych
              repository.-->
-        <script type="module" src="dist/grammar.js"></script>
-        <script type="module" src="dist/parts.js"></script>
 
         <script type="module" src="main.js"></script>
         <style>

From c94de6af3d835e241176e4b8b298b75a317b9000 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Mon, 13 Jan 2025 10:39:03 +0100
Subject: [PATCH 06/17] Many updates to the spr-plugin

---
 plugins/.gitignore                   |  3 ++
 plugins/grammar.ne                   | 42 +++++++++++++++++++++++++---
 plugins/jspsych-spr-moving-window.js | 13 ++++++---
 plugins/parts.js                     |  4 +--
 4 files changed, 52 insertions(+), 10 deletions(-)

diff --git a/plugins/.gitignore b/plugins/.gitignore
index 512979c..54cf31d 100644
--- a/plugins/.gitignore
+++ b/plugins/.gitignore
@@ -1,3 +1,6 @@
 
 # ignore grammar.js as it is generated from grammar.ne using nearley
 grammar.js
+
+# a test script
+test.js
diff --git a/plugins/grammar.ne b/plugins/grammar.ne
index 5d49732..8c4d15f 100644
--- a/plugins/grammar.ne
+++ b/plugins/grammar.ne
@@ -1,9 +1,7 @@
 
 @{%
-
     const parts = require("./parts.js");
     const moo = require("moo");
-//    import * as moo from "moo";
 
     const lexer = moo.compile({
         rec_group_start : "{{#"                 ,
@@ -13,7 +11,7 @@
         bold_end        : /<[ ]*[/]b[ ]*>/u     ,
         italic_start    : /<[ ]*i[ ]*>/u        ,
         italic_end      : /<[ ]*[/]i[ ]*>/u     ,
-        word            : /\p{L}+/u             ,
+        word            : /\p{L}+|\p{P}+/u      ,
         ws              : /[ \r\t]+/u           ,
         newline         : {match : "\n", lineBreaks: true},
     })
@@ -24,15 +22,51 @@
 # We parse a number of groups to present to the user.
 group_list ->
       group                 # a single group can be a group_list
+            {%
+                function (data) {
+                    let list = new parts.GroupList(data[0].text_position)
+                    list.push(data[0])
+                    return list;
+                }
+            %}
     | group_list group      # a group may be a group followed by more groups
+            {%
+                function (data) {
+                    data[0].push(data[1])
+                    return data[0];
+                }
+            %}
     | group_list WS group   # allow white space between groups
+            {%
+                function (data) {
+                    data[0].push(data[2])
+                    return data[0];
+                }
+            %}
     | group_list WS         # allow trailing white space
+            {%
+                function (data) { // Just ignore the whitespace
+                    return data[0];
+                }
+            %}
 
 # A group starts with {{ or {{# and ends with a}} we don't allow empty groups
 # {{}} or {{#}}
 group ->
 	  %group_start sentence %group_end
+        {%
+            function (data) {
+                let group = new parts.Group(data[0], false, data[1]);
+                return group;
+            }
+        %}
 	| %rec_group_start sentence %group_end
+        {%
+            function(data) {
+                let group = new parts.Group(data[0], true, data[1]);
+                return group;
+            }
+        %}
 
 
 sentence ->
@@ -106,7 +140,7 @@ italic_sentence -> %italic_start sentence %italic_end {%
                                         // the sentence with all word marked italic.
                                         function(data) {
                                             let sentence_fragment = data[1];
-                                            sentence_fragment.mark_italian();
+                                            sentence_fragment.mark_italic();
                                             return data[1]; // strip start and end
                                         }
                                     %}
diff --git a/plugins/jspsych-spr-moving-window.js b/plugins/jspsych-spr-moving-window.js
index 9d0a2fb..4cb6eb7 100644
--- a/plugins/jspsych-spr-moving-window.js
+++ b/plugins/jspsych-spr-moving-window.js
@@ -404,8 +404,8 @@ export var sprMovingWindow = (function(jspsych) {
         const BASE_X = determineLineHeight(trial_pars.font_family, trial_pars.font_size);
 
         for (let line = 0; line < lines.length; line++) {
-            liney = BASE_Y + line * delta_y;
-            fragments = lines[line].split(RE_CAP_WHITE_SPACE);
+            let liney = BASE_Y + line * delta_y;
+            let fragments = lines[line].split(RE_CAP_WHITE_SPACE);
             fragments = fragments.filter( word => {return word != "";});
             let runningx = BASE_X;
             for (let fragment = 0; fragment < fragments.length; fragment++) {
@@ -598,7 +598,12 @@ export function checkStimuliSyntax(list)
     list.forEach(trial => {
         const parser = new nearley.Parser(nearley.Grammar.fromCompiled(spr_grammar))
         parser.feed(trial.stimulus)
-        tree = parser.results
-        console.log()
+        let tree = parser.results
+        if (tree.length > 1) {
+            console.log("Oops, grammar is ambiguous.");
+        }
+        else {
+            console.log(JSON.stringify(tree, null, "  "));
+        }
     });
 }
diff --git a/plugins/parts.js b/plugins/parts.js
index 25ca518..8433f50 100644
--- a/plugins/parts.js
+++ b/plugins/parts.js
@@ -109,7 +109,7 @@ export class SentenceList extends GrammarPart {
         );
     }
     
-    mark_italian() {
+    mark_italic() {
         this.parts.forEach(
             function(value) {
                 if (value.grammar_type_name == "Word") {
@@ -143,7 +143,7 @@ export class SentencePart extends GrammarPart {
 export class Word extends SentencePart {
 
     bold = false;
-    italian = false;
+    italic = false;
 
     /**
      * 

From 2fdd933ff64321b74737639983b2b237d7096144 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Mon, 13 Jan 2025 10:50:06 +0100
Subject: [PATCH 07/17] Update stimuli to current spr stimulus syntax

---
 stimuli.js | 86 +++++++++++++++++++++++++++++-------------------------
 1 file changed, 47 insertions(+), 39 deletions(-)

diff --git a/stimuli.js b/stimuli.js
index 2260424..fdcc3db 100644
--- a/stimuli.js
+++ b/stimuli.js
@@ -23,16 +23,24 @@ const PRACTICE_ITEMS = [
     {
         id : 1,
         item_type : PRAC,
-
-        stimulus :                                                // Single "/" delimit boundaries between words presented
-                                                                  // together. Boundaries must be activated by setting "/" as
-                                                                  // GROUPING_STRING in globals.js. The default is null
-                                                                  // which means every word is a group of in its own.
-                                                                  // If the grouping string isn't set or null,
-                                                                  // the "/" will be displayed instead of used for grouping.
-            "The teacher took the car instead of the express"   + // The '+' adds strings together or concatenates them.
-            "train \ndue to the previously announced public\n"  + // A "\n" makes the string jump to the next line.
-            "transport strike.\n",                                // use a comma here.
+        //Every word, space "enter" between a pair of {{ and }} is presented
+        //together as one group of words. If a group starts with a {{#, the reaction
+        //will be recorded. Don't put any characters outside of the {{}}} characters
+        //as the grammar for shaping the self paced reading doesn't like that.
+        //
+        //You can go to the next line in this file by adding (+) to strings
+        //together.
+        //
+        //You are allowed to present words in html style bold and italic tags
+        //You can use bold and italic together, but an entire
+        //<b>this is <i>correct</i></b>,
+        //<b><i>but<b/> this isn't</i> as the entire italic phrase must be captured
+        //inside the bold tag. Open a new tag when the overlap partially.
+        //<b><i>but</i></b><i>this is</i> valid.
+        stimulus :
+            "{{The <b>teacher took <i>the car</i></b><i> instead</i> of }}{{the }}{{express }}"    + // string1
+            "{{train\n}}{{due to the previously announced public\n"                                 + // string2
+            "transport strike.}}", // use a comma here on the final line of your stimulus.             // final string
         question : "",                                            // An empty string means no question for this trial.
         qanswer : undefined                                       // We can't define a answer if there ain't no question.
     },
@@ -40,9 +48,9 @@ const PRACTICE_ITEMS = [
         id : 2,
         item_type : PRAC,
         stimulus :
-            "The researcher presented his most recent work\n"   +
-            "to the commission and obtained very positive\n"    +
-            "comments regarding the experimental design.\n"     ,
+            "{{The researcher presented his most recent work\n}}"   +
+            "{{to }}{{the }}{{commission }}{{and obtained very positive\n"    +
+            "comments regarding the experimental design.}}"     ,
         question : "The researcher presented old work.",
         qanswer : FALSE_BUTTON_TEXT                               // Use TRUE_BUTTON_TEXT if the answer is true,
                                                                   // FALSE_BUTTON_TEXT otherwise
@@ -50,17 +58,17 @@ const PRACTICE_ITEMS = [
 ];
 
 /*
- * In this list there is a stimulus, if a word or group of words starts with a
- * '#' it's reaction time will be recorded. So don't put any '#" elsewhere...
+ * In this list there is a stimulus, if a group of words starts with a
+ * '{{#' it's reaction time will be recorded.
  */
 const LIST_GROUP1 = [
     {
         id : 1,
         item_type : PASSIVE,
         stimulus :
-            "The guitarist was rejected by #the #attractive #and\n"     +
-            "#talented #singer #in #the #concert #hall #next #to\n"     +
-            "#the #Irish #pub.\n"                                       ,
+            "{{The guitarist was rejected by }}{{#the }}{{#attractive }}{{#and\n}}"                 +
+            "{{#talented }}{{#singer }}{{#in }}{{#the }}{{#concert }}{{#hall }}{{#next }}{{#to\n}}" +
+            "{{#the }}{{#Irish }}{{#pub.\n}}",
         question : "The singer was attractive.",
         qanswer : TRUE_BUTTON_TEXT
     },
@@ -68,9 +76,9 @@ const LIST_GROUP1 = [
         id : 2,
         item_type : ACTIVE,
         stimulus :
-            "The sculptor mugged #the #strange #and\n"                  +
-            "#temperamental #photographer #in #the #art #gallery\n"     +
-            "#next #to #the #book #shop.\n"                             ,
+            "{{The sculptor mugged }}{{#the }}{{#strange }}{{#and\n}}"                      +
+            "{{#temperamental }}{{#photographer }}{{#in }}{{#the }}{{#art }}{{#gallery\n}}" +
+            "{{#next }}{{#to }}{{#the }}{{#book }}{{#shop.\n}}"                             ,
         question : "",
         qanswer : undefined
     },
@@ -78,9 +86,9 @@ const LIST_GROUP1 = [
         id : 3,
         item_type : FILLER,
         stimulus :
-            "The beautiful princess married her young and\n"            +
-            "handsome chauffeur and shocked the royal\n"                +
-            "family and the press.\n"                                   ,
+            "{{The beautiful princess married her young and\n}}"                +
+            "{{handsome }}{{chauffeur }}{{and }}{{shocked }}{{the royal\n"      +
+            "family and the press.\n}}",
         question : "The chauffeur was an old man.",
         qanswer : FALSE_BUTTON_TEXT
     },
@@ -88,9 +96,9 @@ const LIST_GROUP1 = [
         id : 4,
         item_type : FILLER,
         stimulus :
-            "The little girl did not play with her brother\n"           +
-            "in the colourful playground next to their weedy\n"         +
-            "garden.\n"                                                 ,
+            "{{The little girl did not play with her brother\n}}"                               +
+            "{{in }}{{the }}{{colourful }}{{playground }}{{next }}{{to }}{{their }}{{weedy\n}}" +
+            "{{garden.\n}}",
         question : "",
         qanswer : undefined
     }
@@ -105,9 +113,9 @@ const LIST_GROUP2 = [
         id : 1,
         item_type : ACTIVE,
         stimulus :
-            "The guitarist rejected #the #attractive #and\n"            +
-            "#talented #singer #in #the #concert #hall #next #to\n"     +
-            "#the #Irish #pub.\n"                                       ,
+            "{{The guitarist rejected }}{{#the }}{{#attractive }}{{#and\n}}"                        +
+            "{{#talented }}{{#singer }}{{#in }}{{#the }}{{#concert }}{{#hall }}{{#next }}{{#to\n}}" +
+            "{{#the }}{{#Irish }}{{#pub.\n}}",
         question : "The singer was attractive.",
         qanswer : TRUE_BUTTON_TEXT
     },
@@ -115,9 +123,9 @@ const LIST_GROUP2 = [
         id : 2,
         item_type : PASSIVE,
         stimulus :
-            "The sculptor was mugged by #the #strange #and\n"           +
-            "#temperamental #photographer #in #the #art #gallery\n"     +
-            "#next #to #the #book #shop.\n"                             ,
+            "{{The sculptor was mugged by }}{{#the }}{{#strange }}{{#and\n}}"               +
+            "{{#temperamental }}{{#photographer }}{{#in }}{{#the }}{{#art }}{{#gallery\n}}" +
+            "{{#next }}{{#to }}{{#the }}{{#book }}{{#shop.\n}}",
         question : "",
         qanswer : undefined
     },
@@ -125,9 +133,9 @@ const LIST_GROUP2 = [
         id : 3,
         item_type : FILLER,
         stimulus :
-            "The beautiful princess married her young and\n"            +
-            "handsome chauffeur and shocked the royal\n"                +
-            "family and the press.\n"                                   ,
+            "{{The beautiful princess married her young and\n}}"                    +
+            "{{handsome }}{{chauffeur }}{{and }}{{shocked }}{{the }}{{royal\n}}"    +
+            "{{family and the press.\n}}",
         question : "The chauffeur was an old man.",
         qanswer : FALSE_BUTTON_TEXT
     },
@@ -135,9 +143,9 @@ const LIST_GROUP2 = [
         id : 4,
         item_type : FILLER,
         stimulus :
-            "The little girl did not play with her brother\n"           +
-            "in the colourful playground next to their weedy\n"         +
-            "garden.\n"                                                 ,
+            "{{The little girl did not play with her brother\n}}"           +
+            "{{in }}{{the }}{{colourful }}{{playground }}{{next }}{{to their weedy\n"         +
+            "garden.\n}}"                                                 ,
         question : "",
         qanswer : undefined
     }

From e09d1b6ad9c1aa2d17cc4a7915193adfe1521c9a Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Tue, 14 Jan 2025 11:35:08 +0100
Subject: [PATCH 08/17] Make the spr-plugin work with the grammar

---
 plugins/grammar.ne                   |   8 +-
 plugins/jspsych-spr-moving-window.js | 257 +++++++++++++--------------
 plugins/parts.js                     |  46 +++--
 3 files changed, 158 insertions(+), 153 deletions(-)

diff --git a/plugins/grammar.ne b/plugins/grammar.ne
index 8c4d15f..d2d3b3d 100644
--- a/plugins/grammar.ne
+++ b/plugins/grammar.ne
@@ -11,7 +11,7 @@
         bold_end        : /<[ ]*[/]b[ ]*>/u     ,
         italic_start    : /<[ ]*i[ ]*>/u        ,
         italic_end      : /<[ ]*[/]i[ ]*>/u     ,
-        word            : /\p{L}+|\p{P}+/u      ,
+        word            : /\p{L}+|\p{P}|\p{S}+/u ,
         ws              : /[ \r\t]+/u           ,
         newline         : {match : "\n", lineBreaks: true},
     })
@@ -127,7 +127,7 @@ special_sentence ->  # sentences in bold/italics
 
 bold_sentence -> %bold_start sentence %bold_end {%
                                         // drop italic_start and italic_end, return
-                                        // the sentence with all word marked italic.
+                                        // the sentence with all word marked bold.
                                         function(data) {
                                             let sentence_fragment = data[1];
                                             sentence_fragment.mark_bold();
@@ -167,10 +167,10 @@ WS ->
                                     %}
     | %newline                      {%
                                         function(data, pos) {
-                                            let ws = new parts.WhiteSpace(
+                                            let nl = new parts.WhiteSpace(
                                                 data[0],
                                                 data[0].toString()
                                             );
-                                            return ws;
+                                            return nl;
                                         }
                                     %}
diff --git a/plugins/jspsych-spr-moving-window.js b/plugins/jspsych-spr-moving-window.js
index 4cb6eb7..04a60f9 100644
--- a/plugins/jspsych-spr-moving-window.js
+++ b/plugins/jspsych-spr-moving-window.js
@@ -1,6 +1,7 @@
 
 import * as spr_grammar from "./grammar.js";
 import * as nearley from "nearley";
+import * as parts from "./parts.js"
 
 export var sprMovingWindow = (function(jspsych) {
 
@@ -95,31 +96,6 @@ export var sprMovingWindow = (function(jspsych) {
     // Reused names
     const SPR_CANVAS = "SprCanvas";
 
-    // Reused regular expressions.
-    //
-    // \p{} is for a unicode property
-    // \p{L} matches a "alfabetic" character throughout languages.
-    // see https://javascript.info/regexp-unicode
-    const CAP_WORD = '(\\p{L}+)';
-
-    // Caputure as word if it is precisely a word.
-    const WORD = '^\\p{L}+$';
-    const NUMBER = '^[0-9]+$';
-    const NEWLINE = '\n';
-    const WHITE_SPACE = '\\s';
-    const CAP_WHITE_SPACE = '(\\s)';
-    const INTERPUNCTION = "\\p{P}";
-    const WORD_INTERPUNCTION= "^\\p{L}+\\p{P}$";
-
-    const RE_CAP_WORD = RegExp(CAP_WORD, 'u');
-    const RE_WORD = RegExp(WORD, 'u');
-    const RE_NUMBER = RegExp(NUMBER, 'u');
-    const RE_NEWLINE = RegExp(NEWLINE, 'u');
-    const RE_WHITE_SPACE = RegExp(WHITE_SPACE, 'u');
-    const RE_CAP_WHITE_SPACE = RegExp(CAP_WHITE_SPACE, 'u');
-    const RE_INTERPUNCTION = RegExp(INTERPUNCTION, 'u');
-    const RE_WORD_INTERPUNCTION= RegExp(WORD_INTERPUNCTION, 'u');
-
     /**
      * Creates a range between [start, end).
      *
@@ -165,14 +141,14 @@ export var sprMovingWindow = (function(jspsych) {
     class TextInfo {
 
         /**
-         * @param {string} txt, the text to draw at ctx
+         * @param {parts.SentencePart} text, the text to draw at ctx
          * @param {Pos} position the position at which to draw text.
          * @param {CanvasRenderingContext2D} ctx the 2d drawing position.
          * @param {string} font_family, the family of the font
          */
         constructor(text, position, ctx, font_family, font_size) {
-            if (typeof(text) !== "string")
-                console.error("TextInfo constructor text was not a String");
+            if (!(text instanceof parts.SentencePart))
+                console.error("TextInfo constructor text was not a parts.SentencePart");
             if (!(position instanceof Pos))
                 console.error("TextInfo constructor position was not a Pos");
             if (!(ctx instanceof CanvasRenderingContext2D))
@@ -180,13 +156,13 @@ export var sprMovingWindow = (function(jspsych) {
                               "CanvasRenderingContext2D");
             if (typeof(font_family) !== "string")
                 console.error("TextInfo constructor font_family was not a String");
-            this.bold = false;
-            this.italic = false;
+            this.bold = text.bold;
+            this.italic = text.italic;
             this.pos = position;
             this.ctx = ctx
             this.font_family = font_family;
             this.font_size = font_size;
-            this.text = this.parseFontSpecials(text);
+            this.text = text.get_content();
             this.metrics = this.getTextMetrics();
         }
 
@@ -211,20 +187,6 @@ export var sprMovingWindow = (function(jspsych) {
             return font_desc;
         }
 
-        parseFontSpecials(text) {
-            let m = text.match(/^<b>(.+?)<\/b>$/)
-            if (m) { // capture bold string
-                this.bold = true
-                return this.parseFontSpecials(m[1]);
-            }
-            m = text.match(/^<i>(.+?)<\/i>$/)
-            if (m) { // capture italic string
-                this.italic = true
-                return this.parseFontSpecials(m[1]);
-            }
-            return text;
-        }
-
         drawUnderline() {
             this.ctx.beginPath();
             this.ctx.moveTo(this.pos.x, this.pos.y);
@@ -232,22 +194,6 @@ export var sprMovingWindow = (function(jspsych) {
             this.ctx.stroke();
         }
 
-        isWhiteSpace() {
-            return this.text.match(/^\s+$/u) !== null;
-        }
-
-        isWord() {
-            return this.text.match(RE_WORD) !== null;
-        }
-
-        isNumber() {
-            return this.text.match(RE_NUMBER) !== null;
-        }
-
-        isWordPlusInterpunction() {
-            return this.text.match(RE_WORD_INTERPUNCTION) !== null;
-        }
-
         width() {
             return this.metrics.width;
         }
@@ -273,7 +219,7 @@ export var sprMovingWindow = (function(jspsych) {
 
     // private variables
 
-    let group_index = 0;        // the nth_word that should be presented.
+    let group_index = 0;        // the nth group of words that should be presented.
     let words = [];             // array of TextInfo.
     let old_html = "";          // the current display html, in order to
                                 // restore it when finished.
@@ -312,66 +258,46 @@ export var sprMovingWindow = (function(jspsych) {
         createCanvas(display_element, trial_pars);
         ctx.font = font;
         let stimulus = trial_pars.stimulus;
-        if (trial_pars.grouping_string) {
-            grouping_re = RegExp(trial_pars.grouping_string, 'ug');
-            groups = createGroups(stimulus, grouping_re);
-            stimulus = stimulus.replace(grouping_re, "");
-        }
-        else {
-            groups = createGroups(stimulus, RE_WHITE_SPACE);
-        }
-        stimulus = stimulus.replace(RegExp("#", 'gu'), "");
-        let lines = stimulus.split(RE_NEWLINE);
-        gatherWordInfo(lines, trial_pars);
+        let parsed_stimulus = parseSpr(stimulus);
+        groups = createGroups(parsed_stimulus);
+        console.log(groups);
+        gatherWordInfo(parsed_stimulus, trial_pars);
     }
 
     /**
-     * Create groups of words that are presented together
-     * @param {String} stim the stimulus to be presented
-     * @param {RegExp} split_re
+     * @param {<Array>.<parts.GroupList>} parsed_stim
+     *
+     * @returns {GroupInfo[]}
      */
-    function createGroups(stim, split_re) {
+    function createGroups(parsed_stim) {
+        let groups = parsed_stim.groups;
 
-        /**
-         * Splits text into tokens and discards empty strings. The
-         * tokens are defined by the regular expression used to
-         * split the string.
-         *
-         * @param {String} text The text to splint into tokens
-         * @param {RegExp} re   The regular expression used to split the string
-         *
-         * @return An array of strings as tokens.
-         */
-        function splitIntoTokens(text, re) {
-            return text.split(re).filter (
-                function(word) {
-                    return word != "";
-                }
-            );
+        let context = {
+            groups : [],
+            index : 0
         };
 
-        let nwordstotal = splitIntoTokens(stim, RE_WHITE_SPACE).length;
-        let word_indices = range(0, nwordstotal);
-        let groups = splitIntoTokens(stim, split_re);
-        let group_indices = [];
-
-        for (let nthgroup = 0; nthgroup < groups.length; nthgroup++) {
-            let record = groups[nthgroup].trim()[0] == "#";
-            let nwordsgroup = splitIntoTokens(
-                groups[nthgroup],
-                RE_WHITE_SPACE
-            ).length;
-            let indices = word_indices.slice(0, nwordsgroup);
-            word_indices = word_indices.slice(nwordsgroup);
-            group_indices.push(new GroupInfo(indices, record));
-        }
-        console.assert(
-            word_indices.length == 0,
-            "Oops it was expected that word_indices was empty by now."
+        groups.forEach(
+            function (group) {
+                let group_indices = [];
+                let record = group.record;
+                let sentence_parts = group.sentence_parts.parts;
+                sentence_parts.forEach(
+                    function(part) {
+                        if (part.get_type() == "Word") {
+                            group_indices.push(context.index);
+                            context.index++;
+                        }
+                    }
+                );
+
+                context.groups.push(new GroupInfo(group_indices, record));
+            }
         );
-        return group_indices;
+        return context.groups
     }
 
+
     /**
      * Setup the canvas for use with this plugin
      *
@@ -391,7 +317,7 @@ export var sprMovingWindow = (function(jspsych) {
      * Processes the lines, it "measures" where each word should be.
      * the output is stored in the global plugin variable words.
      */
-    function gatherWordInfo(lines, trial_pars) {
+    function gatherWordInfo(parsed_stimulus, trial_pars) {
 
         let delta_y = determineLineHeight(
             trial_pars.font_family,
@@ -403,26 +329,76 @@ export var sprMovingWindow = (function(jspsych) {
         const BASE_Y = delta_y; // The height on which lines begin.
         const BASE_X = determineLineHeight(trial_pars.font_family, trial_pars.font_size);
 
-        for (let line = 0; line < lines.length; line++) {
-            let liney = BASE_Y + line * delta_y;
-            let fragments = lines[line].split(RE_CAP_WHITE_SPACE);
-            fragments = fragments.filter( word => {return word != "";});
-            let runningx = BASE_X;
-            for (let fragment = 0; fragment < fragments.length; fragment++) {
-                let current_fragment = fragments[fragment];
-                let pos = new Pos(runningx, liney);
-                let current_word = new TextInfo(
-                    current_fragment,
-                    pos,
+        let context = {
+            pos : new Pos(BASE_X, BASE_Y),
+        };
+
+        function advanceWhiteSpace(context, ws) {
+            if (ws.get_content() == "\n") {
+                context.pos.x = BASE_X;
+                context.pos.y = context.pos.y + delta_y;
+            }
+            else {
+                let info = new TextInfo(
+                    ws,
+                    new Pos(context.pos.x, context.pos.y),
                     ctx,
                     trial_pars.font_family,
-                    trial_pars.font_size
+                    trial_pars.font_size,
                 );
-                if (!current_word.isWhiteSpace())
-                    words.push(current_word);
-                runningx += current_word.width();
+                context.pos.x += info.width();
             }
         }
+
+        function advanceWord(context, word) {
+            let info = new TextInfo(
+                word,
+                new Pos(context.pos.x, context.pos.y),
+                ctx,
+                trial_pars.font_family,
+                trial_pars.font_size
+            );
+            words.push(info)
+            context.pos.x += info.width();
+        }
+
+        let groups = parsed_stimulus.groups;
+        groups.forEach(
+            group => {
+                let parts = group.sentence_parts.parts;
+                parts.forEach(
+                    part => {
+                        if (part.get_type() == "WhiteSpace") {
+                            advanceWhiteSpace(context, part);
+                        }
+                        else if (part.get_type() == "Word") {
+                            advanceWord(context, part);
+                        }
+                    }
+                );
+            }
+        );
+
+//        for (let line = 0; line < lines.length; line++) {
+//            let liney = BASE_Y + line * delta_y;
+//            let fragments = lines[line].split(RE_CAP_WHITE_SPACE);
+//            fragments = fragments.filter( word => {return word != "";});
+//            let runningx = BASE_X;
+//            for (let fragment = 0; fragment < fragments.length; fragment++) {
+//                let current_fragment = fragments[fragment];
+//                let pos = new Pos(runningx, liney);
+//                let current_word = new TextInfo(
+//                    current_fragment,
+//                    pos,
+//                    ctx,
+//                    trial_pars.font_family,
+//                    trial_pars.font_size
+//                );
+//                if (!current_word.isWhiteSpace())
+//                    words.push(current_word);
+//                runningx += current_word.width();
+//            }
+//        }
     }
 
     /**
@@ -586,6 +562,24 @@ export var sprMovingWindow = (function(jspsych) {
 
 })(jsPsychModule);
 
+/**
+ * Parses a stimulus and returns a GroupList that contains the
+ * groups of words that should be presented simultaneously in the spr.
+ *
+ */
+function parseSpr(stimulus) {
+    const parser = new nearley.Parser(nearley.Grammar.fromCompiled(spr_grammar))
+    parser.feed(stimulus)
+    let tree = parser.results
+    if (tree.length > 1) {
+        console.error("The grammar is ambigious for this stimulus");
+    }
+    else if (tree.length == 0) {
+        console.log("stimulus: \"" + stimulus +
+            "\"seems incomplete, parsing didn't finish");
+    }
+    return tree[0];
+}
 
 /**
  * 
@@ -600,10 +594,11 @@ export function checkStimuliSyntax(list)
         parser.feed(trial.stimulus)
         let tree = parser.results
         if (tree.length > 1) {
-            console.log("Oops, grammar is ambiguous.");
+            console.error("Oops, grammar is ambiguous.");
         }
-        else {
-            console.log(JSON.stringify(tree, null, "  "));
+        else if (tree.length == 0) {
+            console.error("Oops parsing didn't complete: " + trial +
+                "did you feed an entire string?\n");
         }
     });
 }
diff --git a/plugins/parts.js b/plugins/parts.js
index 8433f50..4f033a5 100644
--- a/plugins/parts.js
+++ b/plugins/parts.js
@@ -44,7 +44,7 @@ export class PositionInfo {
 export class GrammarPart {
 
     /**
-     * 
+     * @constructor
      * @param {string} type_name What constinuent of the grammar this object is
      * @param {PositionInfo} text_position Where is the constinuent in the parsed string
      */
@@ -80,7 +80,7 @@ export class GrammarPart {
 export class SentenceList extends GrammarPart {
 
     /**
-     * 
+     * @constructor
      * @param {PositionInfo} position 
      */
     constructor(position) {
@@ -102,9 +102,7 @@ export class SentenceList extends GrammarPart {
     mark_bold() {
         this.parts.forEach(
             function(value) {
-                if (value.grammar_type_name == "Word") {
-                    value.mark_bold();
-                }
+                value.mark_bold();
             }
         );
     }
@@ -112,9 +110,7 @@ export class SentenceList extends GrammarPart {
     mark_italic() {
         this.parts.forEach(
             function(value) {
-                if (value.grammar_type_name == "Word") {
-                    value.mark_italic();
-                }
+                value.mark_italic();
             }
         );
     }
@@ -122,6 +118,9 @@ export class SentenceList extends GrammarPart {
 
 export class SentencePart extends GrammarPart {
 
+    bold = false;
+    italic = false;
+
     /**
      * 
      * @param {string} type 
@@ -133,38 +132,38 @@ export class SentencePart extends GrammarPart {
         if (typeof(content) !== "string")
             throw TypeError("text is not a string.");
         this.content = content;
+        this.bold = false;
+        this.italic = false
     }
 
     get_content() {
         return this.content;
     }
+    
+    mark_bold() {this.bold = true;}
+    mark_italic() {this.italic = true;}
 }
 
-export class Word extends SentencePart {
 
-    bold = false;
-    italic = false;
+// Words are different from WhiteSpace in terms of
+// how they are used by the self paced reading.
+// That explains the code duplication.
+export class Word extends SentencePart {
 
     /**
-     * 
      * @param {PositionInfo} position 
      * @param {string} text 
      */
-
     constructor (position, text) {
         super("Word", position, text);
-        this.bold = false;
-        this.italic = false
     }
 
-    mark_bold() {this.bold = true;}
-    mark_italic() {this.italic = true;}
 }
 
 export class WhiteSpace extends SentencePart {
 
     /**
-     * 
+     * @constructor
      * @param {PositionInfo} position 
      * @param {string} text 
      */
@@ -173,6 +172,17 @@ export class WhiteSpace extends SentencePart {
     }
 };
 
+export class NewLine extends SentencePart {
+    /**
+     * @constructor
+     * @param {PositionInfo} position
+     * @param {string} text
+     */
+    constructor (position, text) {
+        super("NewLine", position, text);
+    }
+};
+
 
 export class Group extends GrammarPart {
 

From 3a6849336f6b3b787ae2d5e2adf46da76b0ff4d9 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Tue, 14 Jan 2025 11:38:09 +0100
Subject: [PATCH 09/17] Update main to use new spr

---
 main.js | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/main.js b/main.js
index 13d0cad..a7cb810 100644
--- a/main.js
+++ b/main.js
@@ -10,6 +10,10 @@ let jsPsych = initJsPsych({
     }
 });
 
+// export jsPsych globally because this is a module now...
+// or export jsPsych and import it from the other files.
+window.jsPsych = jsPsych
+
  // I liked RandomError too :-)
 class SprRandomizationError extends Error {
     constructor(message) {
@@ -43,7 +47,7 @@ let instruction_screen_practice = {
 
 let fixcross = {
     type : sprMovingWindow,
-    stimulus : '+',
+    stimulus : '{{+}}',
     choices : FIX_CHOICES,
     font_family : "Times New Roman",
     font_size : 36,
@@ -140,16 +144,16 @@ let end_experiment = {
 function randomizeStimuli(table) {
     let shuffled = uil.randomization.randomizeStimuli(
         table,
-        max_same_type=MAX_SUCCEEDING_ITEMS_OF_TYPE
+        MAX_SUCCEEDING_ITEMS_OF_TYPE
     );
 
     if (shuffled !== null)
         table = shuffled;
     else {
-            console.error('Unable to shuffle stimuli according constraints.');
-            let msg = "Unable to shuffle the stimuli, perhaps loosen the " +
-                      "constraints, or check the item_types on the stimuli.";
-            throw new SprRandomizationError(msg);
+        console.error('Unable to shuffle stimuli according constraints.');
+        let msg = "Unable to shuffle the stimuli, perhaps loosen the " +
+                  "constraints, or check the item_types on the stimuli.";
+        throw new SprRandomizationError(msg);
     }
 
     return table; // shuffled table if possible original otherwise
@@ -214,6 +218,7 @@ function main() {
 
     // Option 1: client side randomization:
     let stimuli = pickRandomList();
+    checkStimuliSyntax(PRACTICE_ITEMS);
     checkStimuliSyntax(stimuli.table);
     kickOffExperiment(getTimeline(stimuli.table), stimuli.list_name);
 

From 450c679d85c4ead9194263b1557797a8f88d7ef0 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Tue, 14 Jan 2025 12:18:59 +0100
Subject: [PATCH 10/17] Allow whitespace in between groups

This makes it easier to fill out the stimuli. This does mean,
that a GroupList, does not only contain groups, but also elements
of WhiteSpace, so the grammar becomes a bit less tidy...
---
 plugins/grammar.ne                   | 19 ++++++++++------
 plugins/jspsych-spr-moving-window.js | 33 +++++++++++++++++-----------
 stimuli.js                           |  2 +-
 3 files changed, 33 insertions(+), 21 deletions(-)

diff --git a/plugins/grammar.ne b/plugins/grammar.ne
index d2d3b3d..c692c26 100644
--- a/plugins/grammar.ne
+++ b/plugins/grammar.ne
@@ -20,6 +20,9 @@
 @lexer lexer
 
 # We parse a number of groups to present to the user.
+# We allow white space between the groups. The white space is
+# now made significant. So you don't have to embed the whitespace inside
+# the groups in order to have them "rendered"/appear.
 group_list ->
       group                 # a single group can be a group_list
             {%
@@ -29,23 +32,25 @@ group_list ->
                     return list;
                 }
             %}
-    | group_list group      # a group may be a group followed by more groups
+    | WS                    # white space is part of the group list.
+                            # as this makes writing the stimuli easier.
             {%
                 function (data) {
-                    data[0].push(data[1])
-                    return data[0];
+                    let list = new parts.GroupList(data[0].text_position);
+                    list.push(data[0]);
                 }
             %}
-    | group_list WS group   # allow white space between groups
+    | group_list group      # a group list may be followed by more groups
             {%
                 function (data) {
-                    data[0].push(data[2])
+                    data[0].push(data[1])
                     return data[0];
                 }
             %}
-    | group_list WS         # allow trailing white space
+    | group_list WS         # allow white space between groups
             {%
-                function (data) { // Just ignore the whitespace
+                function (data) {
+                    data[0].push(data[1])
                     return data[0];
                 }
             %}
diff --git a/plugins/jspsych-spr-moving-window.js b/plugins/jspsych-spr-moving-window.js
index 04a60f9..0bd9a7b 100644
--- a/plugins/jspsych-spr-moving-window.js
+++ b/plugins/jspsych-spr-moving-window.js
@@ -260,7 +260,6 @@ export var sprMovingWindow = (function(jspsych) {
         let stimulus = trial_pars.stimulus;
         let parsed_stimulus = parseSpr(stimulus);
         groups = createGroups(parsed_stimulus);
-        console.log(groups);
         gatherWordInfo(parsed_stimulus, trial_pars);
     }
 
@@ -278,7 +277,9 @@ export var sprMovingWindow = (function(jspsych) {
         };
 
         groups.forEach(
-            function (group) {
+            function (group) { // A group might be WhiteSpace here
+                if (group.get_type() == "WhiteSpace")
+                    return;
                 let group_indices = [];
                 let record = group.record;
                 let sentence_parts = group.sentence_parts.parts;
@@ -363,19 +364,25 @@ export var sprMovingWindow = (function(jspsych) {
         }
 
         let groups = parsed_stimulus.groups;
-        groups.forEach(
+        groups.forEach( // A group can be a whitespace
             group => {
-                let parts = group.sentence_parts.parts;
-                parts.forEach(
-                    part => {
-                        if (part.get_type() == "WhiteSpace") {
-                            advanceWhiteSpace(context, part);
-                        }
-                        else if (part.get_type() == "Word") {
-                            advanceWord(context, part);
+                let type = group.get_type();
+                if (type == "WhiteSpace") {
+                    advanceWhiteSpace(context, group);
+                }
+                else if (type == "Group") {
+                    let parts = group.sentence_parts.parts;
+                    parts.forEach(
+                        part => {
+                            if (part.get_type() == "WhiteSpace") {
+                                advanceWhiteSpace(context, part);
+                            }
+                            else if (part.get_type() == "Word") {
+                                advanceWord(context, part);
+                            }
                         }
-                    }
-                );
+                    );
+                }
             }
         );
 
diff --git a/stimuli.js b/stimuli.js
index fdcc3db..af15f88 100644
--- a/stimuli.js
+++ b/stimuli.js
@@ -38,7 +38,7 @@ const PRACTICE_ITEMS = [
         //inside the bold tag. Open a new tag when the overlap partially.
         //<b><i>but</i></b><i>this is</i> valid.
         stimulus :
-            "{{The <b>teacher took <i>the car</i></b><i> instead</i> of }}{{the }}{{express }}"    + // string1
+            "{{The <b>teacher took <i>the car</i></b><i> instead</i> of}} {{the }}{{express }}"    + // string1
             "{{train\n}}{{due to the previously announced public\n"                                 + // string2
             "transport strike.}}", // use a comma here on the final line of your stimulus.             // final string
         question : "",                                            // An empty string means no question for this trial.

From 7d80566ad52dde3d49550c7b81a75f92a892b9f7 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Fri, 17 Jan 2025 11:20:55 +0100
Subject: [PATCH 11/17] Remove old style grouping support

---
 globals.js | 9 ---------
 1 file changed, 9 deletions(-)

diff --git a/globals.js b/globals.js
index 653e2c4..7c19756 100644
--- a/globals.js
+++ b/globals.js
@@ -42,12 +42,3 @@ const FIX_CHOICES = [' '];
 // is on screen.
 const FINISH_TEXT_DUR = 3000;
 
-// If no grouping character is selected or if it is null as in this example
-// every word is a group of its own: sentences are split on whitespace.
-// each word will be a one word group
-const GROUPING_STRING = null;
-// Or create word groups based on a splitting string
-// Create groups using a "/". Note that every occurrence
-// of a "/" will lead to presentation as a word group and the a "/" itself
-// will not be displayed in the stimulus
-//const GROUPING_STRING = "/";

From 025d8b82aa18a6f394ea5452a26d004ee80e50e9 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Fri, 17 Jan 2025 11:27:40 +0100
Subject: [PATCH 12/17] Remove old grouping from main.js and plugin

---
 main.js                              |  1 -
 plugins/jspsych-spr-moving-window.js | 12 ------------
 2 files changed, 13 deletions(-)

diff --git a/main.js b/main.js
index a7cb810..19a44c3 100644
--- a/main.js
+++ b/main.js
@@ -71,7 +71,6 @@ let present_text = {
     width : MIN_WIDTH,
     height : MIN_HEIGHT,
     post_trial_gap : ISI,
-    grouping_string : GROUPING_STRING,
     data : {
         id : jsPsych.timelineVariable('id'),
         item_type : jsPsych.timelineVariable('item_type'),
diff --git a/plugins/jspsych-spr-moving-window.js b/plugins/jspsych-spr-moving-window.js
index 0bd9a7b..2aeaabe 100644
--- a/plugins/jspsych-spr-moving-window.js
+++ b/plugins/jspsych-spr-moving-window.js
@@ -70,18 +70,6 @@ export var sprMovingWindow = (function(jspsych) {
                 default :       600,
                 description :   "The height of the canvas in which the spr moving window is presented"
             },
-            grouping_string : {
-                type :          jspsych.ParameterType.STRING,
-                pretty_name :   "grouping string",
-                default :       null,
-                description :   "The string used to split the string in to parts. The parts are "  +
-                    "presented together. This allows to present multiple words as "    +
-                    "group if the argument isn't specified every single word is "      +
-                    "treated as group. You should make sure that the used argument "   +
-                    "doesn't appear at other locations than at boundaries of groups, " +
-                    "because the grouping character is removed from the string. a "    +
-                    "'/' can be used quite handy for example."
-            },
             line_height_multiplier : {
                 type :          jspsych.ParameterType.FLOAT,
                 pretty_name :   "line_height_multiplier",

From a0bfe7ec4772ec2337774865dc01a05bbfd6e106 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Fri, 17 Jan 2025 11:28:15 +0100
Subject: [PATCH 13/17] Update readme for new type of stimuli

---
 README.md | 80 ++++++++++++++++++++++++++++++-------------------------
 1 file changed, 44 insertions(+), 36 deletions(-)

diff --git a/README.md b/README.md
index 5d8c4df..635060b 100644
--- a/README.md
+++ b/README.md
@@ -45,58 +45,66 @@ conditions, you'd need to create four lists.
 
 ### Presenting multiple words as one group
 
-By defaut, the boilerplate experiment treats every word in the stimuli as a
-group of its own containing one word. Note, in some papers, the terminology for
-a group is a segment. Sometimes it is handy to group multiple words together,
-to shorten the time it takes to complete the experiment for example. This is
-possible, but must be enabled. The file `globals.js` contains another variable:
+Previously, when the spr was presenting multiple words as one group/simultaneous, you
+needed to separate them by inserting e.g. a `/`, as of now, you have to
+specifically create groups yourself and grouping of words is always on. On
+the. There are two kinds of groups `{{A group of words that is not recorded}}`
+`{{#A group of words that is NOT recorded.}}`. Recorded means that the
+RT of this group is logged. Of course it is fine to have just one `{{word}}`
+in a {{#group}}. the curly braces and # are stripped from the rendered
+output. You should not put word letters etc outside of a group.
+
+All the words of your spr need to be enclosed in **{{**double curly braces**}}**
+so the phrase "double curly braces" is presented together. If you want the to
+be presented individually, you'll need to make three groups such as
 
-```javascript
-const GROUPING_STRING = null;
+```
+{{double}} {{curly}} {{braces}}
 ```
 
-To enable grouping you must define a useful delimiter between groups.
-A little bit further in the file there's a commented version of this:
+#### White space issues
+
+In the example with three groups above, the " " are put outside of the group
+as that might be more readable than e.g.
 
-```javascript
-const GROUPING_STRING = "/";
+```
+{{double }}{{curly }}{{braces}}
 ```
 
-So in order to enable grouping, comment the first version and uncomment
-the latter. In theory you can fill out any string instead of the `"/"`
-(useful in case you need to use / in a stimulus).
-Notice the string is turned into a regular expression in order to split
-the stimulus into parts and to remove the `/` in the case described here.
+In this example the spaces are embedded inside the groups, both method are
+fine, but the author finds the first method better readable. If you put
+none white space characters outside of a group it will be considered a syntax error.
+
+#### Presenting **bold** and *italic* words or ***both***
+
+Like HTML you can render words in bold or italic like this:
 
-```javascript
-re = RegExp(GROUPING_STRING,'gu');
+```
+{{a word in <b>bold</b> or some words <i>in italic</i>}}
 ```
 
-So make sure if you are going to be creative, that the expression is valid.
+or even both.
 
-### Warning the grouping string is going to be removed as it shouldn't be displayed
+```
+{{<b><i>Bold and italic</i></b>}}
+```
 
-In the stimulus file you should take care that the grouping string is removed
-from the stimulus. So you should take in mind how the stimulus would appear
-after the grouping string is removed.
+However, the syntax for this is more strict than HTML, forgetting to close a bold
+or italic tag will result in an error. The bold or you'll have to close the
+innermost group first and then the outermost group. So the following are errors:
 
-#### Example
+1.
 
-```javascript
-{
-    stimulus : "This is/my fantasic stimlus./Don't you think!"
-}
-```
+        {{<b><i>Oops close i first</b></i>}}
 
-The "/" will be removed, essentially gluing "is" and "my" together, just like
-"stimulus." and "Word".
+2.
 
-#### Example improved
+        {{<b>Oops forgot to close b}}
 
-```javascript
-{
-    stimulus : "This is/ my fantasic stimlus./ Don't you think"
-}
+If you want then to be partially overlapping you should open a new group
+
+```
+{{<b>Bold <i> and italic</i></b> <i>, only italic</i>
 ```
 
 ## Output

From 7082cb3ca47c2b6646d64ebbf34fbd5f02b85bc6 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Fri, 17 Jan 2025 11:43:35 +0100
Subject: [PATCH 14/17] Put spaces outside of the groups of words

---
 stimuli.js | 42 +++++++++++++++++++++++-------------------
 1 file changed, 23 insertions(+), 19 deletions(-)

diff --git a/stimuli.js b/stimuli.js
index af15f88..e9208ff 100644
--- a/stimuli.js
+++ b/stimuli.js
@@ -38,8 +38,8 @@ const PRACTICE_ITEMS = [
         //inside the bold tag. Open a new tag when the overlap partially.
         //<b><i>but</i></b><i>this is</i> valid.
         stimulus :
-            "{{The <b>teacher took <i>the car</i></b><i> instead</i> of}} {{the }}{{express }}"    + // string1
-            "{{train\n}}{{due to the previously announced public\n"                                 + // string2
+            "{{The <b>teacher took <i>the car</i></b><i> instead</i> of}} {{the}} {{express}} {{train}}\n"    + // string1
+            "{{due to the previously announced public\n"                                                      + // string2
             "transport strike.}}", // use a comma here on the final line of your stimulus.             // final string
         question : "",                                            // An empty string means no question for this trial.
         qanswer : undefined                                       // We can't define a answer if there ain't no question.
@@ -48,8 +48,8 @@ const PRACTICE_ITEMS = [
         id : 2,
         item_type : PRAC,
         stimulus :
-            "{{The researcher presented his most recent work\n}}"   +
-            "{{to }}{{the }}{{commission }}{{and obtained very positive\n"    +
+            "{{The researcher presented his most recent work}}\n"   +
+            "{{to}} {{the}} {{commission}} {{and obtained very positive\n"    + // Line endings inside a group are fine
             "comments regarding the experimental design.}}"     ,
         question : "The researcher presented old work.",
         qanswer : FALSE_BUTTON_TEXT                               // Use TRUE_BUTTON_TEXT if the answer is true,
@@ -59,16 +59,18 @@ const PRACTICE_ITEMS = [
 
 /*
  * In this list there is a stimulus, if a group of words starts with a
- * '{{#' it's reaction time will be recorded.
+ * '{{#' it's reaction time will be recorded. In the list for group 1
+ * the space is moved outside of a group. I think this make it easier to
+ * read the stimulus.
  */
 const LIST_GROUP1 = [
     {
         id : 1,
         item_type : PASSIVE,
         stimulus :
-            "{{The guitarist was rejected by }}{{#the }}{{#attractive }}{{#and\n}}"                 +
-            "{{#talented }}{{#singer }}{{#in }}{{#the }}{{#concert }}{{#hall }}{{#next }}{{#to\n}}" +
-            "{{#the }}{{#Irish }}{{#pub.\n}}",
+            "{{The guitarist was rejected by}} {{#the}} {{#attractive}} {{#and}}\n"                 +
+            "{{#talented}} {{#singer}} {{#in}} {{#the}} {{#concert}} {{#hall}} {{#next}} {{#to}}\n" +
+            "{{#the}} {{#Irish}} {{#pub.}}\n",
         question : "The singer was attractive.",
         qanswer : TRUE_BUTTON_TEXT
     },
@@ -76,9 +78,9 @@ const LIST_GROUP1 = [
         id : 2,
         item_type : ACTIVE,
         stimulus :
-            "{{The sculptor mugged }}{{#the }}{{#strange }}{{#and\n}}"                      +
-            "{{#temperamental }}{{#photographer }}{{#in }}{{#the }}{{#art }}{{#gallery\n}}" +
-            "{{#next }}{{#to }}{{#the }}{{#book }}{{#shop.\n}}"                             ,
+            "{{The sculptor mugged}} {{#the}} {{#strange}} {{#and}}\n"                      +
+            "{{#temperamental}} {{#photographer}} {{#in}} {{#the}} {{#art}} {{#gallery}}\n" +
+            "{{#next}} {{#to}} {{#the}} {{#book}} {{#shop.}}"                               ,
         question : "",
         qanswer : undefined
     },
@@ -86,9 +88,9 @@ const LIST_GROUP1 = [
         id : 3,
         item_type : FILLER,
         stimulus :
-            "{{The beautiful princess married her young and\n}}"                +
-            "{{handsome }}{{chauffeur }}{{and }}{{shocked }}{{the royal\n"      +
-            "family and the press.\n}}",
+            "{{The beautiful princess married her young and}}\n"                +
+            "{{handsome}} {{chauffeur}} {{and}} {{shocked}} {{the royal\n"      +
+            "family and the press.}}",
         question : "The chauffeur was an old man.",
         qanswer : FALSE_BUTTON_TEXT
     },
@@ -96,17 +98,19 @@ const LIST_GROUP1 = [
         id : 4,
         item_type : FILLER,
         stimulus :
-            "{{The little girl did not play with her brother\n}}"                               +
-            "{{in }}{{the }}{{colourful }}{{playground }}{{next }}{{to }}{{their }}{{weedy\n}}" +
-            "{{garden.\n}}",
+            "{{The little girl did not play with her brother}}\n"                               +
+            "{{in}} {{the}} {{colourful}} {{playground}} {{next}} {{to}} {{their}} {{weedy}}\n" +
+            "{{garden.}}",
         question : "",
         qanswer : undefined
     }
 ];
 
 /*
- * In this list there is a stimulus, if a word starts with a '#' its
- * reaction time will be recorded. So don't put any '#" elsewhere...
+ * In this list puts all the white space inside of a group, this is also possbile
+ * but I find it less readable. You are allowed to mix it, where necessary. If
+ * you want a group of words that spans multiple lines, it's fine to put a \n
+ * inside the group.
  */
 const LIST_GROUP2 = [
     {

From f3d4d6df7c6d36c7c26d3e19318496b2d6089747 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Fri, 17 Jan 2025 11:47:51 +0100
Subject: [PATCH 15/17] fix typo

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 635060b..9d18609 100644
--- a/README.md
+++ b/README.md
@@ -71,7 +71,7 @@ as that might be more readable than e.g.
 {{double }}{{curly }}{{braces}}
 ```
 
-In this example the spaces are embedded inside the groups, both method are
+In this example the spaces are embedded inside the groups, both methods are
 fine, but the author finds the first method better readable. If you put
 none white space characters outside of a group it will be considered a syntax error.
 

From 3d193fe8698a7b60607c3006b0a1f148f50c1106 Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Fri, 17 Jan 2025 11:48:16 +0100
Subject: [PATCH 16/17] Add esbuild script

---
 build.mjs | 13 +++++++++++++
 1 file changed, 13 insertions(+)
 create mode 100644 build.mjs

diff --git a/build.mjs b/build.mjs
new file mode 100644
index 0000000..572d385
--- /dev/null
+++ b/build.mjs
@@ -0,0 +1,13 @@
+import * as esbuild from 'esbuild'
+
+await esbuild.build({
+    entryPoints: [
+        './plugins/jspsych-spr-moving-window.js',
+    ],
+    bundle:true,
+    outdir: 'dist',
+    minify: false,
+    sourcemap: true,
+    format: "esm"
+})
+

From 9f33917cee7d463308ad09b6292c6ffa0312e46d Mon Sep 17 00:00:00 2001
From: Maarten Duijndam <m.j.a.duijndam@uu.nl>
Date: Sat, 18 Jan 2025 16:28:49 +0100
Subject: [PATCH 17/17] Improve sentence

---
 stimuli.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/stimuli.js b/stimuli.js
index e9208ff..6194c29 100644
--- a/stimuli.js
+++ b/stimuli.js
@@ -107,7 +107,7 @@ const LIST_GROUP1 = [
 ];
 
 /*
- * In this list puts all the white space inside of a group, this is also possbile
+ * This list puts all the white space inside of a group, this is also possible
  * but I find it less readable. You are allowed to mix it, where necessary. If
  * you want a group of words that spans multiple lines, it's fine to put a \n
  * inside the group.