Secciones de la página

simulator. js


Javascript


Árbol de ficheros

Tol

Artículos del sitio

Presentación de Tol

Todos los programas

Simuladores visuales

Sitios que me gustan

Por categorías

Algoritmia

Búsqueda y ordenación

Computación fisiológica

Editorial y edición

Gráficos de datos

Herramientas y utilidades

Hipertexto

Informática forense

Lectura óptica de datos

Metaprogramación

No determinista

Ofimática

Recursión e iteración

Reglas y restricciones

Series y estadística









simulator.js de Constraint.Queen

Resolucion del problema de las 8 reinas en un tablero de ajedrez. Contiene todas las funciones para visualizar paso a paso la resolucion por Tol de uno o de varios casos de problemas. En general se entiende que hay a) un array indice de casos resueltos SimCasArr, b) donde el caso en curso de simulacion es SimCasAct y su array de pasos que hay que visualizar es SimCasArr[SimCasAct] c) que cada caso consta de una serie de pasos, step, de resolucion donde la posicion del paso en curso es SimStpAct y d) que el area de visualizacion de pasos es SimStpDiv e) que se encuentra dentro de un panel de control de la simulacion, SimBox, f) con botones de inicio, SimBotExe, de parada, SimBotSto, stop, y de continuacion, SimBotCon.

Javascript

//////////////////////////////////////////////////////////////////////////////
// FILE    : simulator.js
// AUTHOR  : http://www.asolver.com
// PURPOSE : Resolucion del problema de las 8 reinas en un tablero de ajedrez.
// Contiene todas las funciones para visualizar paso a paso la resolucion por
// Tol de uno o de varios casos de problemas.
// En general se entiende que hay
// a) un array indice de casos resueltos SimCasArr,
// b) donde el caso en curso de simulacion es SimCasAct y su array de pasos
//    que hay que visualizar es SimCasArr[SimCasAct]
// c) que cada caso consta de una serie de pasos, step, de resolucion donde
//    la posicion del paso en curso es SimStpAct y
// d) que el area de visualizacion de pasos es SimStpDiv
// e) que se encuentra dentro de un panel de control de la simulacion, SimBox,
// f) con botones de inicio, SimBotExe, de parada, SimBotSto, stop, y de
//    continuacion, SimBotCon.
//////////////////////////////////////////////////////////////////////////////


//////////////////////////////////////////////////////////////////////////////
// CONSTANTS, los busca SimGetElements()
//////////////////////////////////////////////////////////////////////////////

var SimStpDiv; // Area de pasos de simulacion

var SimBotExe; // Boton de ejecucion
var SimBotSto; // Boton de parada, stop
var SimBotCon; // Boton de continuar

var SimCasFrm; // Campo selector del caso, dentro del form
var SimStpFrm; // Campo de visualizacion de pasos, step, dentro del form
var SimSpdFrm; // Campo selector de velocidad de simulacion, dentro del form


//////////////////////////////////////////////////////////////////////////////
// CONTROLS
//////////////////////////////////////////////////////////////////////////////

var SimCasAct = 0; // Numero del caso en curso, es una posicion en SimCasArr
var SimStpAct = 0; // Numero del paso en curso del caso en curso
var SimStpLst = 0; // Numero del ultimo paso (solo para visualizacion)

var SimAlt = 1;      // Si true se para
var SimTim = 100;    // Milisegundos de espera
var SimSep = "";     // Casillas de separacion


//////////////////////////////////////////////////////////////////////////////
// FUNCTIONS
//////////////////////////////////////////////////////////////////////////////


//////////////////////////////////////////////////////////////////////////////
   function SimSepCreate(numEle, // Numero de caracteres
                         codChr) // Codigo del caracter separador

// PURPOSE: Crea y retorna un separador de numEle caracteres codChr para el
// final del area de simulacion.
// La llamada a esta funcion y el elemento separador puede depender del objeto
// de la simulacion.
// Termina el separador con un salto de linea
//////////////////////////////////////////////////////////////////////////////
{
  var simSep = "";

  for(var i=1; i<=numEle; i++) // Separador para la base del area de simulacion
      { simSep = simSep + "<span class='sp'>"+codChr+"</span>"; }

  return(simSep + "<br />");
}


//////////////////////////////////////////////////////////////////////////////
   function SimExp(stpCod, // Paso de solucion codificado a expandir
                   putTrz) // Si cierto incluye la accion o reaccion

