> show canvas only <


/* built with Studio Sketchpad: 
 *   https://sketchpad.cc
 * 
 * observe the evolution of this sketch: 
 *   https://studio.sketchpad.cc/sp/pad/view/ro.Ewo5D9pGyuF/rev.680
 * 
 * authors: 
 *   juanantonioruz
 *   jaruz

 * license (unless otherwise specified): 
 *   creative commons attribution-share alike 3.0 license.
 *   https://creativecommons.org/licenses/by-sa/3.0/ 
 */ 



// nos proponemos incorporar al usuario a la aplicación, es decir que la aplicación escuche al usuario, es decir que escuche sus interacciones, ya sea con el teclado o con el ratón ...

// comenzamos por aumentar el tamaño de las formas con la tecla del cursor "arriba" y por disminuir el tamaño de las formas con la tecla del cursor "abajo" 

// ya que van a cambiar el valor de las variable maximoAncho y maximoAlto con este evento, necesito que esas propiedades sean globales de la aplicación ... es decir declararlas fuera del método, e inicializarlas en el "setup()" para que estén listas para usar en el "draw()" y que también estén disponibles en otros metodos tales como "void keyPressed(){}"    

//al escuchar una tecla pulsada se ejecutará este método, donde evaluaremos el código o identificativo de la tecla pulsada y lo relacionaremos con la logica de crecimiento o decrecimiento de las formas


// ahora se trataría de acceder a las variables para su modificación, pero antes hay que definirlas fuera del metodo "draw()", inicializarlas en el metodo "setup()" y por último modificarlas en el metodo "keyPressed()"

// definición de variables
    int maximoAncho;
    int maximoAlto;

//actualización de variables en pulsacion de teclas 
    void keyPressed(){
        if(keyCode==38){
            // codigo del cursor "arriba"
            maximoAncho++;
            maximoAlto++;
        }else if(keyCode==40){
            maximoAncho--;
            maximoAlto--;
            // codigo del cursor "abajo"
        }
    }


// inicialización de variables
   void setup(){
       maximoAncho=6;
       maximoAlto=6;
    background(255);
    size(300, 300); 
    smooth();
    noStroke();
    frameRate(15);
    }


    void draw(){
        int numeroFormas=500;
        color blanco=color(255,255,255,150);
        color azul=color(100, 100, 255,50);
        color verde=color(0,255, 50, 150);

for(int i=0; i<numeroFormas; i++){
    float azar=random(10);

    if(azar>6){
    fill(blanco);
    }else if(azar>2 && azar<6){
    fill(azul)
    }else{
    fill(verde);
    }
    ellipse(random(width-maximoAncho), random(height-maximoAlto), random(maximoAncho), random(maximoAlto));
    
    }

    }