Dev amila

_config.yml

@@ -55,6 +55,9 @@ collections:
   how-to-guides:
     output: true
     permalink: /:collection/:name/
+  list-of-templates:
+    output: true
+    permalink: /:collection/:name/
   posts:
     output: true
     permalink: /announcements/:name/
@@ -219,6 +222,12 @@ defaults:
       layout: "how-to-guide"
       parent: "How-to guides"
       # grand_parent: "Support"
+  - scope:
+      path: "reference/_list-of-templates"
+    values:
+      layout: "list-of-templates"
+      parent: "List of templates"
+      # grand_parent: "Support"
   - scope:
       path: "reference/_global-commands"
     values:

_includes/head_custom.html

@@ -7,11 +7,6 @@
     <!-- <a href="https://www.pcibex.net/" target="_blank">PCIbex documentation</a> -->
     <!-- and is still partly under development. ⚠</i> -->
   <!-- </p> -->
-  <p class="mt-0 mb-0">
-    The <a href="https://farm.pcibex.net/" target="_blank">new PCIbex Farm</a> is here!
-    Be sure to check out all of its 
-    <a href="{{site.baseurl}}/announcements/2021-01-22-new-pcibex-farm/" target="_blank">new features and changes</a>.
-  </p>
 </header>
 
 {%- if page.numbered_headings -%}

advanced-tutorial/8_creating-trial-template.md

@@ -203,7 +203,7 @@ PennController.ResetPrefix(null)
 @            .wait()
 @        ,
 @        getAudio("audio")
-@            .wait("first)
+@            .wait("first")
 @    )
 +)
 </code></pre>

reference/_controller/controller-callback.md

@@ -0,0 +1,32 @@
+---
+title: controller.callback
+command_type: "action"
+syntax: .callback()
+description: "Will execute the command(s) whenever the Controller is there."
+---
+
+<!--more-->
+
+<pre><code class="language-diff-javascript diff-highlight try-true">
+@newButton("Start reading")
+@    .print()
+@    .wait()
+@    .remove()
+@,
+@newController("DashedSentence", {s: "The mouse is happy"} )
+@    .print()
+@    .log()
+@    .wait()
+@    .remove()
+$    .callback( 
+$        getVideo("skate")
+$           .stop()
+$           .play()
+$    )
+@,
+@newText("Good job!")
+@    .print()
+</code></pre>
+
+
+

reference/_dragdrop/addDrag.md

@@ -11,14 +11,10 @@ notes: true
 <pre><code class="language-diff-javascript diff-highlight try-true">
 @newDragDrop("dd", "bungee")
 @        .log()
-@        // listOfWords is a dropzone as well as the gaps are
 @        .addDrop( getCanvas("listOfWords") , getCanvas("gap-0") , getCanvas("gap-1") )
 $        .addDrag( getText("sentence") , getText("illustrate") , getText("dummy") )
-@        // dropping a word on gap-0 or gap-1 will swap any word already present
 @        .swap( getCanvas("gap-0"), getCanvas("gap-1") )
-@        // words will have a 0.5em horizonal offset from the left edge of the gap Canvas elements
 @        .offset('0.5em','0em', getCanvas("gap-0"), getCanvas("gap-1"))
-@        // Wait until both gap-0 and gap-1 have been droppped a word onto them
 @        .wait(
 @            self.test.dropped(getCanvas("gap-0"),getCanvas("gap-1"))
 @        )

reference/_dragdrop/addDrop.md

@@ -11,14 +11,10 @@ notes: true
 <pre><code class="language-diff-javascript diff-highlight try-true">
 @newDragDrop("dd", "bungee")
 @        .log()
-@        // listOfWords is a dropzone as well as the gaps are
 $        .addDrop( getCanvas("listOfWords") , getCanvas("gap-0") , getCanvas("gap-1") )
 @        .addDrag( getText("sentence") , getText("illustrate") , getText("dummy") )
-@        // dropping a word on gap-0 or gap-1 will swap any word already present
 @        .swap( getCanvas("gap-0"), getCanvas("gap-1") )
-@        // words will have a 0.5em horizonal offset from the left edge of the gap Canvas elements
 @        .offset('0.5em','0em', getCanvas("gap-0"), getCanvas("gap-1"))
-@        // Wait until both gap-0 and gap-1 have been droppped a word onto them
 @        .wait(
 @            self.test.dropped(getCanvas("gap-0"),getCanvas("gap-1"))
 @        )

reference/_dragdrop/bungee.md

