[open] Image button functions

Comments

• Josh

  November 2015 edited November 2015

  Hi Boris,

  I think it would be best for you to use an inline_script for this. The first step is to create a canvas, so that it would present the 15 pictures in a way similar to the sketchpad. http://osdoc.cogsci.nl/python/canvas/. The canvas can be built in the 'prepare-phase' of your inline_script. You then show it (e.g. exp.canvas.show()) in the run-phase.

  Right after that, it's time to collect a mouse response (i.e., in the same run-phase). All the relevant functions are here: http://osdoc.cogsci.nl/python/mouse/. You see that the mouse.get_click() command returns not only the button and time, but also a set of coordinates. With these coordinates you could find out which picture participants clicked. Going back to the run phase, you could make a variable called picture_coordinates, and give it a value like so:

    pics = [(100,100), (100,200),(100,300),(200,100),(200,200)] #etc.
  

  Every tuple in this list would refer to the center of a picture; the third element of the list would refer to the center coordinates of the third picture. Also note that it may be convenient to first create this variable and then build your canvas:

     exp.canvas.image('image1.png', x=pics[0][0], y=pics[0][1])
     exp.canvas.image('image2.png', x=pics[1][0], y=pics[1][1])
     exp.canvas.image('image3.png', x=pics[2][0], y=pics[2][1])
  

  Back to the run-phase, we want to do some response processing. Let's say your pictures are size 80x80 pixels. This would mean that the third picture was clicked if (100-40)<x<(100+40) and (300-40)<y<(300+40). Here, x and y are respectively the first and second element of the coordinate variable that was returned by our mouse.get_click() command. Hence, right after this command you could first insert the lines x=coordinates[0] and y=coordinates[1], (that is, if you named this variable coordinates; in the example of http://osdoc.cogsci.nl/python/mouse/ it's named 'position').

  In the end, you could do something like this:

    if (pics[0][0]-40)<x<(pics[0][0]+40) and (pics[0][1]-40)<y<(pics[0][1]+40):
            picture_clicked = 1
    elif (pics[1][0]-40)<x<(pics[1][0]+40) and (pics[1][1]-40)<y<(pics[1][1]+40):
            picture_clicked = 2
    elif (pics[2][0]-40)<x<(pics[2][0]+40) and (pics[2][1]-40)<y<(pics[2][1]+40):
            picture_clicked = 3
                      # et cetera.
  

  Cheers,

  Josh