// PURPOSE: Expande un paso codificado de simulacion, stpCod, donde cada
// caracter o conjunto de caracteres ha de ser expandido por el codigo Html
// adecuado para visualizar adecuadamente la simulacion.
// Es una funcion muy dependiente de cada caso concreto de simulacion.
//////////////////////////////////////////////////////////////////////////////
{
  SimSep = SimSepCreate(8, "&#9817;"); // Crea un elemento separador

  var stpCls = stpCod;

  if(!putTrz) { stpCls = stpCls.substring(0, 72); } // Los primeros 72

  var rep_we = stpCls.replace(/·/g, // Casilla we white empty
                              "<span class='we'>&#9817;</span>");

  var rep_be = rep_we.replace(/X/g, // Casilla be black empty
                              "<span class='be'>&#9817;</span>");

  var rep_wq = rep_be.replace(/O/g, // Casilla wq white with queen
                              "<span class='wq'>&#9819;</span>");

  var rep_bq = rep_wq.replace(/Q/g, // Casilla wq black with queen
                              "<span class='bq'>&#9819;</span>");

  var rep_nl = rep_bq.replace(/\|/g, // New line | es un caracter especial
                              "<br />");

  var rep_at = rep_nl.replace(/A/g, // Action tr(raze)
                              SimSep+"<span class='ta'>Acción la reina ");

  var rep_re = rep_at.replace(/R/g, // Reaction tr(raze)
                              SimSep+"<span class='tr'>Reacción la reina ");

  var rep_to = rep_re.replace(/:/g, // Movement
                              " a la fila ");

  var rep_in = rep_to.replace("INIT", // INIT solo hay uno
                              SimSep+"<span class='ta'>"+
                              "Inicio con las 8 reinas al azar");

  if(putTrz) { rep_in = rep_in + "</span><br />"; } // Si traza añade su final
  else       { rep_in = rep_in + SimSep; }          // Sin traza

  return(rep_in);
}


//////////////////////////////////////////////////////////////////////////////
   function SimCasFrmWrite()

// PURPOSE: Escribe un selector de formularios para todos los casos que estan
// disponibles. El texto de las etiquetas puede ser dependiente del problema.
//////////////////////////////////////////////////////////////////////////////
{
  var selIni = "<select onchange ='SimCase()' id='SimCasFrm'>";
  var selEnd = "</select>";
  var selAll = "";

  for(var arrPos=0; arrPos < SimCasArr.length; arrPos++) // Para los casos
  {
    var stpNum = SimCasArr[arrPos].length-1; // Pasos del caso

    var lblPos = arrPos + 1; // Del 1 en adelante, no del 0 en adelante
    var selLbl = "Caso " + lblPos + ": " + stpNum + " pasos";

    var selChk = " ";                        // En principio no seleccionado,
    if(arrPos==0) { selChk = " selected "; } // salvo que sea el primero

    var optTxt = "<option" + selChk + "value=" + arrPos + ">" +
                                                 selLbl + "</option>";
    selAll = selAll + optTxt;
  }
  document.write(selIni + selAll + selEnd);
}


//////////////////////////////////////////////////////////////////////////////
   function SimCasAllWrite()

// PURPOSE: Escribe todos los casos resueltos que tiene almacenados, para ello
// visualiza el ultimo paso de cada uno
//////////////////////////////////////////////////////////////////////////////
{
  var divIni = "<div class='SimStpDiv'>";
  var divEnd = "</div>";

  for(var arrPos=0; arrPos < SimCasArr.length; arrPos++) // Para los casos
  {
    var casArr = SimCasArr[arrPos];         // Array de pasos del enesimo caso
    var stpLst = casArr.length-1;           // Ultimo paso de ese caso
    var htmSol = SimExp(casArr[stpLst], 0); // Expande el caso sin traza

   document.write(divIni + htmSol + divEnd);
  }
}


//////////////////////////////////////////////////////////////////////////////
  function SimUpdate()

// PURPOSE: Cambia el contenido del area de simulacion para que se visualice
// el codigo del paso actual del caso actual.
//////////////////////////////////////////////////////////////////////////////
{ 
  var casArr = SimCasArr[SimCasAct]; // Array de pasos del caso actual

  SimStpDiv.innerHTML = SimExp(casArr[SimStpAct], 1); // Expande muestra traza
}


//////////////////////////////////////////////////////////////////////////////
   function SimGetElements()

// PURPOSE: Busca todos los elementos (areas, botones, etc.) necesarios para
// realizar la simulacion, todos tienen nombres fijos.
//////////////////////////////////////////////////////////////////////////////
{
  SimStpDiv = document.getElementById("SimStpDiv"); // Area de simulacion

  SimBotExe = document.getElementById("SimBotExe"); // Boton de inicio
  SimBotSto = document.getElementById("SimBotSto"); // Boton de parada
  SimBotCon = document.getElementById("SimBotCon"); // Boton de continuar

  SimCasFrm = document.getElementById("SimCasFrm"); // Selector casos
  SimStpFrm = document.getElementById("SimStpFrm"); // Visualizador pasos
  SimSpdFrm = document.getElementById("SimSpdFrm"); // Selector de velocidad

  SimSep = SimSepCreate(8, "&#9817;"); // Crea un elemento separador
  
  SimUpdate(); // Visualizar el primer paso del primer caso para rellenar
}


