Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head>
- <title></title>
- <style>
- body{
- text-align: center;
- margin-top: 2%;
- }
- canvas {
- border: 3px solid black;
- }
- .empty {
- width: 50px;
- height: 50px;
- display: inline-block;
- }
- .squareShape {
- width: 50px;
- height: 50px;
- background-color: blue;
- outline: 2px solid black;}
- </style>
- </head>
- <body>
- <canvas id="HongT" width="200px" height="440px">
- </canvas>
- <script type="text/javascript">
- /*var x=[[1,2],[3,4]];
- //Recorrido por filas
- for (var i=0;i<2;i++){
- for (var j=0;j<2;j++){
- document.write(x[i][j]);
- }
- }
- document.write("<br />");
- //Recorrido por filas inverso
- for (var i=1;i>=0;i--){
- for (var j=0;j<2;j++){
- document.write(x[i][j]);
- }
- }
- document.write("<br />");
- //Recorrido por columnas
- for (var i=0;i<2;i++){
- for (var j=0;j<2;j++){
- document.write(x[j][i]);
- }
- }
- document.write("<br />");
- //Recorrido por columnas inverso
- for (var i=1;i>=0;i--){
- for (var j=0;j<2;j++){
- document.write(x[j][i]);
- }
- }
- document.write("<br />");*/
- var canvas=document.getElementById('HongT');
- var ctx=canvas.getContext('2d');
- var actual=[];
- var ancho=20;
- var alto=20;
- var posicion=0;
- actual['top']=0;
- actual['left']=80;
- var columna=10;
- var fila=22;
- function fondo(){
- for (var i=0;i<columna;i++){
- for (var j=0;j<fila;j++){
- ctx.fillStyle="white";
- ctx.fillRect(i*ancho,j*ancho,ancho,ancho);
- ctx.strokeStyle="black";
- ctx.strokeRect(i*ancho,j*ancho,ancho,ancho);
- }
- }
- }
- function nuevaPieza(){
- actual['top']=0;
- actual['left']=80;
- fondo();
- x=Math.floor(Math.random()*7);
- if (x==0) {//T
- actual["mapa"]=[[1,1,1],[0,1,0],[0,0,0]];
- actual["size"]=3;
- actual['color']='purple';
- }
- if (x==1) {///J
- actual["mapa"]=[[0,1,0],[0,1,0],[1,1,0]];
- actual["size"]=3;
- actual['color']='blue';
- }
- if (x==2) {//L
- actual["mapa"]=[[0,1,0],[0,1,0],[0,1,1]];
- actual["size"]=3;
- actual['color']="orange";
- }
- if (x==3) {//cuadrado
- actual["mapa"]=[[1,1,0],[1,1,0],[0,0,0]];
- actual["size"]=3;
- actual['color']='yellow';
- }
- if (x==4) {///S
- actual["mapa"]=[[0,0,0],[0,1,1],[1,1,0]];
- actual["size"]=3;
- actual['color']='green';
- }
- if (x==5) {//Z
- actual["mapa"]=[[0,0,0],[1,1,0],[0,1,1]];
- actual["size"]=3;
- actual['color']='red';
- }
- if (x==6) {//linea
- actual["mapa"]=[[1,1,1,1],[0,0,0,0],[0,0,0,0],[0,0,0,0]];
- actual["size"]=4;
- actual['color']='skyblue';
- }
- }
- nuevaPieza();
- function pintar(){
- fondo();
- actual['top']+=alto;
- for (var i=0;i<actual["size"];i++){
- for (var j=0;j<actual["size"];j++){
- if (actual["mapa"][i][j]!=0) {
- ctx.fillStyle=actual['color'];
- ctx.fillRect(actual['left']+(j*20), actual['top']+(i*20), 20,20);
- ctx.strokeRect(actual['left']+(j*20), actual['top']+(i*20), 20, 20);
- colocar();
- }
- }
- }
- }
- function zuo(){
- if (actual["left"]>0) {
- actual["left"]-=20;
- }
- }
- function you(){
- if (actual["left"]<140) {
- actual["left"]+=20;
- }
- }
- var tab=[
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0],
- [0,0,0,0,0,0,0,0,0,0]];
- var columnas = (actual["left"]/20);
- var filas = (actual["top"]/20);
- function colocar(){
- for(var i=0; i<tab.length; i++) {
- for(var j=0; j<tab[i].length; j++) {
- }
- }
- if (actual['top']>380) {
- nuevaPieza();
- }
- }
- /*
- function freeze(){
- for(var y=world.length-1; y>=0; y--) {
- for(var x=0; x<world[y].length; x++) {
- if(world[y][x] > 0 && world[y][x] < 20 ){
- world[y][x] = world[y][x] + 20;
- }
- }
- }
- validar();
- nuevaPieza();
- }
- function bajar() {
- canMove = true;
- for(var y=world.length-1; y>=0; y--) {
- for(var x=0; x<world[y].length; x++) {
- if(world[y][x] > 0 && world[y][x] < 20 ){
- if(y+1 === world.length || world[y+1][x] > 20){
- canMove = false;
- freeze();
- }
- }
- }
- }
- if (canMove) {
- for(var y=world.length-1; y>=0; y--) {
- for(var x=0; x<world[y].length; x++) {
- if(world[y][x] > 0 && world[y][x] < 20 ){
- world[y+1][x] = world[y][x];
- world[y][x] = 0;
- }
- }
- }
- tab();
- }
- validar();
- }
- function validar(){
- for(var y=world.length-1; y>=0; y--) {
- fullLine = true;
- for(var x=0; x<world[y].length; x++) {
- if(world[y][x] < 20) {
- fullLine = false;
- }
- }
- if (fullLine) {
- world.splice(y, 1);
- world.splice(0, 0, [0,0,0,0,0,0,0,0,0,0])
- y++;
- }
- }
- }
- bajar();*/
- function rotar(){
- if (posicion>3) {
- posicion=0;
- }
- if(x==0){
- if (posicion==1) {
- actual["mapa"]=[[0,0,1],[0,1,1],[0,0,1]];
- }else if (posicion==2) {
- actual["mapa"]=[[0,0,0],[0,1,0],[1,1,1]];
- }else if (posicion==3) {
- actual["mapa"]=[[1,0,0],[1,1,0],[1,0,0]];
- }else{
- actual["mapa"]=[[1,1,1],[0,1,0],[0,0,0]];
- } }
- if(x==1){
- if (posicion==1) {
- actual["mapa"]=[[1,0,0],[1,1,1],[0,0,0]];
- }else if (posicion==2) {
- actual["mapa"]=[[0,1,1],[0,1,0],[0,1,0]];
- }else if (posicion==3) {
- actual["mapa"]=[[0,0,0],[1,1,1],[0,0,1]];
- }else{
- actual["mapa"]=[[0,1,0],[0,1,0],[1,1,0]];
- } }
- if(x==2){
- if (posicion==1) {
- actual["mapa"]=[[0,0,0],[1,1,1],[1,0,0]];
- }else if (posicion==2) {
- actual["mapa"]=[[1,1,0],[0,1,0],[0,1,0]];
- }else if (posicion==3) {
- actual["mapa"]=[[0,0,1],[1,1,1],[0,0,0]];
- }else{
- actual["mapa"]=[[0,1,0],[0,1,0],[0,1,1]];
- } }
- if(x==3){
- actual["mapa"]=[[1,1,0],[1,1,0],[0,0,0]];
- }
- if(x==4){
- if (posicion%2!=0) {
- actual["mapa"]=[[1,0,0],[1,1,0],
- [0,1,0]];
- }else{
- actual["mapa"]=[[0,0,0],[0,1,1],[1,1,0]];
- }}
- if(x==5){
- if (posicion%2!=0) {
- actual["mapa"]=[[0,0,1],[0,1,1],[0,1,0]];
- }else{
- actual["mapa"]=[[0,0,0],[1,1,0],[0,1,1]];
- }}
- if(x==6){
- if (posicion%2!=0) {
- actual["size"]=4;
- actual["mapa"]=[[0,1,0,0],[0,1,0,0],[0,1,0,0],[0,1,0,0]];}
- else{
- actual["mapa"]=[[1,1,1,1],[0,0,0,0],[0,0,0,0],[0,0,0,0]];
- }}}
- document.onkeydown=tecla;
- function tecla(e){
- e=e||window.event;
- if (e.keyCode === 37) {
- zuo();
- } else if (e.keyCode === 39) {
- you();
- } else if (e.keyCode === 38) {
- posicion++;
- rotar();
- }
- else if (e.keyCode === 40) {
- actual['top']+=20;
- }
- }
- setInterval(pintar,1000);
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement