Counterbalancing position of pictures

[Elise]

Hi Jeremy,

I have two questions:

1. In my experiment participants have to choose between two pictures. Is there a way to counterbalance the position of the pictures? Randomly shuffle the position of the pictures is not an option for me.

2. Is it possible to change the default message during preloading and sending the results? I want to add a moving object to the preloading screen, since the amount of picture is high and preloading takes time.

Thank you in advance for your help!

Best,
Elise

[Jeremy]

Hi Elise,

1. It really depends on how you want to counterbalance the position of your pictures. One option is to take care of counterbalancing directly in your table. Another option is to toggle a global Var element on every trial to alternatively display each picture on the left/right. Here’s an example where I alternate showing the text/picture to the left/right on every other trial (note that I’m using PennController 1.7, which shortens command names):

Sequence( randomize("test") )

// This is just a dummy table for this example
AddTable("myTable", `DummyColumn
dummyRow1
dummyRow2
dummyRow3
dummyRow4`)

Template( "myTable" , row =>
  newTrial( "test" ,
    defaultImage.size(200,200)  // I want to make sure my images fit in my canvases
    ,
    newCanvas(400,200)
        .add(   0 , 0 , newCanvas("left" , 200, 200) )  // The 'left' and 'right' canvases
        .add( 200 , 0 , newCanvas("right", 200, 200) )  // are simple containers
        .print()
    ,
    newVar("toggle", 1)  // Initialize with value 1
        .global().set( v=>1-v ).test.is(1)  // Set to 1 - itself = 1 or 0 on every other trial
        .success(
            newImage("pcibex-logo.png").print(0,0,getCanvas("left")),  // Fill the containers
            newText( row.DummyColumn ).print(0,0,getCanvas("right"))   // accordingly
        )
        .failure(
            newImage("pcibex-logo.png").print(0,0,getCanvas("right")),
            newText( row.DummyColumn ).print( 0,0,getCanvas("left") )
        )
    ,
    newButton("Next").print().wait()
  )
)

If you’d rather counterbalance upon generation rather than upon execution, ie. have a half-half overall distribution but randomly distributed, add var i = 0 just above your Template line, and replace v=>v-1 in the set command with (i++)%2

2.
Re. preloading: unfortunately there’s no built-in function in PennController yet to control that. What you can do is detect when the preloading message pops up using requestAnimationFrame and replace it manually using javascript. It’s not very clean but it does the job. Here’s an example (this code goes at the top of your script, and replace <p>This is a test</p> with whatever HTML content you want to display):

let replacePreloadingText = ()=>{
    let mainPs = $(".PennController-PennController div p");
    if (mainPs.length == 2 && mainPs[0].innerHTML == "Please wait while the resources are preloading"){
        mainPs.remove();
        $(".PennController-PennController div").append("
This is a test
");
    }
    else
        window.requestAnimationFrame( replacePreloadingText );
}
window.requestAnimationFrame( replacePreloadingText );

Re. sending the results: there is a native-Ibex option to overwrite the message documented in the manual which consists in defining the variable sendingResultsMessage to whatever message you want to display instead. Not sure whether you can use HTML there.

Let me know if you have any questions

Jeremy

• This reply was modified 4 years, 1 month ago by Jeremy.

[Author]

Posts