> show canvas only <


/* built with Studio Sketchpad: 
 *   https://sketchpad.cc
 * 
 * observe the evolution of this sketch: 
 *   https://designuniandes.sketchpad.cc/sp/pad/view/ro.6aUUyZ9yive/rev.2
 * 
 * authors: 
 *   Samuel Sanchez

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



float estilo;

void setup (){
size (400,400);
background (255); 
smooth();
noStroke();
}

void draw (){  
//I
fill (136, 111, 178, 5);
rect(330, 20, 30, 20);
if((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>20)){
 estilo=9;}
 if(estilo==9){
 if(mousePressed==true){
  fill(mouseX,mouseY,100);
  beginShape(); 
  vertex(38+mouseX, 97+mouseY);
  vertex(35+mouseX,90+mouseY);
  vertex(39+mouseX,91+mouseY);
vertex(41+mouseX,94+mouseY);  
  vertex(38+mouseX,97+mouseY);
  endShape(); 
 }
 }
//H
fill (237, 41, 70, 5);
rect(340, 60, 20, 20);
if((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>60)){
 estilo=8;}
 if(estilo==8){
 if(mousePressed==true){
  fill(mouseX,mouseY,100);
  beginShape();
  vertex(101+mouseX,90+mouseY);
  vertex(107+mouseX,85+mouseY);
  vertex(107+mouseX,82+mouseY);
  vertex(108+mouseX,85+mouseY);
  vertex(103+mouseX,90+mouseY);
  vertex(101+mouseX, 90+mouseY);
  endShape();
 }
 }
//G 
 fill (240, 116, 53,5);
rect(330, 100, 40, 15);
if((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>100)){
 estilo=7;}
 if(estilo==7){
 if(mousePressed==true){
  fill(mouseX,mouseY,100);
  beginShape();
  vertex(52+mouseX,78+mouseY);
  vertex(52+mouseX, 79+mouseY);
  vertex(64+mouseX,79+mouseY);
  vertex (64+mouseX, 77+mouseY);
  vertex(65+mouseX, 80+mouseY);
  vertex(55+mouseX, 80+mouseY);
  vertex(52+mouseX,78+mouseY);
  endShape();
 }
 }
//F
fill (196, 110, 67);
rect(330,130,60,20);
if((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>130)){
 estilo=6;}
 if(estilo==6){
 if(mousePressed==true){
  fill(mouseX,mouseY,100);
  beginShape(); 
  vertex (33+mouseX,70+mouseY);
  vertex (36+mouseX,73+mouseY);
  vertex (36+mouseX,78+mouseY);
  vertex (35+mouseX, 78+mouseY);
  vertex (30+mouseX, 75+mouseY);
  vertex (24+mouseX,67+mouseY); 
  vertex (32+mouseX,74+mouseY);
  vertex (35+mouseX,75+mouseY);
  vertex (33+mouseX,70+mouseY);
  endShape(); 
 }
 }
//E
fill (242,165,49,5);
rect (330,170, 40, 25);
if((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>170)){
 estilo=5;}
 if(estilo==5){
 if(mousePressed==true){
  fill(mouseX,mouseY,100);
  beginShape(); 
  vertex(50+mouseX, 15+mouseY);
  vertex(60+mouseX, 15+mouseY); 
  vertex(70+mouseX, 25+mouseY);
  vertex(60+mouseX, 35+mouseY); 
  vertex(50+mouseX, 35+mouseY);
  vertex(40+mouseX, 25+mouseY); 
  vertex (50+mouseX,15+mouseY); 
  endShape(); 
 }
 }
  
//D
fill(255,233,64,20); 
rect(330,210,15,40);
if((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>210)){
 estilo=4;}
 if(estilo==4){
 if(mousePressed==true){
  fill(mouseX,mouseY,100);
  beginShape();
  vertex(20 +mouseX,40+ mouseY);
  vertex(21+mouseX, 46+mouseY); 
  vertex(22+mouseX,40+mouseY); 
  vertex(23+mouseX, 47+mouseY); 
  vertex(23+mouseX,40+mouseY);
  vertex(24+mouseX,43+mouseY); 
  vertex(25+mouseX,40+mouseY);
  vertex(26+mouseX,47+mouseY); 
  vertex(27+mouseX,40+mouseY); 
  vertex(27+mouseX,55+mouseY);
  vertex(26 +mouseX,48+mouseY);
  vertex(26+mouseX, 55+mouseY); 
  vertex(25+mouseX, 48+mouseY); 
  vertex(24+mouseX, 55+mouseY);
  vertex(23+mouseX, 47+mouseY); 
  vertex (22+mouseX, 59+mouseY);
  vertex(21+mouseX, 49+mouseY); 
  vertex(20+mouseX, 55+mouseY); 
  vertex(20+mouseX, 40+mouseY); 
  endShape(); 
 }
 }
//C
fill(235,242,49);
rect(330,260,30,25); 
if((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>260)){
estilo=3;}
if (estilo==3){
if (mousePressed==true){
  fill(mouseX,mouseY,100);
  beginShape();
  vertex(110+mouseX,50+mouseY);
  vertex(112+mouseX,54+mouseY);
  vertex(118+mouseX,50+mouseY);
  vertex(115+mouseX,56+mouseY);
  vertex(118+mouseX,56.5+mouseY); 
  vertex(115+mouseX,57+mouseY); 
  vertex(118+mouseX,64+mouseY);
  vertex(112+mouseX,60+mouseY); 
  vertex(110+mouseX,63+mouseY); 
  vertex(108+mouseX,60+mouseY);
  vertex(102+mouseX,65+mouseY);
  vertex(106+mouseX,58+mouseY);
  vertex (102+mouseX,57.5+mouseY); 
  vertex(106+mouseX,56+mouseY); 
  vertex(102+mouseX,50+mouseY);
  vertex(108+mouseX,54+mouseY); 
  vertex(110+mouseX,50+mouseY);
  endShape(); 
}
}
// background (255);
//B
fill (203,242,49);
rect(330,300,15,15); 
if ((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>300)){
estilo=2;}
if (estilo==2){

if (mousePressed==true){
fill (mouseX,mouseY,100);
beginShape();
vertex(62+mouseX,92+mouseY);
vertex( 63+mouseX,95+mouseY);
vertex(64+mouseX,91+mouseY); 
vertex(65+mouseX,93+mouseY);
vertex(66+mouseX,91+mouseY);
vertex(67+mouseX,93+mouseY);
vertex(68+mouseX,92+mouseY);
vertex(69+mouseX,91+mouseY); 
vertex(69+mouseX,94+mouseY);
vertex(70+mouseX,93+mouseY);
vertex(71+mouseX,93+mouseY);
vertex(70+mouseX,96+mouseY);
vertex(71+mouseX, 98+mouseY); 
vertex(69+mouseX,97+mouseY);
vertex (67+mouseX,97+mouseY);
vertex(65+mouseX,95+mouseY);
vertex(64+mouseX,96+mouseY);
vertex(63+mouseX,98+mouseY);
vertex(62+mouseX,100+mouseY);
vertex(62+mouseX,98+mouseY);
vertex (61+mouseX,99+mouseY);
vertex (62+mouseX,97+mouseY);
vertex(60+mouseX,97+mouseY);
vertex(62+mouseX,95+mouseY);
vertex(61+mouseX,93+mouseY);
vertex(62+mouseX,94+mouseY);
vertex (62+mouseX,92+mouseY);
endShape(); 
}
}


//A
fill (100,100,100);
rect (330,328,20,20);
if ((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>328)){
estilo=1;}
if (estilo ==1){
if (mousePressed==true){
estilo = 1;
}

//manera de pintar
if (estilo == 1){

//cuando pintar 
if((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>260)){
estilo=1;}
if (estilo ==1){
if (mousePressed==true){
//
fill (mouseX,mouseY,100); 
ellipse (mouseX,mouseY,10,20);
estilo = 1; 
}
}

//Clear
fill (100,100,100);
rect (330,380,20,20); 
if ((mousePressed)&&(mouseX>330)&&(mousePressed)&&(mouseY>380)){
background (255);
}

}
}

}