0:00:00.869,0:00:03.972
Ya aprendiste ha crear tus propias variables y a usarlas.

0:00:03.972,0:00:10.790
Ahora aprenderemos 2 variables especiales: mouseX y mouseY.

0:00:10.790,0:00:16.658
Nunca tendras que crear estas variables, por que de hecho, ya existen.

0:00:16.658,0:00:28.171
El programa establece los valores de estas variable, detrás de las cortinas, asegurándose que el valor de mouseX sea siempre la posición x de tu ratón y mouseY la posición de tu ratón.

0:00:28.171,0:00:33.278
Esto permite hacer facilmente cosas interactivas que dependen de la posición del ratón.

0:00:33.278,0:00:36.508
Veamos la elipse que estoy dibujando aqui.

0:00:36.508,0:00:41.192
Ahorita, la estoy dibujando en 200, 200.

0:00:41.192,0:00:49.718
Si uso mouseX y mouseY, las variables especiales, entonces puedo dibujarla la elipse en las coordinadas mouseX y mouseY.

0:00:49.718,0:00:57.743
Ahora, si muevo el ratón sobre el canvas, puedes ver la elipse es dibujada en donde el ratón esta - entonces sigue a donde el ratón va.

0:00:57.743,0:01:01.760
Esto es super cool, puedes ver lo que estoy dibujando? Woo!

0:01:01.760,0:01:13.839
Si vas a use mouseX y mouseY, tiene que asegurarte que esten dentro de la función draw, porque mira que pase si movemos estas dos lineas fuera de la función draw

0:01:13.839,0:01:15.501
Ves?

0:01:15.501,0:01:26.955
Este codigo solo corre una vez, entonces la elipse es dibujada una vez nada más, y es dibujada donde mi ratón esta al principio del programa.

0:01:26.955,0:01:36.303
Por eso es que necesitamos ponerlo dentro de la función draw, porque la función draw es la función que es llamada repetidamente mientras nuestro programa esta corriendo.

0:01:36.303,0:01:43.735
Entonces queremos que cuando sea llamada, vea cuales son los valores actuales de mouseX y mouseY en ese momento, para que dibuje la elipse en esa posicion.

0:01:43.735,0:01:49.481
Si te pones a pensar, en realidad es bien similar a una animación - cambia en la medida que pasa el tiempo, solo que en una forma diferente.

0:01:49.481,0:01:52.957
Muy bien, ahora podemos hacer cosas mas entretenidas.

0:01:52.957,0:02:03.871
Que tal si, en vez de dibujar la elipse sobre las coordinadas mouseX y mouseY, la dibujo en mouseX pero fijo mouseY a algo asi como 300?

0:02:03.871,0:02:10.589
Ahora puedes ver que la elipse solo sigue mi coordinada x, ignorando el valor de la coordinada y de mi ratón.

0:02:10.589,0:02:21.937
Entonces, que tal si dibujo la elipse en las coordinadas mouseX y mouseY de nuevo, pero quito la llamada a la función background al commentarla?

0:02:21.937,0:02:27.933
Ahora mira, woo! Tengo esta cosa que parece como un genial pincel.

0:02:27.933,0:02:39.509
O, tambien puedo intercambiar estas variables. Dejame traer de regreso la llamada a la función background.

0:02:39.509,0:02:45.907
Se siente raro. Tengo los controles del ratón haciendo lo opuesto a lo que normalmente hacen.

0:02:45.907,0:02:53.400
Pero esta genial, te puedes imaginar el hacer un juego que trata de dibujar algo o hacer algo mientras usas los controles del ratón invertidos.

0:02:53.400,0:02:59.808
Esto es todo sobre mouseX y mouseY - muy divertido. Disfruta!