anun1

martes, 7 de diciembre de 2021

Codigo Fuente del Sudoku en html y javascript

 hola amigo como miro que tiene varias visitas el sudoku en vb6 este

https://elblogdeflamer.blogspot.com/2015/10/codigo-fuente-del-sudoku-en-visual.html

y como vb6 ya quedo obsoleto vengo ahora con el mismo codigo pero ahora en html y javascript, por si lo quieren jugar es solo cuestion de copiar el codigo y pegarlo en el bloc de notas y aguardarlo con la extencion html.

ahora qui les dejo el codigo

<html>
<head>
</head>
<body>
<marquee style="background-color:black;color:white;font-size:20;">Sudoku   ...:::By Flamer:::...</marquee><br><br><br><br><br><br><br><br><br><br>
<center>
<br /><table>
<tbody>
<tr>
<td><input id="00" maxlength="1" name="celda00" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="01" maxlength="1" name="celda01" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="02" maxlength="1" name="celda02" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="03" maxlength="1" name="celda03" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="04" maxlength="1" name="celda04" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="05" maxlength="1" name="celda05" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="06" maxlength="1" name="celda06" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="07" maxlength="1" name="celda07" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="08" maxlength="1" name="celda08" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
</tr>
<tr>
<td><input id="10" maxlength="1" name="celda10" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="11" maxlength="1" name="celda11" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="12" maxlength="1" name="celda12" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="13" maxlength="1" name="celda13" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="14" maxlength="1" name="celda14" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="15" maxlength="1" name="celda15" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="16" maxlength="1" name="celda16" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="17" maxlength="1" name="celda17" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="18" maxlength="1" name="celda18" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
</tr>
<tr>
<td><input id="20" maxlength="1" name="celda20px" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="21" maxlength="1" name="celda21" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="22" maxlength="1" name="celda22" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="23" maxlength="1" name="celda23" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="24" maxlength="1" name="celda24" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="25" maxlength="1" name="celda20px" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="26" maxlength="1" name="celda26" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="27" maxlength="1" name="celda27" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="28" maxlength="1" name="celda28" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
</tr>
<tr>
<td><input id="30" maxlength="1" name="celda30" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="31" maxlength="1" name="celda31" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="32" maxlength="1" name="celda32" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="33" maxlength="1" name="celda33" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="34" maxlength="1" name="celda34" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="35" maxlength="1" name="celda20px" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="36" maxlength="1" name="celda36" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="37" maxlength="1" name="celda37" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="38" maxlength="1" name="celda38" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
</tr>
<tr>
<td><input id="40" maxlength="1" name="celda40" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="41" maxlength="1" name="celda41" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="42" maxlength="1" name="celda42" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="43" maxlength="1" name="celda43" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="44" maxlength="1" name="celda44" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="45" maxlength="1" name="celda45" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="46" maxlength="1" name="celda46" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="47" maxlength="1" name="celda47" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="48" maxlength="1" name="celda48" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
</tr>
<tr>
<td><input id="50" maxlength="1" name="celda50" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="51" maxlength="1" name="celda51" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="52" maxlength="1" name="celda52" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="53" maxlength="1" name="celda53" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="54" maxlength="1" name="celda54" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="55" maxlength="1" name="celda55" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="56" maxlength="1" name="celda56" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="57" maxlength="1" name="celda57" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="58" maxlength="1" name="celda58" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
</tr>
<tr>
<td><input id="60" maxlength="1" name="celda60" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="61" maxlength="1" name="celda61" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="62" maxlength="1" name="celda62" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="63" maxlength="1" name="celda63" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="64" maxlength="1" name="celda64" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="65" maxlength="1" name="celda65" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="66" maxlength="1" name="celda66" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="67" maxlength="1" name="celda67" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="68" maxlength="1" name="celda68" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
</tr>
<tr>
<td><input id="70" maxlength="1" name="celda70" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="71" maxlength="1" name="celda71" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="72" maxlength="1" name="celda72" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="73" maxlength="1" name="celda73" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="74" maxlength="1" name="celda74" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="75" maxlength="1" name="celda75" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="76" maxlength="1" name="celda76" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="77" maxlength="1" name="celda77" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="78" maxlength="1" name="celda78" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
</tr>
<tr>
<td><input id="80" maxlength="1" name="celda80" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="81" maxlength="1" name="celda81" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="82" maxlength="1" name="celda82" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="83" maxlength="1" name="celda83" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="84" maxlength="1" name="celda84" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="85" maxlength="1" name="celda85" style="background-color: white; color: black; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="86" maxlength="1" name="celda86" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="87" maxlength="1" name="celda87" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td>
<td><input id="88" maxlength="1" name="celda88" style="background-color: black; color: white; font-size: 20px; height: 30px; text-align: center; width: 30px;" type="text" /></td></tr>
</tbody></table>
<br /><br />
<label id="005" style="color: blue; font-size: 12pt;"></label><br />
<input name="boton3" onclick="Generar()" type="button" value="Generar Nuevo Tablero" />
<input name="boton4" onclick="Revisar()" type="button" value="Revisar Mi Respuestas" />
<input name="boton4" onclick="Solucion()" type="button" value="Ver Solucion" />
</center>
<script languaje="javascript">
var clave=new Array(8);

for(var k=0;k<9;k++)
{
   clave[k]=new Array(8);
}
function imprimirSudoku()
{
  for(var y=0;y<9;y++)
  {
    for(var x=0;x<9;x++)
    {
       if((parseInt((10-1+1)*Math.random()+1))<6) 
       {
         document.getElementById((x.toString())+(y.toString())).value=clave[y][x];
         document.getElementById((x.toString())+(y.toString())).disabled=true;
       }
       else
       {
         document.getElementById((x.toString())+(y.toString())).value="";
       }  
    }
  }    
}