@@ -11,14 +11,10 @@ notes: true
 <pre><code class="language-diff-javascript diff-highlight try-true">
 $newDragDrop("dd", "bungee")
 @        .log()
-@        // listOfWords is a dropzone as well as the gaps are
 @        .addDrop( getCanvas("listOfWords") , getCanvas("gap-0") , getCanvas("gap-1") )
 @        .addDrag( getText("sentence") , getText("illustrate") , getText("dummy") )
-@        // dropping a word on gap-0 or gap-1 will swap any word already present
 @        .swap( getCanvas("gap-0"), getCanvas("gap-1") )
-@        // words will have a 0.5em horizonal offset from the left edge of the gap Canvas elements
 @        .offset('0.5em','0em', getCanvas("gap-0"), getCanvas("gap-1"))
-@        // Wait until both gap-0 and gap-1 have been droppped a word onto them
 @        .wait(
 @            self.test.dropped(getCanvas("gap-0"),getCanvas("gap-1"))
 @        )

reference/_dragdrop/log.md

@@ -24,7 +24,7 @@ description: "Will log the time/results of the action to your results file."
 @            ,
 @            getText("feedback").remove()
 @        )
-$        .log("all") // Log every drag event and every drop event
+$        .log("all") 
 @        .wait()
 </code></pre>
 

reference/_dragdrop/offset.md

@@ -10,13 +10,10 @@ notes: true
 <pre><code class="language-diff-javascript diff-highlight try-true">
 @newDragDrop("dd", "bungee")
 @        .log()
-@        // listOfWords is a dropzone as well as the gaps are
 @       .addDrop( getCanvas("listOfWords") , getCanvas("gap-0") , getCanvas("gap-1") )
 @        .addDrag( getText("sentence") , getText("illustrate") , getText("dummy") )
-@        // dropping a word on gap-0 or gap-1 will swap any word already present
 @        .swap( getCanvas("gap-0"), getCanvas("gap-1") )       
 $        .offset('0.5em','0em', getCanvas("gap-0"), getCanvas("gap-1"))
-@        // Wait until both gap-0 and gap-1 have been droppped a word onto them
 @        .wait(
 @            self.test.dropped(getCanvas("gap-0"),getCanvas("gap-1"))
 @        )

reference/_dragdrop/removeDrag.md

@@ -15,7 +15,7 @@ notes: true
 $        .removeDrag(getCanvas("dot"),getCanvas("otherdot"))
 @        .offset(0, getCanvas("start"))
 @        .offset(50, getCanvas("end"))
