Online Balloon Analogue Risk Task (oBART)

Example 4

For more information see http://timo.gnambs.at.

Instructions

1. Load all required files for the BART in the head of the page:

   
   <script type="text/javascript" src="src/jquery-3.0.0.min.js"></script>	<!-- basic javascript library for dom manipulation -->
   <script type="text/javascript" src="src/jcanvas.min.js"></script>      	<!-- the canvas plugin -->
   <script type="text/javascript" src="src/jquery.bart.js"></script>       <!-- the main BART plugin -->
   <link rel="stylesheet" type="text/css" href="src/jquery.bart.css" />    <!-- additional styles for to make the BART look fancy -->
   

2. Create an element in the body of the page with a unique id-attribute (here: "bart"):

   <div id="bart"></div>

3. Create a script section in the head of the page:

   
   <script type="text/javascript">
   </script>
   

4. Initialize the BART script after the page has loaded:

   
   <script type="text/javascript">
   	$(document).ready(function() {   // initialize the BART after the page has loaded
   	});
   </script>
   

5. Define the BART (e.g., number and color of balloons) using the id defined in step 2 (see head of src/jquery.bart.js for configuration options):

   
   <script type="text/javascript">
   	$(document).ready(function() {   // initialize the BART after the page has loaded
   		// create a BART with 5 balloons
   		$("#bart").bart( { b: 5,                    // create 5 balloons
   				   o: { color: '#FF7B00',   // color of balloons
   					earnings: 10,       // points earned for each pump
   					popprob: 100        // probability of popping; defined as 1 out of popprop
   				      },
   				   s: { bgcol: ' #FFF2E6',  // background color
   					sounds: true,       // use sounds
   					sndpath: 'sounds/', // path to sound files
   					randomize: true,    // randomize the presentation order of the balloons (useful for Example 3)
   					earned: 100         // initial number of points
   				      }
   				  } );
   	});
   </script>
   

   If an object including an element s is passed to the bart()-function, element s specifies global settings for the test. For example, bgcol sets the background color of the test and earned specifies the number of initial points earned.