function Revisar()
{
  var y,x,z,v,vx,vy,conta=0;

   for(y=0;y<9;y++)
   {
      for(x=0;x<9;x++)
      {
         v=document.getElementById((x.toString())+(y.toString())).value;

          for(z=0;z<9;z++)
          {
            vy=document.getElementById((x.toString())+(z.toString())).value;
             if(z!=y)
             {
                if(v==vy)
               {  
                   conta++;
               } 
             }
            vx=document.getElementById((z.toString())+(y.toString())).value;
             if(z!=x)
             {
                if(v==vx)
                {
                   conta++;
                } 
             }   
          }
      }
   }
 if(conta==0)
 {
    document.getElementById("005").innerHTML="Correcto";
 }
 else
 {
   document.getElementById("005").innerHTML="Incorrecto";
 }  
}
function Solucion()
{
for(var y=0;y<9;y++)
  {
    for(var x=0;x<9;x++)
    {   
       document.getElementById((x.toString())+(y.toString())).value=clave[y][x];
       document.getElementById((x.toString())+(y.toString())).disabled=true;
    }
  }
}
function generarSudoku()
{
 var numeros=new Array(8);
 var x,y,po,z;

 for(x=0;x<9;x++)
 {
   for(y=0;y<9;y++)
   {
      document.getElementById((x.toString())+(y.toString())).disabled=false;
   } 
 }
 for(x=0;x<9;x++)
 {
     numeros[x]=x+1;
 }
 x--;
 z=0;
 while(x>-1)
 {
    po=parseInt((x-0+1)*Math.random()+0);
    clave[0][z]=numeros[po];
 for(y=po;y<x;y++)
 {
    numeros[y]=numeros[y+1];
 }
 x--;
 z++;
 }
 //1
 clave[1][0]=clave[0][3];
 clave[1][1]=clave[0][4];
 clave[1][2]=clave[0][5];
 //2
 clave[2][0]=clave[0][6];
 clave[2][1]=clave[0][7];
 clave[2][2]=clave[0][8];
 
 
 //3
 clave[1][3]=clave[0][6];
 clave[1][4]=clave[0][7];
 clave[1][5]=clave[0][8];
 //4
 clave[2][3]=clave[0][0];
 clave[2][4]=clave[0][1];
 clave[2][5]=clave[0][2];
 
 
 //5
 clave[1][6]=clave[0][0];
 clave[1][7]=clave[0][1];
 clave[1][8]=clave[0][2];
 //6
 clave[2][6]=clave[0][3];
 clave[2][7]=clave[0][4];
 clave[2][8]=clave[0][5];
 
 
 //7
 clave[3][0]=clave[0][1];
 clave[3][1]=clave[0][2];
 clave[3][2]=clave[1][0];
 //8
 clave[4][0]=clave[1][1];
 clave[4][1]=clave[1][2];
 clave[4][2]=clave[2][0];
 //9
 clave[5][0]=clave[2][1];
 clave[5][1]=clave[2][2];
 clave[5][2]=clave[0][0];
 
 
 //10
 clave[3][3]=clave[4][0];
 clave[3][4]=clave[4][1];
 clave[3][5]=clave[4][2];
 //11
 clave[4][3]=clave[5][0];
 clave[4][4]=clave[5][1];
 clave[4][5]=clave[5][2];
 //12
 clave[5][3]=clave[3][0];
 clave[5][4]=clave[3][1];
 clave[5][5]=clave[3][2];
 
 
 //13
 clave[3][6]=clave[5][0];
 clave[3][7]=clave[5][1];
 clave[3][8]=clave[5][2];
 //14
 clave[4][6]=clave[3][0];
 clave[4][7]=clave[3][1];
 clave[4][8]=clave[3][2];
 //15
 clave[5][6]=clave[4][0];
 clave[5][7]=clave[4][1];
 clave[5][8]=clave[4][2];
 
 
 //16
 clave[6][0]=clave[3][1];
 clave[6][1]=clave[3][2];
 clave[6][2]=clave[4][0];
 //17
 clave[7][0]=clave[4][1];
 clave[7][1]=clave[4][2];
 clave[7][2]=clave[5][0];
 //18
 clave[8][0]=clave[5][1];
 clave[8][1]=clave[5][2];
 clave[8][2]=clave[3][0];
 
 
 //19
 clave[6][3]=clave[7][0];
 clave[6][4]=clave[7][1];
 clave[6][5]=clave[7][2];
 //20
 clave[7][3]=clave[8][0];
 clave[7][4]=clave[8][1];
 clave[7][5]=clave[8][2];
 //21
 clave[8][3]=clave[6][0];
 clave[8][4]=clave[6][1];
 clave[8][5]=clave[6][2];
 
 
 //22
 clave[6][6]=clave[8][0];
 clave[6][7]=clave[8][1];
 clave[6][8]=clave[8][2];
 //23
 clave[7][6]=clave[6][0];
 clave[7][7]=clave[6][1];
 clave[7][8]=clave[6][2];
 //24
 clave[8][6]=clave[7][0];
 clave[8][7]=clave[7][1];
 clave[8][8]=clave[7][2];
 
}
function Generar()
{   
   document.getElementById("005").innerHTML="";
   generarSudoku();
   imprimirSudoku();
}
</script>
</body>
</html>

espero les sea de su agrado y ha alguien le sirva saludos Flamer


No hay comentarios.:

Publicar un comentario