[Jeremy]

Hello,

I have come up with two little python3 scripts to handle this, they can be found here:

* static.py takes a full experiment folder’s structure (ie. a folder with the chunk_includes, css_includes, data_includes, js_includes, other_includes, www subfolders) and outputs a standalone, static experiment in another folder. The resulting experiment can be run entirely locally in a web browser, without even needing a local server. That being said, because of the absence of a server, it won’t support automatic update of the counter or sending of the results: by default the counter will be set to a random value between 0 and 1000, or to the value passed to the withsquare parameter in the URL, and the browser will open a prompt to download the results as a file on the device. You can still run the output on a server: to obtain the exact same behavior, make sure to pass static=1 as a parameter in the URL, or don’t pass it if you want to handle the counter and the results file on the server. Usage example: python3 static.py -i ./ibex_exp -o ~/static_exp

* server.py will run a very simple server that handles counter updates, saving results and serving files. Note that it was not designed to be used as a public web server, although it could technically be implemented as such — it works well as a local server though. It will run at localhost:3000 by default, but you can update the port by setting PORT at the top of the script to a different value. Also make sure to edit PRIVATE_DIRECTORY and PUBLIC_DIRECTORY to point to the directories you want to use on your machine: PRIVATE_DIRECTORY is where you will have the counter and results file, and it should not be publicly exposed (although if you’re running a local server, it doesn’t matter much); PUBLIC_DIRECTORY is the directory serving files, and it should be set to point to the output folder of static.py above (in this example, ~/static_exp/) this way it can serve multimedia files, for example. Finally note the line response.headers["Access-Control-Allow-Origin"] = "*": this will accept incoming requests from any domain (including localhost, crucially) so make sure to edit it if you need to make things more secure. Usage example: python3 server.py

Jeremy

[Jeremy]

Hello,

After downgradng to 2.0, you might want to make sure you have a file Aesthetics/PennController.jss with these rules:

.PennController {
  margin-left: 50vw;
  transform: translateX(-50%);
}

Jeremy

[Jeremy]

Hi,

This will accomplish what you want:

tasks = [
  ["synonym_instruction", randomize("synonym")],
  ["string_match_instruction", randomize("string")],
  ["colour_match_instruction", randomize("colour")],
  ["size_match_instruction", randomize("size")]
]
fisherYates(tasks)

Sequence(
  // items before
  ...tasks.flat(),
  // items after
)

Jeremy

[Jeremy]

Hi,

Canvas elements allow for arbitrary positioning of elements. For example, this would print the word “hello” at the bottom-right corner of the image:

newCanvas("myCanvas", 200, 300)
  .add("center at 50%", "middle at 50%", newImage("myImage.png"))
  .add("right at 100%", "bottom at 100%", newText("hello"))
  .print()

Anyone still experiencing issues with PennController 2.1 is invited to downgrade to 2.0 following these instructions

Jeremy

[Jeremy]

Hi,

It’s impossible to control the cursor’s location in javascript, for security reasons. What you can do is print a button at the center of the page (newButton("Next").print("center at 50vw", "middle at 50vh").wait()) and only start the trial when it’s clicked: this way when the trial starts the participant’s cursor is centered on the page

Jeremy

[Jeremy]

Hi,

Not sure what the issue is exactly, but usually you can work around this error by passing auto.colnames=FALSE to read.pcibex. Then your data frame’s columns are not automatically named, but you can still name them manually if you want

Jeremy

[Jeremy]

Hi,

1. There is no generic .log command in PennController: it needs to either apply to an element (eg newHtml(...).log()/newTextInput(...).log()) or to a trial (eg newTrial(...).log()). You cannot call .log() inside the parentheses that open/close an element, as in *newHtml(... .log())

2. If results haven’t appeared in the meantime, there are two main possibilities: (a) some participants found a way to validate their submission without actually submitting results, or (b) there was an issue with the PCIbex Farm servers causing some data loss. Unfortunately the latter is not uncommon, this is an issue that I haven’t been able to solve so far despite putting many safeguards in place. Apologies for the inconvience

Jeremy

[Jeremy]

Hi,

The PennController library comes with the MediaRecorder element by default: you shouldn’t have a PennElement_mediarecorder.js file in your project, barring exceptions

Jeremy

[Jeremy]

Hi,

One option is to download the Aesthetics folder of the original experiment, delete the files in the Aesthetics folder of the target experiment, and upload the ones from the original experiment there

Other than that, the two projects already look pretty similar

Jeremy

[Jeremy]

Hi,

By default key.log will only report a line in the results file for a keypress that validates a wait command on the same Key element. The “failed keypresses happened” tells you that keys were pressed while the Key element was active, but they didn’t validate a wait command so they were not logged. Use .log("all"), .log("first") or .log("last") to make sure you have a line in your results file

Jeremy

[Jeremy]

Hi,

The response I get when trying to access the file from PreloadZip is “Response body is not available to scripts (Reason: CORS Missing Allow Origin)”

When this happens and you have double-checked the .htacces configuration as in this case, I invite you to double-check with the IT team supervising the hosting service you are using to get a closer look at the issue

Jeremy

[Jeremy]

Hi,

These projects lack a file named PennController.css in their Aesthetics folder. Uploading such a file with this content (appropriate for PennController 2.0) takes care of the centering issue:

.PennController {
    max-width: 40em;
    margin-left: 50vw;
    transform: translateX(-50%);
}

The other issues seems to have been solved in the meantime, but the first project includes two PennContoller*.js files in Modules, which could cause conflicts; only one is necessary

Jeremy

[Jeremy]

Hi,

These issues seem to have been solved in the meantime. Different versions of PennController come with different ways of rendering the content of the experiment, in a way that some aesthetics rules in the .css files of the project may stop to apply to certain elements. When this happens, edit your file PennController.css to adapt the rules accordingly (it is usually a matter of playing around with the rules width, left, margin and transform: translate)

Jeremy

[Jeremy]

These issues were addressed in an email exchange. I report the suggested solution below:

One solution is to keep the container of the Canvas element in the page flow with appropriate dimensions so that other elements will know how to be positioned relative to it, but position the Canvas element itself outside of the flow so as to be able to center it. Here is how to do it:

newCanvas("myCanvas", 1240,520)
  .cssContainer("height","520px") // make sure the 520px are vertically occupied in the flow
  .css({position:'absolute',left:'50vw',transform:'translateX(-50%)'})
  .add("center at 50%", 0, getImage("image"))
  .center()
  .print()
  .log()

Jeremy

[Jeremy]

Hi,

It looks like the file PennController.js somehow got deleted from the projects that you shared in the meantime. However, if I upload the latest version of PennController under development then the shuffling issue seems to be addressed: the texts do not appear in the same order from one trial to the next

Jeremy

[Author]

Posts