API tools faq
paste
Advertisement
Guest User

GERADOR-FINAL

a guest
Oct 20th, 2017
69
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5.30 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title></title>
  5.     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.16/p5.min.js"></script>
  6. </head>
  7. <body>
  8.     <script type="text/javascript">
  9.         //variáveis NÃO modificaveis
  10.         var xFinal;
  11.         var xDireita;
  12.         var yFinal;
  13.         var xInicial;
  14.         var yInicial;
  15.         var ponto=0;
  16.         var linhaVerticalD;
  17.         var linhaVerticalE;
  18.         var linhaHorizontal;
  19.         var razaoEspessura;
  20.         var corFundo = [200,50,72];
  21.  
  22.  
  23.         //variáveis modificáveis
  24.         var corDestaque = 0; // varia de 0 a 360
  25.         var orientacao = 0; // pode ser 1 para orientação a direita ou 0 para orientação a esquerda
  26.         var matizFundo = 300; // varia de 0 a 360
  27.         var saturacaoFundo = 30; // varia de 0 a 100
  28.         function setup(){
  29.            
  30.             createCanvas(900,900);
  31.             xFinal = width;
  32.             yFinal = height;
  33.             xInicial = 0;
  34.             yInicial = 0;
  35.             razaoEspessura = 1.25;
  36.             linhaHorizontal = 12.5;
  37.             colorMode(HSB);
  38.            
  39.         }
  40.  
  41.         function draw(){
  42.             background(255);
  43.             ponto=0;
  44.             xDireita = xFinal;
  45.             xEsquerda = 0;
  46.             corFundo[0] = matizFundo;
  47.             corFundo[1] = saturacaoFundo
  48.        
  49.             if(orientacao==1){
  50.                 linhaVerticalE = 0;
  51.                 linhaVerticalD = 23;
  52.             }
  53.             else{
  54.                 linhaVerticalE=23;
  55.                 linhaVerticalD=0;
  56.             }
  57.             for(let i=0; i<18; i++){
  58.                 desenhaQuadrados(i,orientacao);
  59.             }
  60.             xDireita = xFinal;
  61.             xEsquerda = 0;
  62.             if(orientacao==1){
  63.                 linhaVerticalE = 0;
  64.                 linhaVerticalD = 23;
  65.             }
  66.             else{
  67.                 linhaVerticalE=23;
  68.                 linhaVerticalD=0;
  69.             }
  70.             for(let i=0; i<18; i++){
  71.                 desenhaFundo(i,orientacao);
  72.             }
  73.            
  74.             if(orientacao==1){
  75.                 fill(coloracao(corDestaque,17));
  76.                 rect(xDireita-linhaVerticalE-razaoEspessura,yInicial+2*linhaHorizontal*17.5,linhaVerticalE+razaoEspessura,2*linhaHorizontal);
  77.             }
  78.             else{
  79.                 fill(coloracao(corDestaque,17));
  80.                 rect(xEsquerda,yInicial+2*linhaHorizontal*17.5,linhaVerticalD+razaoEspessura*4,2*linhaHorizontal);
  81.             }
  82.         }
  83.         function desenhaQuadrados(numero,orientacao){
  84.             proporcoes(orientacao);
  85.             strokeCap(SQUARE);
  86.             strokeWeight(linhaHorizontal);
  87.             stroke(coloracao(corDestaque,numero));
  88.             //cima
  89.            
  90.             line(xEsquerda,yInicial+2*linhaHorizontal*numero,xDireita,yInicial+2*linhaHorizontal*numero);
  91.            
  92.             //baixo
  93.             //stroke(corDestaque[0],corDestaque[1],corDestaque[2]);
  94.             line(xEsquerda,yFinal-2*linhaHorizontal*numero,xDireita,yFinal-2*linhaHorizontal*numero);
  95.             //esquerda
  96.             strokeWeight(linhaVerticalE);
  97.             //stroke(corDestaque[0],corDestaque[1],corDestaque[2]);
  98.             line(xEsquerda+linhaVerticalE/2,yInicial+2*linhaHorizontal*numero,xEsquerda+linhaVerticalE/2,yFinal-2*linhaHorizontal*numero);
  99.             //direita
  100.             strokeWeight(linhaVerticalD);
  101.             //stroke(corDestaque[0],corDestaque[1],corDestaque[2]);
  102.             line(xDireita-linhaVerticalD/2,yInicial+2*linhaHorizontal*numero,xDireita-linhaVerticalD/2,yFinal-2*linhaHorizontal*numero);
  103.            
  104.             strokeWeight(0);
  105.  
  106.         }
  107.  
  108.         function desenhaFundo(numero,orientacao){
  109.             proporcoes(orientacao);
  110.             if (numero<9){
  111.                 //corFundo[1] += 12;
  112.                 corFundo[2] -= 10;
  113.             }
  114.             else{
  115.                 //corFundo[1] -= 12;
  116.                 corFundo[2]+=10;
  117.             }
  118.             stroke(corFundo[0],corFundo[1],corFundo[2]);
  119.             //cima 
  120.             strokeWeight(linhaHorizontal);
  121.             line(xEsquerda+linhaVerticalE-razaoEspessura,yInicial+(2*linhaHorizontal*numero)+linhaHorizontal,xDireita-linhaVerticalD,yInicial+(2*linhaHorizontal*numero)+linhaHorizontal);
  122.             //baixo
  123.             strokeWeight(linhaHorizontal);
  124.             line(xEsquerda+linhaVerticalE-razaoEspessura,yFinal-(2*linhaHorizontal*numero)-linhaHorizontal,xDireita-linhaVerticalD,yFinal-(2*linhaHorizontal*numero)-linhaHorizontal);
  125.             //esquerda
  126.             if(orientacao==1){
  127.                 strokeWeight(linhaVerticalE+2*razaoEspessura);
  128.             }
  129.             else{
  130.                 strokeWeight(linhaVerticalE+razaoEspessura);
  131.             }
  132.             line(xEsquerda+(linhaVerticalE/2)+linhaVerticalE+razaoEspessura,yInicial+(2*linhaHorizontal*numero)+linhaHorizontal,xEsquerda+(linhaVerticalE/2)+linhaVerticalE+razaoEspessura,yFinal-(2*linhaHorizontal*numero)-linhaHorizontal);
  133.             //direita
  134.             if(orientacao==1){
  135.                 strokeWeight(linhaVerticalD);
  136.             }
  137.             else{
  138.                 strokeWeight(linhaVerticalD+2*razaoEspessura);
  139.             }
  140.             line(xDireita-(linhaVerticalD/2)-linhaVerticalD+razaoEspessura,yInicial+(2*linhaHorizontal*numero)+linhaHorizontal,xDireita-(linhaVerticalD/2)-linhaVerticalD+razaoEspessura,yFinal-(2*linhaHorizontal*numero)-linhaHorizontal);
  141.             strokeWeight(0);
  142.         }
  143.         function coloracao(h,numero){
  144.             let brilhoDestaque = [2,3,6,11,17,26,38,52,67];
  145.             let saturacaoDestaque = [51,67,75,75,82,87,90,88,91];
  146.             if (numero<9){
  147.                 let brilho = brilhoDestaque[ponto];
  148.                 let saturacao = saturacaoDestaque[ponto];
  149.                 ponto++;
  150.                 return color(h,saturacao,brilho);
  151.             }
  152.             else{
  153.                 let brilho = brilhoDestaque[ponto];
  154.                 let saturacao = saturacaoDestaque[ponto];
  155.                 ponto--;
  156.                 return color(h,saturacao,brilho);
  157.             }
  158.         }
  159.         function proporcoes(orientacao){
  160.             if (orientacao==1){
  161.             linhaVerticalD = linhaVerticalD - razaoEspessura;
  162.             linhaVerticalE += razaoEspessura;
  163.             xEsquerda += linhaVerticalE+linhaVerticalE-razaoEspessura;
  164.             xDireita -= linhaVerticalD+linhaVerticalD+razaoEspessura;
  165.             }
  166.             else{
  167.                 linhaVerticalD+=razaoEspessura;
  168.                 linhaVerticalE-=razaoEspessura;
  169.                 xEsquerda+=linhaVerticalE+linhaVerticalE+razaoEspessura;
  170.                 xDireita-=linhaVerticalD+linhaVerticalD-razaoEspessura;
  171.             }
  172.         }
  173.     </script>
  174. </body>
  175. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!