non-rectangular buttons?


non-rectangular buttons?

Author
Message
morgan_w
morgan_w
New Member
New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)

Group: Forum Members
Posts: 5, Visits: 39
Hello!

Sorry if this question has already been asked and answered, I haven't had much luck finding it.

I've been hoping to replicate a response button setup with 8 options that are symmetrically placed around the center of the screen, but the eight options are related in 4 pairs. The standard for this involves triangular buttons in shapes and orientations roughly like the attached image, so that each pair of related options forms a coloured box. At the moment I've noticed that Inquisit is treating the triangles as entire rectangles, which would make the buttons overlap.



Thanks for the help!
Best,
Morgan



Dave
Dave
Supreme Being
Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)

Group: Administrators
Posts: 9.6K, Visits: 44K
morgan_w - 6/30/2019
Hello!

Sorry if this question has already been asked and answered, I haven't had much luck finding it.

I've been hoping to replicate a response button setup with 8 options that are symmetrically placed around the center of the screen, but the eight options are related in 4 pairs. The standard for this involves triangular buttons in shapes and orientations roughly like the attached image, so that each pair of related options forms a coloured box. At the moment I've noticed that Inquisit is treating the triangles as entire rectangles, which would make the buttons overlap.



Thanks for the help!
Best,
Morgan



I assume you're using <picture> elements for the triangles, which is why they're treated as rectangles. Even if an image displays a triangle, the image itself is still a full rectangle. You would not have that problem with <shape> elements:

<shape a>
/ shape = triangle
/ size = (500px,500px)
/ color = orangered
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,500px)
/ color = orange
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

The above will differentiate between a click in shape A vs shape B just fine, however, creating an array like the one you want is not possible with overlaid <shape>s. You could build an array with rectangles  as a simple workaround.

<shape a>
/ shape = rectangle
/ size = (500px,250px)
/ color = orangered
/ valign = top
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,250px)
/ color = orange
/ valign = bottom
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

In sum, there certainly is no easy way to do this, if triangles are an absolute requirement. In theory, you would build a set of custom expressions that perform a triangle test, but the math is not entirely trivial (e.g. https://stackoverflow.com/questions/2049582/how-to-determine-if-a-point-is-in-a-2d-triangle ).

morgan_w
morgan_w
New Member
New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)

Group: Forum Members
Posts: 5, Visits: 39
Dave - 7/1/2019
morgan_w - 6/30/2019
Hello!

Sorry if this question has already been asked and answered, I haven't had much luck finding it.

I've been hoping to replicate a response button setup with 8 options that are symmetrically placed around the center of the screen, but the eight options are related in 4 pairs. The standard for this involves triangular buttons in shapes and orientations roughly like the attached image, so that each pair of related options forms a coloured box. At the moment I've noticed that Inquisit is treating the triangles as entire rectangles, which would make the buttons overlap.



Thanks for the help!
Best,
Morgan



I assume you're using <picture> elements for the triangles, which is why they're treated as rectangles. Even if an image displays a triangle, the image itself is still a full rectangle. You would not have that problem with <shape> elements:

<shape a>
/ shape = triangle
/ size = (500px,500px)
/ color = orangered
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,500px)
/ color = orange
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

The above will differentiate between a click in shape A vs shape B just fine, however, creating an array like the one you want is not possible with overlaid <shape>s. You could build an array with rectangles  as a simple workaround.

<shape a>
/ shape = rectangle
/ size = (500px,250px)
/ color = orangered
/ valign = top
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,250px)
/ color = orange
/ valign = bottom
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

In sum, there certainly is no easy way to do this, if triangles are an absolute requirement. In theory, you would build a set of custom expressions that perform a triangle test, but the math is not entirely trivial (e.g. https://stackoverflow.com/questions/2049582/how-to-determine-if-a-point-is-in-a-2d-triangle ).

Thanks a lot Dave, really appreciate the options. Will play around with boxes to see if I can get a satisfactory compromise before I attempt the maths!

morgan_w
morgan_w
New Member
New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)

Group: Forum Members
Posts: 5, Visits: 39
morgan_w - 7/1/2019
Dave - 7/1/2019
morgan_w - 6/30/2019
Hello!

Sorry if this question has already been asked and answered, I haven't had much luck finding it.