//////////////////////////////////////////////////////////////////////////////
function SimStpFrmWrite()

// PURPOSE: Actualiza el campo del frame que indica el paso actual y el total
// de pasos del caso en curso.
//////////////////////////////////////////////////////////////////////////////
{ SimStpFrm.value = SimStpAct + " | " + SimStpLst; }


//////////////////////////////////////////////////////////////////////////////
function SimTimeoutCicle()

// PURPOSE: Ciclo de visualizacion de la solucion mientras no se llegue al
// final de la simulacion o no se pare el ciclo SimAlt = true.
//////////////////////////////////////////////////////////////////////////////
{ 
       if(SimAlt==1) { SimAlt = 1; }                // Para el ciclo
  else if(SimStpAct >= SimCasArr[SimCasAct].length) // Final
  {
    SimAlt = 1;
    SimAct = 0;
  } 
  else // Ejecucion normal
  { 
    SimStpFrmWrite();                       // Visualiza el contador de pasos
    SimUpdate();                            // Actualizar el paso
    SimStpAct++;                            // Incrementa el contador
    setTimeout("SimTimeoutCicle()",SimTim); // Autoprograma el siguiente paso
  }
}


//////////////////////////////////////////////////////////////////////////////
function SimSpeed()

// PURPOSE: Cambia la velocidad segun la indicacion del selector de velocidad.
//////////////////////////////////////////////////////////////////////////////
{ SimTim = SimSpdFrm.value; }


//////////////////////////////////////////////////////////////////////////////
function SimCase()

// PURPOSE: Cambia el caso segun la indicacion del selector de casos.
//////////////////////////////////////////////////////////////////////////////
{
  SimCasAct = SimCasFrm.value; // Selecciona un nuevo caso
  SimStpAct = 0;               // Estado de salida y no cambia a parado
  SimStpLst = SimCasArr[SimCasAct].length - 1; // Ultimo paso
  SimUpdate();                 // Visualizar este primer estado
  SimStpFrmWrite();            // Visualiza el contador de pasos
}


//////////////////////////////////////////////////////////////////////////////
function SimExecute()

// PURPOSE: Inicia el ciclo desde el principio si estaba parado.
//  Se activa mediante el boton de ejecutar.
//////////////////////////////////////////////////////////////////////////////
{
  if(SimAlt) // Si estaba parado lo pone en marca con el contador a cero
  {
    SimAlt = 0;                                  // No se para el ciclo
    SimStpAct = 0;                               // Vuelve al primer paso
    SimStpLst = SimCasArr[SimCasAct].length - 1; // Ultimo paso
    SimTimeoutCicle();                           // Comienza el ciclo
  }
}


//////////////////////////////////////////////////////////////////////////////
function SimStop()

// PURPOSE: Para el ciclo de visualizacion.
// Se activa mediante el boton de parar.
//////////////////////////////////////////////////////////////////////////////
{
  SimAlt = 1; // Para el ciclo
}


//////////////////////////////////////////////////////////////////////////////
function SimContinue()

// PURPOSE: Sigue el ciclo de visualizacion por donde fuera si estaba parado.
// Se activa mediante el boton de continuar.
//////////////////////////////////////////////////////////////////////////////
{
  if(SimAlt) // Si estaba parado lo pone en marca con el contador que llevaba
  {
    SimAlt = 0;               // No se para el ciclo
    SimTimeoutCicle();        // Comienza el ciclo
  }
}

Árbol de ficheros

Constraint.Queen solucionador de las 8 reinas en ajerez con restricciones y acciones

  • make.tol resuelve con restricciones y 2 clases de acciones las 8 reinas
  • make.bat mandato de ejecucion del programa de resolucion de las 8 reinas
  • simulator directorio del simulador del proceso de resolucion en Javascript
    • css directorio para css, Cascading Style Sheets, del simulador
      • simulator.css css para simular un tablero de ajedrez con 8 reinas
    • src directorio de codigo fuente Javascript del simulador de 8 reinas
      • simulator.js funciones para simular la resolucion del tablero y 8 reinas
      • simulatorarray.js array metaprogramado con los 92 casos de solucion
    • solved directorio con las 92 posibles variantes del problema resueltas
      • p46827135.js array con los pasos de resolucion de un caso con 8 reinas
  • startlog.txt traza de solucion partiendo de las 8 reinas en la primera fila
  • simulator.html simulador visual en Javascript de los 92 casos de las 8 reinas
  • sim92chess.html las 92 soluciones juntas de 8 reinas en un tablero de ajedrez
  • constraint_queen.pdf funciones del solucionador con restricciones de las 8 reinas

2015 asolver.com | Aviso legal | XHTML | Δ Θ Ξ | Creative Commons | Mapa y funciones del sitio

Tol