Zipped Resources

PennController offers two methods for including multimedia resources in your experiments:

  1. each of them is separately hosted on and requested from a distant server
  2. all of them are contained in a single ZIP archive that is hosted on and requested once from a distant server

If your experiment uses many files and is sent to many participants, the number of requests to the distant server can become quite massive. The second method has the advantage of sending only one request to the distant server, and making sure that all the resources are loaded locally in the cache of the participant’s browser.

The ZIP method comes with a limitation though: you need to upload your ZIP file on a server that allows cross-domain requests. This is typically NOT the case for cloud services such as Dropbox or Google Drive. If you access your server through an FTP protocol, chances are that you can apply the method below to grant your participants’ browsers access to your ZIP file.

Uploading and granting access to ZIP files

  1. Open your favorite text editor and enter the following:
  2. [generic]
    # with AJAX withCredentials=false (cookies NOT sent)
    Header always set Access-Control-Allow-Origin “*”
    Header always set Access-Control-Allow-Methods “GET”
    Header always set Access-Control-Allow-Headers “X-Accept-Charset,X-Accept,Content-Type”
    RewriteEngine On
    RewriteCond %{REQUEST_METHOD} OPTIONS
    RewriteRule ^(.*)$ $1 [R=200,L,E=HTTP_ORIGIN:%{HTTP:ORIGIN}]]
    [/generic]

  3. Save your file under the name .htaccess making sure that no extension is added to the filename (mind the period at the beginning). If your editor or operating system does not allow you to give this name to your file, you can rename it later after uploading it on your server.
  4. Using your method of choice (e.g., the software FileZilla) access your server and upload the ZIP file containing your resources in a dedicated folder (create a new folder if you do not already have a specific folder).
  5. Upload your .htaccess file in the exact same folder. The .htaccess file grants access to any file located in the folder containing it to any scripts run in any browser, so it is important that you upload it in a folder that only contains files you are willing to grant such access to.
  6. [OPTIONAL] If you could not use this filename before (due to your operating system’s settings for instance) rename your file .htaccess.

In your IBEX project

In your main script under data_includes (by default, example_data.js), simply refer to the ZIP files on your server by using the command PennController.PreloadZip:

[js try=”data”]
PennController.ResetPrefix(null);

PennController.PreloadZip(“https://files.lab.florianschwarz.net/ibexfiles/PennController/SampleTrials/stillalienspictures.zip”); // Pictures
PennController.PreloadZip(“https://files.lab.florianschwarz.net/ibexfiles/PennController/SampleTrials/stillalienssounds.zip”); // Sounds

PennController(
newImage( “alien” , “alien_blue.png” )
.settings.size( 200 , 200 )
.print()
,
newAudio( “sentence” , “stillalien1.mp3” )
.play()
.wait()
);

PennController(
newImage( “alien” , “alien_red.png” )
.settings.size( 200 , 200 )
.print()
,
newAudio( “sentence” , “stillalien2.mp3” )
.play()
.wait()
);
[/js]