-@        .drop(getCanvas('dot'),getCanvas('start')) // start dropped by default
+@        .drop(getCanvas('dot'),getCanvas('start')) 
 @        .callback(
 @            newText("feedback","Good job! Now make sure that Red is on Start and Blue is on End")
 @                .css("background-color","lightgray")

reference/_dragdrop/removeDrop.md

@@ -15,7 +15,7 @@ notes: true
 $        .removeDrop(getCanvas("start"),getCanvas("end"))
 @        .offset(0, getCanvas("start"))
 @        .offset(50, getCanvas("end"))
-@        .drop(getCanvas('dot'),getCanvas('start')) // start dropped by default
+@        .drop(getCanvas('dot'),getCanvas('start')) 
 @        .callback(
 @            newText("feedback","Good job! Now make sure that Red is on Start and Blue is on End")
 @                .css("background-color","lightgray")

reference/_dragdrop/swap.md

@@ -15,7 +15,7 @@ notes: true
 $        .swap(getCanvas("word1"),getCanvas("word2"),getCanvas("word3"),getCanvas("word4"))
 @        .offset('0.5em')
 @        .offset('unset', getCanvas("reservoir"))
-@        .wait( // make sure all 'word*' dropzones have an element on them
+@        .wait( 
 @            self.test.dropped(getCanvas("word1"),getCanvas("word2"),getText("hello"),getCanvas("word4"))
 @        )
 </code></pre>

reference/_dragdrop/wait.md

@@ -12,7 +12,7 @@ notes: true
 @    newDragDrop("dd")
 @        .addDrag(getCanvas("dot"))
 @        .addDrop(getCanvas("start"),getCanvas("end"))
-@        .offset(25) // will pin the elements to (25,25) from the top-left edge of the dropzone
+@        .offset(25) 
 @        .single()
 @        .log()
 $        .wait()

reference/_elements/dragdrop.md

@@ -11,14 +11,10 @@ description: Allows dragging elements into the specific space.
 <pre><code class="language-diff-javascript diff-highlight try-true">
 @newDragDrop("dd", "bungee")
 @        .log()
-@        // listOfWords is a dropzone as well as the gaps are
 @        .addDrop( getCanvas("listOfWords") , getCanvas("gap-0") , getCanvas("gap-1") )
 @        .addDrag( getText("sentence") , getText("illustrate") , getText("dummy") )
-@       // dropping a word on gap-0 or gap-1 will swap any word already present
 @        .swap( getCanvas("gap-0"), getCanvas("gap-1") )
-@        // words will have a 0.5em horizonal offset from the left edge of the gap Canvas elements
 @        .offset('0.5em','0em', getCanvas("gap-0"), getCanvas("gap-1"))
-@        // Wait until both gap-0 and gap-1 have been droppped a word onto them
 @        .wait(
 @            self.test.dropped(getCanvas("gap-0"),getCanvas("gap-1"))
 @        )

reference/_global-commands/SendResults.md

@@ -7,6 +7,8 @@ alternates:
 notes: true
 ---
 
++ <b> Update </b> : It is now possible to send the results to a custom URL by using SendResults as an in-trial command.
+
 1. On its own, it creates a trial whose sole function will be to send the results to the server when it is run. You can give a label to the trial by passing a string as an argument to SendResults and then refer to it in Sequence in order to send the results early.
 
 2. Alternatively, you can use it directly inside Sequence in place of a reference to a label, with the same effect as above (but lifting the need to come up with a dedicated label)

reference/_global-commands/newTrial().noTrialLog.md

@@ -0,0 +1,21 @@
+---
+title: newTrial().noTrialLog
+syntax: newTrial().noTrialLog()
+description:  "Skip the trial's Start and/or End lines in the results file"
+
+---
+
+<!--more-->
+
+<pre><code class="language-diff-javascript diff-highlight try-data">
+@
+@newTrial(
+@    newButton("helloworld", "Hello world!")
+@        .log()
+@        .print()
+@        .wait()
+@)
+$.noTrialLog("Start","End")
+</code></pre>
+
++ Will skip the trial's Start and End lines in the result file.

reference/_how-to-guides/collecting-eyetracking-data.md

@@ -11,6 +11,8 @@ In this guide, we will design a simple eye-tracking experiment splitting the pag
 
 Note that in order to collect eye-tracking data, you need to have access to a server where you can upload and execute PHP scripts. **Platforms like DreamHost offer this service with minimal setup, and server providers like Linode require more advanced setup. Resource-sharing services like Dropbox or Google Drive do NOT support PHP scripts.**
 
+Note: **PHP extension mbstring must be enabled on the server for the PHP script to run successfully.**
+
 
 # The Experiment
 

reference/_how-to-guides/using-prolific.md

@@ -10,28 +10,68 @@ To credit participants automatically via PCIbex for doing the experiments, <b> f
 
 3. Now you need to edit the study link after filling out the previous information as seen in the following picture.
 
-    ![alt text]({{site.baseurl}}/assets/images/prolific1.png)
+    ![After entering Prolific page for creating the new study, you need to edit/take a look the study link. Study link will usually contain PRILIFIC_ID, STUDY_ID and SESSION_ID. STUDY_ID and SESSION_ID are optional.]({{site.baseurl}}/assets/images/prolific1.png)
 
     You should change each of the three possible IDs based on your need. Note that the PROLIFIC_ID in our example is the unique ID for each 
     participant.
+
+4. In PCIbex, include the following at the top of your experiment, below PennController.ResetPrefix(null) (search for [Header]({{site.baseurl}}/global-commands/header/){:target="_blank"} , [log]({{site.baseurl}}/standard-element-commands/standard-log/){:target="_blank"} , or [GetURLParameter]({{site.baseurl}}/global-commands/geturlparameter/){:target="_blank"} for more details) to add the participant’s Prolific ID to your results file (this can also be used to double check participation manually when needed):
+
+     ```javascript
+     Header(
+     // void
+     )
+     .log( "PROLIFIC_ID" , GetURLParameter("id") )
+     ```
 
-4. Choose the method to confirm participants have to completed your study
+5. Choose the method to confirm participants have to completed your study
+
+   We recommend directing participants using an URL. 
+
+    ![Scrolling down, you will see the section which asks you to choose how you want to direct participants. We recommend choosing an URL, since the URL can be copied in PCIbex code down below. ]({{site.baseurl}}/assets/images/prolific2.png)
 
-   We recommend directing participants using an URL. Remember that URL because we will need it in our PCIbex code. 
+   Add a final page to your experiment after sending results that redirects to the Completion URL (client-side) provided. Copy and paste the entire URL from there to get the correct redirection. You can copy & paste the following code and change the redirection URL to match the redirection URL on your Prolific page:
+
+   ```javascript
+    newTrial( "final" ,
+         newText("<p>Thank you for your participation!</p>")
+                    .center()
+               .print()
+        ,
+        newText("<p><a href='https://app.prolific.co/submissions/complete?cc=CODE'+ GetURLParameter("id")+"' target='_blank'>Click here to confirm your participation on Prolific.</a></p> <p>This is a necessary step in order for you to receive participation credit!</p>")
+        .center()
+        .print()
+        ,
+        newButton("void")
+        .wait()
+        )
+    ```   
+
+    However, your redirection URL may differ. It can include your own written code instead of CODE portion in https://app.prolific.co/submissions/complete?cc=CODE. The most important part is to include your redirection link (however it looks like on Prolific page) at the end of the experiment under the final trial. 
+
+    (Note: the use of final ‘newButton’ command here ensures that participants cannot navigate past this page to avoid them accidentally missing the link to receive credit on Prolific)
+
+    Following this process will automatically credit participants who take web study.  
 
-5. Configure other options as well and then press save.
+6. Configure other options as well and then press save.
 
-6. Now go to the PCIbex platform and enter the following code (remember to change the links to your own links obtained in the previous steps):
+7. Your final code should look like this:
 
      ```javascript
 
          PennController.ResetPrefix(null) // Keep here
-         Sequence("trials", "prolific-consent", "confirmation-prolific", SendResults())
-         newTrial("prolific-consent",
-         newHtml("prolific-consent.html").print()
-         ,
-         newButton("I consent").print().wait()
-          )
+
+         Header(
+          // void
+         )
+         .log( "PROLIFIC_ID" , GetURLParameter("id") )
+
+         Sequence("prolific-consent", "trials", SendResults(), "confirmation-prolific")
+          newTrial("prolific-consent",
+          newHtml("prolific-consent.html").print()
+          ,
+          newButton("I consent").print().wait()
+         )
 
         newTrial( "trials" ,
           newButton("This is a mock trial")
@@ -45,7 +85,7 @@ To credit participants automatically via PCIbex for doing the experiments, <b> f
                 .print()
             ,
            // This is where you should put the link from the last step.
-            newText("<p><a href='https://app.prolific.co/submissions/complete?cc=2RRF5B4I'>Click here to validate your submission</a></p>")
+            newText("<p><a href='https://app.prolific.co/submissions/complete?cc=CODE>Click here to validate your submission'</a></p>")
                 .center()
                 .print()
             ,

reference/_mousetracker/mousetracker-log.md

@@ -7,6 +7,7 @@ notes: true
 ---
 
 + See the discussion and example script on the MouseTracker element page for more information about the format of the string reporting the coordinates.
++ Additionally you can log click by writing the command: mousetracker.log("click") .
 
 <!--more-->
 

reference/_scale/scale-checkbox.md

@@ -0,0 +1,24 @@
+---
+title: scale.checkbox
+command_type: "action"
+syntax: .checkbox()
+description: "Turns the options into checkoxes that can all independently be on/off."
+
+---
+
+<!--more-->
+
+<pre><code class="language-diff-javascript diff-highlight try-true">
+@newTrial(
+@    newScale("answer", "hello", "world")
+$        .checkbox()
+@        .print()
+@    ,
+@    newButton("Hello world")
+@        .print()
+@        .wait()
+)
+
+</code></pre>
+
++ Adds a scale with 3 checkboxes to the screen.

reference/_selector/selector-keys.md

@@ -9,6 +9,8 @@ parameters:
 description: "Makes it possible to select the elements by pressing the specified keys. The keys are associated to the element in the order in which they were added, if no shuffle took place in the meantime."
 ---
 
++ Accepts special keys as arguments as well, such as (Enter, Escape, ArrowLeft, LeftShift, etc).
+
 <!--more-->
 
 <pre><code class="language-diff-javascript diff-highlight try-true">

reference/_special-commands/jump.md

@@ -0,0 +1,18 @@
+---
+title: jump
+syntax: jump()
+description: Navigates the sequence and jumps to the part specified.
+
+---
+
+ ```javascript
+ newButton("botao7", "Voltar")
+    .callback(jump("pratica1"),end())
+    .before( newButton("botao8", "Seguir") ) 
+    .css("margin-left","1em")
+    .print()
+,
+getButton("botao8").wait()
+ ```
+
++ When the button is pressed, "practica1" trial is showed.