XML Feeds

.

[javascript-dev] mouseover zone detection

pnyboer pnyboer at slambassador.com
Tue Apr 15 15:11:01 MDT 2008


Below is a patch and JS that does mouseover zone detection.  If you are over a certain region, it will output some info.  I'm wondering if there's a more elegant way to do this; I''m using a lot of "ifs" to test the coordinates, and it seems a pretty unweildly way to go.  Is there a clever way of doing this? (the zones are irregular)


/* BEGIN JAVASCRIPT buttongrid.js */
//detect where the mouse is hovering and if it's in a relevant zone, output some info about that zone.

autowatch = 1;
var Btn0 = [ 0 , 0 , 48 , 48 ] ;
var Btn1 = [ 80 ,41 , 113 , 74 ] ;
var Btn2 = [ 98 ,97 , 177 ,176 ] ;
var Btn3 = [ 162 , 8 , 189 , 35 ] ;
var Btn4 = [ 207 ,40 , 273 , 106 ] ;
var Btn5 = [ 303 ,110 , 326 , 133 ] ;
var thebutton = -1; 
var thebuttonchange = 0;
function mouse(x,y){
	if(x>Btn0[0] && x<Btn0[2] && y>Btn0[1] && y<Btn0[3]) thebutton = "Button Zero";
	if(x>Btn1[0] && x<Btn1[2] && y>Btn1[1] && y<Btn1[3]) thebutton = "Button One";
	if(x>Btn2[0] && x<Btn2[2] && y>Btn2[1] && y<Btn2[3]) thebutton = "Button Two";
	if(x>Btn3[0] && x<Btn3[2] && y>Btn3[1] && y<Btn3[3]) thebutton = "Button Three";
	if(x>Btn4[0] && x<Btn4[2] && y>Btn4[1] && y<Btn4[3]) thebutton = "Button Four";
	if(x>Btn5[0] && x<Btn5[2] && y>Btn5[1] && y<Btn5[3]) thebutton = "Button Five";
	//etc.
	if(thebutton != thebuttonchange) outlet(0,thebutton)
	thebuttonchange = thebutton;
}

/*END JAVASCRIPT*/

#P window setfont "Sans Serif" 10.;
#P window linecount 2;
#P comment 130 381 259 196618 patch and js by Peter Nyboer pnyboer-at-slambassador-dot-com;
#P window setfont "Sans Serif" 9.;
#P window linecount 3;
#P comment 67 313 259 196617 *true \, there's ways of getting button coordinates and sizes with scripting \, but my question is a more general nature about mouseover zones;
#P window setfont "Sans Serif" 10.;
#P window linecount 5;
#P comment 40 236 259 196618 It seems there should be a more clever way to do these zones in the javascript. Look inside \, and there's a bunch of "if" statements testing for each zone. It seems like I'm using brute force - is there a more elegant way this type of thing is done?;
#P window setfont "Sans Serif" 9.;
#P window linecount 1;
#P newex 393 40 48 196617 loadbang;
#P message 430 63 42 196617 mode 2;
#P newex 393 119 20 196617 t b;
#P newex 393 61 33 196617 t poll;
#P newex 393 82 66 196617 mousestate;
#P button 303 110 23 0;
#P button 207 40 66 0;
#P button 162 8 27 0;
#P button 98 97 79 0;
#P button 80 41 33 0;
#P button 0 0 48 0;
#P newex 393 141 79 196617 pack mouse 0 0;
#P window setfont "Sans Serif" 18.;
#P message 394 208 169 196626 -1;
#P window setfont "Sans Serif" 9.;
#P newex 393 187 62 196617 prepend set;
#P newex 393 163 80 196617 js buttongrid.js;
#P comment 75 217 199 196617 mouse over a button to change the label.;
#P connect 11 2 4 2;
#P connect 15 0 12 0;
#P connect 15 0 14 0;
#P connect 11 1 13 0;
#P connect 11 1 4 1;
#P hidden connect 2 0 3 0;
#P connect 1 0 2 0;
#P connect 4 0 1 0;
#P connect 13 0 4 0;
#P connect 12 0 11 0;
#P connect 14 0 11 0;
#P window clipboard copycount 19;



--
* * * *
The Altamont
2 oz light rum
3/4 oz lime juice
1/2 oz orange curaçao
1/4 oz orgeat
splash of pernod
handful of fresh mint leaves
shake contents vigorously with ice.
Strain well into a chilled cocktail glass.
* * * *


More information about the javascript-dev mailing list