I've been hoping to replicate a response button setup with 8 options that are symmetrically placed around the center of the screen, but the eight options are related in 4 pairs. The standard for this involves triangular buttons in shapes and orientations roughly like the attached image, so that each pair of related options forms a coloured box. At the moment I've noticed that Inquisit is treating the triangles as entire rectangles, which would make the buttons overlap.



Thanks for the help!
Best,
Morgan



I assume you're using <picture> elements for the triangles, which is why they're treated as rectangles. Even if an image displays a triangle, the image itself is still a full rectangle. You would not have that problem with <shape> elements:

<shape a>
/ shape = triangle
/ size = (500px,500px)
/ color = orangered
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,500px)
/ color = orange
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

The above will differentiate between a click in shape A vs shape B just fine, however, creating an array like the one you want is not possible with overlaid <shape>s. You could build an array with rectangles  as a simple workaround.

<shape a>
/ shape = rectangle
/ size = (500px,250px)
/ color = orangered
/ valign = top
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,250px)
/ color = orange
/ valign = bottom
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

In sum, there certainly is no easy way to do this, if triangles are an absolute requirement. In theory, you would build a set of custom expressions that perform a triangle test, but the math is not entirely trivial (e.g. https://stackoverflow.com/questions/2049582/how-to-determine-if-a-point-is-in-a-2d-triangle ).

Thanks a lot Dave, really appreciate the options. Will play around with boxes to see if I can get a satisfactory compromise before I attempt the maths!

Hi Dave,

Tried to do the maths in the end (thanks for the link! went with barycentric coordinates) and got it working for a single triangle pretty easily. However, my current attempt will not let me distinguish between two triangles that are placed together to form a square as in any corner of the image above, even though I have triangle tests for both triangles individually. Any ideas to tie each triangle test as the condition for each triangle as a response? I'll include what I've whipped up so far:

<picture triangle1>
/ items = ("practice_triangle.png")
/ position = (50,50)
</picture>

<picture triangle2>
/ items = ("practice_triangle2.png")
/ position = (50,50)
</picture>

<expressions triangle1>
/ x1 = picture.triangle1.left
/ y1 = picture.triangle1.bottom
/ x2 = picture.triangle1.left
/ y2 = picture.triangle1.top
/ x3 = picture.triangle1.right
/ y3 = picture.triangle1.bottom
/ a = ((expressions.y2 - expressions.y3)*(mouse.x - expressions.x3) + (expressions.x3 - expressions.x2)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ b = ((expressions.y3 - expressions.y1)*(mouse.x - expressions.x3) + (expressions.x1 - expressions.x3)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ c = 1 - expressions.a - expressions.b
</expressions>

<expressions triangle2>
/ x12 = picture.triangle2.left
/ y12 = picture.triangle2.top
/ x22 = picture.triangle2.right
/ y22 = picture.triangle2.top
/ x32 = picture.triangle2.right
/ y32 = picture.triangle2.bottom
/ a2 = ((expressions.y22 - expressions.y32)*(mouse.x - expressions.x32) + (expressions.x32 - expressions.x22)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ b2 = ((expressions.y32 - expressions.y12)*(mouse.x - expressions.x32) + (expressions.x12 - expressions.x32)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ c2 = 1 - expressions.a2 - expressions.b2
</expressions>

<text report>
/ items = ("<%mouse.x%>, <%mouse.y%>, <%expressions.a%>, <%expressions.b%>, <%expressions.c%>", <%expressions.a2%>, <%expressions.b2%>, <%expressions.c2%>Wink
/ position = (50, 15)
</text>


<trial mytrial>
/ stimulusframes = [1 = triangle1, triangle2, report]
/ validresponse = (picture.triangle1, picture.triangle2)
/ inputdevice = mouse
/ isvalidresponse = [
0<=expressions.a && expressions.a <= 1 && 0 <= expressions.b && expressions.b <= 1 && 0 <= expressions.c && expressions.c <= 1 || 0<=expressions.a2 && expressions.a2 <= 1 && 0 <= expressions.b2 && expressions.b2 <= 1 && 0 <= expressions.c2 && expressions.c2 <= 1
]
</trial>

<block myblock>
/ trials = [1-3 = mytrial]
</block>

Yellow triangle is practice_triangle1.png and green is practice_triangle2.png
https://www.millisecond.com/forums/Uploads/Images/88dea02a-98f2-4841-9055-0339.pnghttps://www.millisecond.com/forums/Uploads/Images/93d1b0c2-6780-440e-aef0-9e8d.png


At the moment, as I understand it, the || condition in the / isvalidresponse is making the triangle test effectively useless, and I can click on either 'triangle' but the response registered is the first image. Does anyone have any ideas to tie the mouse location to a specific triangle, even though they overlap?

Cheers,
Morgan


Dave
Dave
Supreme Being
Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)Supreme Being (647K reputation)

Group: Administrators
Posts: 9.6K, Visits: 44K
morgan_w - 7/2/2019
morgan_w - 7/1/2019
Dave - 7/1/2019
morgan_w - 6/30/2019
Hello!

Sorry if this question has already been asked and answered, I haven't had much luck finding it.

I've been hoping to replicate a response button setup with 8 options that are symmetrically placed around the center of the screen, but the eight options are related in 4 pairs. The standard for this involves triangular buttons in shapes and orientations roughly like the attached image, so that each pair of related options forms a coloured box. At the moment I've noticed that Inquisit is treating the triangles as entire rectangles, which would make the buttons overlap.



Thanks for the help!
Best,
Morgan



I assume you're using <picture> elements for the triangles, which is why they're treated as rectangles. Even if an image displays a triangle, the image itself is still a full rectangle. You would not have that problem with <shape> elements:

<shape a>
/ shape = triangle
/ size = (500px,500px)
/ color = orangered
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,500px)
/ color = orange
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

The above will differentiate between a click in shape A vs shape B just fine, however, creating an array like the one you want is not possible with overlaid <shape>s. You could build an array with rectangles  as a simple workaround.

<shape a>
/ shape = rectangle
/ size = (500px,250px)
/ color = orangered
/ valign = top
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,250px)
/ color = orange
/ valign = bottom
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

In sum, there certainly is no easy way to do this, if triangles are an absolute requirement. In theory, you would build a set of custom expressions that perform a triangle test, but the math is not entirely trivial (e.g. https://stackoverflow.com/questions/2049582/how-to-determine-if-a-point-is-in-a-2d-triangle ).

Thanks a lot Dave, really appreciate the options. Will play around with boxes to see if I can get a satisfactory compromise before I attempt the maths!

Hi Dave,

Tried to do the maths in the end (thanks for the link! went with barycentric coordinates) and got it working for a single triangle pretty easily. However, my current attempt will not let me distinguish between two triangles that are placed together to form a square as in any corner of the image above, even though I have triangle tests for both triangles individually. Any ideas to tie each triangle test as the condition for each triangle as a response? I'll include what I've whipped up so far:

<picture triangle1>
/ items = ("practice_triangle.png")
/ position = (50,50)
</picture>

<picture triangle2>
/ items = ("practice_triangle2.png")
/ position = (50,50)
</picture>

<expressions triangle1>
/ x1 = picture.triangle1.left
/ y1 = picture.triangle1.bottom
/ x2 = picture.triangle1.left
/ y2 = picture.triangle1.top
/ x3 = picture.triangle1.right
/ y3 = picture.triangle1.bottom
/ a = ((expressions.y2 - expressions.y3)*(mouse.x - expressions.x3) + (expressions.x3 - expressions.x2)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ b = ((expressions.y3 - expressions.y1)*(mouse.x - expressions.x3) + (expressions.x1 - expressions.x3)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ c = 1 - expressions.a - expressions.b
</expressions>

<expressions triangle2>
/ x12 = picture.triangle2.left
/ y12 = picture.triangle2.top
/ x22 = picture.triangle2.right
/ y22 = picture.triangle2.top
/ x32 = picture.triangle2.right
/ y32 = picture.triangle2.bottom
/ a2 = ((expressions.y22 - expressions.y32)*(mouse.x - expressions.x32) + (expressions.x32 - expressions.x22)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ b2 = ((expressions.y32 - expressions.y12)*(mouse.x - expressions.x32) + (expressions.x12 - expressions.x32)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ c2 = 1 - expressions.a2 - expressions.b2
</expressions>

<text report>
/ items = ("<%mouse.x%>, <%mouse.y%>, <%expressions.a%>, <%expressions.b%>, <%expressions.c%>", <%expressions.a2%>, <%expressions.b2%>, <%expressions.c2%>Wink
/ position = (50, 15)
</text>


<trial mytrial>
/ stimulusframes = [1 = triangle1, triangle2, report]
/ validresponse = (picture.triangle1, picture.triangle2)
/ inputdevice = mouse
/ isvalidresponse = [
0<=expressions.a && expressions.a <= 1 && 0 <= expressions.b && expressions.b <= 1 && 0 <= expressions.c && expressions.c <= 1 || 0<=expressions.a2 && expressions.a2 <= 1 && 0 <= expressions.b2 && expressions.b2 <= 1 && 0 <= expressions.c2 && expressions.c2 <= 1
]
</trial>

<block myblock>
/ trials = [1-3 = mytrial]
</block>

Yellow triangle is practice_triangle1.png and green is practice_triangle2.png
https://www.millisecond.com/forums/Uploads/Images/88dea02a-98f2-4841-9055-0339.pnghttps://www.millisecond.com/forums/Uploads/Images/93d1b0c2-6780-440e-aef0-9e8d.png


At the moment, as I understand it, the || condition in the / isvalidresponse is making the triangle test effectively useless, and I can click on either 'triangle' but the response registered is the first image. Does anyone have any ideas to tie the mouse location to a specific triangle, even though they overlap?

Cheers,
Morgan


You'll want to do something like this:

<picture triangle1>
/ items = ("practice_triangle1.png")
/ position = (50,50)
</picture>

<picture triangle2>
/ items = ("practice_triangle2.png")
/ position = (50,50)
</picture>

<expressions triangle1>
/ x1 = picture.triangle1.left
/ y1 = picture.triangle1.bottom
/ x2 = picture.triangle1.left
/ y2 = picture.triangle1.top
/ x3 = picture.triangle1.right
/ y3 = picture.triangle1.bottom
/ a = ((expressions.y2 - expressions.y3)*(mouse.x - expressions.x3) + (expressions.x3 - expressions.x2)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ b = ((expressions.y3 - expressions.y1)*(mouse.x - expressions.x3) + (expressions.x1 - expressions.x3)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ c = 1 - expressions.a - expressions.b
</expressions>

<expressions triangle2>
/ x12 = picture.triangle2.left
/ y12 = picture.triangle2.top
/ x22 = picture.triangle2.right
/ y22 = picture.triangle2.top
/ x32 = picture.triangle2.right
/ y32 = picture.triangle2.bottom
/ a2 = ((expressions.y22 - expressions.y32)*(mouse.x - expressions.x32) + (expressions.x32 - expressions.x22)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ b2 = ((expressions.y32 - expressions.y12)*(mouse.x - expressions.x32) + (expressions.x12 - expressions.x32)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ c2 = 1 - expressions.a2 - expressions.b2
</expressions>

<text report>
/ items = ("<%mouse.x%>, <%mouse.y%>, <%expressions.a%>, <%expressions.b%>, <%expressions.c%>, <%expressions.a2%>, <%expressions.b2%>, <%expressions.c2%>")
/ position = (50, 15)
</text>


<trial mytrial>
/ ontrialbegin = [
values.response = "";
]
/ stimulusframes = [1 = triangle1, triangle2, report]
/ validresponse = (lbuttondown)
/ inputdevice = mouse
/ isvalidresponse = [
if(0<=expressions.a && expressions.a <= 1 && 0 <= expressions.b && expressions.b <= 1 && 0 <= expressions.c && expressions.c <= 1){
values.response = "triangle1"; true;
}
else if(0<=expressions.a2 && expressions.a2 <= 1 && 0 <= expressions.b2 && expressions.b2 <= 1 && 0 <= expressions.c2 && expressions.c2 <= 1){
values.response = "triangle2"; true;
}
]
</trial>

<block myblock>
/ trials = [1-3 = mytrial]
</block>

<values>
/ response = ""
</values>

<data>
/ columns = (date time subject group blocknum blockcode trialnum trialcode values.response latency)
/ separatefiles = true
</data>


morgan_w
morgan_w
New Member
New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)New Member (36 reputation)

Group: Forum Members
Posts: 5, Visits: 39
Dave - 7/2/2019
morgan_w - 7/2/2019
morgan_w - 7/1/2019
Dave - 7/1/2019
morgan_w - 6/30/2019
Hello!

Sorry if this question has already been asked and answered, I haven't had much luck finding it.

I've been hoping to replicate a response button setup with 8 options that are symmetrically placed around the center of the screen, but the eight options are related in 4 pairs. The standard for this involves triangular buttons in shapes and orientations roughly like the attached image, so that each pair of related options forms a coloured box. At the moment I've noticed that Inquisit is treating the triangles as entire rectangles, which would make the buttons overlap.



Thanks for the help!
Best,
Morgan



I assume you're using <picture> elements for the triangles, which is why they're treated as rectangles. Even if an image displays a triangle, the image itself is still a full rectangle. You would not have that problem with <shape> elements:

<shape a>
/ shape = triangle
/ size = (500px,500px)
/ color = orangered
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,500px)
/ color = orange
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

The above will differentiate between a click in shape A vs shape B just fine, however, creating an array like the one you want is not possible with overlaid <shape>s. You could build an array with rectangles  as a simple workaround.

<shape a>
/ shape = rectangle
/ size = (500px,250px)
/ color = orangered
/ valign = top
</shape>

<shape b>
/ shape = rectangle
/ size = (500px,250px)
/ color = orange
/ valign = bottom
</shape>

<trial mytrial>
/ stimulusframes = [1=b,a]
/ inputdevice = mouse
/ validresponse = (a,b)
</trial>

In sum, there certainly is no easy way to do this, if triangles are an absolute requirement. In theory, you would build a set of custom expressions that perform a triangle test, but the math is not entirely trivial (e.g. https://stackoverflow.com/questions/2049582/how-to-determine-if-a-point-is-in-a-2d-triangle ).

Thanks a lot Dave, really appreciate the options. Will play around with boxes to see if I can get a satisfactory compromise before I attempt the maths!

Hi Dave,

Tried to do the maths in the end (thanks for the link! went with barycentric coordinates) and got it working for a single triangle pretty easily. However, my current attempt will not let me distinguish between two triangles that are placed together to form a square as in any corner of the image above, even though I have triangle tests for both triangles individually. Any ideas to tie each triangle test as the condition for each triangle as a response? I'll include what I've whipped up so far:

<picture triangle1>
/ items = ("practice_triangle.png")
/ position = (50,50)
</picture>

<picture triangle2>
/ items = ("practice_triangle2.png")
/ position = (50,50)
</picture>

<expressions triangle1>
/ x1 = picture.triangle1.left
/ y1 = picture.triangle1.bottom
/ x2 = picture.triangle1.left
/ y2 = picture.triangle1.top
/ x3 = picture.triangle1.right
/ y3 = picture.triangle1.bottom
/ a = ((expressions.y2 - expressions.y3)*(mouse.x - expressions.x3) + (expressions.x3 - expressions.x2)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ b = ((expressions.y3 - expressions.y1)*(mouse.x - expressions.x3) + (expressions.x1 - expressions.x3)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ c = 1 - expressions.a - expressions.b
</expressions>

<expressions triangle2>
/ x12 = picture.triangle2.left
/ y12 = picture.triangle2.top
/ x22 = picture.triangle2.right
/ y22 = picture.triangle2.top
/ x32 = picture.triangle2.right
/ y32 = picture.triangle2.bottom
/ a2 = ((expressions.y22 - expressions.y32)*(mouse.x - expressions.x32) + (expressions.x32 - expressions.x22)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ b2 = ((expressions.y32 - expressions.y12)*(mouse.x - expressions.x32) + (expressions.x12 - expressions.x32)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ c2 = 1 - expressions.a2 - expressions.b2
</expressions>

<text report>
/ items = ("<%mouse.x%>, <%mouse.y%>, <%expressions.a%>, <%expressions.b%>, <%expressions.c%>", <%expressions.a2%>, <%expressions.b2%>, <%expressions.c2%>Wink
/ position = (50, 15)
</text>


<trial mytrial>
/ stimulusframes = [1 = triangle1, triangle2, report]
/ validresponse = (picture.triangle1, picture.triangle2)
/ inputdevice = mouse
/ isvalidresponse = [
0<=expressions.a && expressions.a <= 1 && 0 <= expressions.b && expressions.b <= 1 && 0 <= expressions.c && expressions.c <= 1 || 0<=expressions.a2 && expressions.a2 <= 1 && 0 <= expressions.b2 && expressions.b2 <= 1 && 0 <= expressions.c2 && expressions.c2 <= 1
]
</trial>

<block myblock>
/ trials = [1-3 = mytrial]
</block>

Yellow triangle is practice_triangle1.png and green is practice_triangle2.png
https://www.millisecond.com/forums/Uploads/Images/88dea02a-98f2-4841-9055-0339.pnghttps://www.millisecond.com/forums/Uploads/Images/93d1b0c2-6780-440e-aef0-9e8d.png


At the moment, as I understand it, the || condition in the / isvalidresponse is making the triangle test effectively useless, and I can click on either 'triangle' but the response registered is the first image. Does anyone have any ideas to tie the mouse location to a specific triangle, even though they overlap?

Cheers,
Morgan


You'll want to do something like this:

<picture triangle1>
/ items = ("practice_triangle1.png")
/ position = (50,50)
</picture>

<picture triangle2>
/ items = ("practice_triangle2.png")
/ position = (50,50)
</picture>

<expressions triangle1>
/ x1 = picture.triangle1.left
/ y1 = picture.triangle1.bottom
/ x2 = picture.triangle1.left
/ y2 = picture.triangle1.top
/ x3 = picture.triangle1.right
/ y3 = picture.triangle1.bottom
/ a = ((expressions.y2 - expressions.y3)*(mouse.x - expressions.x3) + (expressions.x3 - expressions.x2)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ b = ((expressions.y3 - expressions.y1)*(mouse.x - expressions.x3) + (expressions.x1 - expressions.x3)*(mouse.y - expressions.y3)) / ((expressions.y2 - expressions.y3)*(expressions.x1 - expressions.x3)+(expressions.x3 - expressions.x2)*(expressions.y1 - expressions.y3))
/ c = 1 - expressions.a - expressions.b
</expressions>

<expressions triangle2>
/ x12 = picture.triangle2.left
/ y12 = picture.triangle2.top
/ x22 = picture.triangle2.right
/ y22 = picture.triangle2.top
/ x32 = picture.triangle2.right
/ y32 = picture.triangle2.bottom
/ a2 = ((expressions.y22 - expressions.y32)*(mouse.x - expressions.x32) + (expressions.x32 - expressions.x22)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ b2 = ((expressions.y32 - expressions.y12)*(mouse.x - expressions.x32) + (expressions.x12 - expressions.x32)*(mouse.y - expressions.y32)) / ((expressions.y22 - expressions.y32)*(expressions.x12 - expressions.x32)+(expressions.x32 - expressions.x22)*(expressions.y12 - expressions.y32))
/ c2 = 1 - expressions.a2 - expressions.b2
</expressions>

<text report>
/ items = ("<%mouse.x%>, <%mouse.y%>, <%expressions.a%>, <%expressions.b%>, <%expressions.c%>, <%expressions.a2%>, <%expressions.b2%>, <%expressions.c2%>")
/ position = (50, 15)
</text>


<trial mytrial>
/ ontrialbegin = [
values.response = "";
]
/ stimulusframes = [1 = triangle1, triangle2, report]
/ validresponse = (lbuttondown)
/ inputdevice = mouse
/ isvalidresponse = [
if(0<=expressions.a && expressions.a <= 1 && 0 <= expressions.b && expressions.b <= 1 && 0 <= expressions.c && expressions.c <= 1){
values.response = "triangle1"; true;
}
else if(0<=expressions.a2 && expressions.a2 <= 1 && 0 <= expressions.b2 && expressions.b2 <= 1 && 0 <= expressions.c2 && expressions.c2 <= 1){
values.response = "triangle2"; true;
}
]
</trial>

<block myblock>
/ trials = [1-3 = mytrial]
</block>

<values>
/ response = ""
</values>

<data>
/ columns = (date time subject group blocknum blockcode trialnum trialcode values.response latency)
/ separatefiles = true
</data>


Legend!

GO


Reading This Topic


Login
Existing Account
Email Address:


Password:


Social Logins

Select a Forum....






Millisecond Forums


Search