Das Game of Life von dem englischen Mathematiker John Horton Conway wird durch dieses Javascript von unserem User mc santa dargestellt.

Was es mit dem Spiel auf sich hat, könnt ihr bei Wikipedia nachlesen.

Ihr könnt den Zustand einzelner Zellen von lebendig nach tot (oder umgekehrt) mit einem Mausklick auf die jeweilige Zelle ändern. Ebenso könnt ihr das ganze Spielfeld zufällig belegen lassen und auch die Schritte einzeln durchlaufen lassen.

PS: Das Javascript läuft im Internet Explorer etwas langsamer als im Firefox oder in Opera.

<!-- präsentiert von kostenlose-javascripts.de --> <style> .cell { height: 10px; width: 10px; font-size: 10px; line-height: 10px; letter-spacing: 10px; } </style> <script type='text/javascript'> <!-- /* // ============================== // // /////////Game of Life///////// // // ============================== // // /////////VERSION 2.4.0//////// // // ////////////////////////////// // // //////Sa, der 24-11-2007////// // // /////////////(dd-mm-yyyy)///// // // ////////////////////////////// // // ////////////////////////////// // // Greetz Santa // // ============================== // // ////////////////////////////// // // verändert an dem Programm was/ // // ihr wollt, aber wundert euch// // // dann nicht wenn irgendwas nich // // funzt. :P ansonsten Viel Spaß/ // // ////////////////////////////// // // ============================== // */ // note: // Aufgrund des aufbaus des Scriptes wurden ale koordinaten vertauscht und gedreht. // dadurch steht (1,0) für: // 0 1 // 0 |o|o| // 1 |x|o| // die erste koordinate gibt also die vertikale distanz von oben nach unten inkl 0 an // die zweite koordinate die horizonale distanz von links nach rechts inkl 0 // jeweils vom der linken oberen ecke des gesammten feldes aus gesehen. // ============= // bitte ändern: Macht das feld nicht zu groß, weil es ansonsten doch recht lange dauert. // ============= var height = 30; //höhe var width = 30; //breite var dead = "#000000"; // farbe für tote zellen var alive = "#ffffff"; // farbe für lebende zellen var born = new Array('3'); var survive = new Array('2', '3'); // var n, x, cur, gen=0, time=100, a, play=false, paint=false, erase=false; // ================ // Arrays erstellen // ================ var now = new Array(height); for (i = 0; i < height; i++) { now[i] = new Array(width); for (j = 0; j < width; j++) { now[i][j] = false; } } var then = new Array(height); for (i = 0; i < height; i++) { then[i] = new Array(width); for (j = 0; j < width; j++) { then[i][j] = false; } } var change = new Array(height); for (i = 0; i < height; i++) { change[i] = new Array(width); for (j = 0; j < width; j++) { change[i][j] = false; } } // Anzahl der lebenden Nachbarzellen function getNeighbors(row,col) { x = 0; if (checkCell(row-1,col-1)) x++; if (checkCell(row-1,col )) x++; if (checkCell(row-1,col+1)) x++; if (checkCell(row ,col-1)) x++; if (checkCell(row ,col+1)) x++; if (checkCell(row+1,col-1)) x++; if (checkCell(row+1,col )) x++; if (checkCell(row+1,col+1)) x++; return x; } // Eine neue genration erstellen und im Array then speichern function generation() { gen++; for (i = 0; i < height; i++) { for (j = 0; j < width; j++) { n = getNeighbors(i,j); if (!now[i][j]) { for (k = 0; k < born.length; k++) { if (n == born[k]) then[i][j] = true; } } else { then[i][j] = false; for (k = 0; k < survive.length; k++) { if (n == survive[k]) then[i][j] = true; } } change[i][j] = (now[i][j] != then[i][j]); } } draw(); } // Die neue Generation auf das Feld übertragen function draw() { for (i = 0; i < height; i++) { for (j = 0; j < width; j++) { if (change[i][j]) { now[i][j] = then[i][j]; document.getElementById(i + ',' + j).style.backgroundColor = (then[i][j]) ? alive : dead; } } } document.getElementById("gen").value = gen; } function checkCell(row,col) { //status abfragen if (row >= 0 && row < height && col >= 0 && col < width) return now[row][col]; // in bounce else return false; // out of bounce } // Status der Zelle ändern function switchCell(row,col) { if (checkCell(row,col)) kill(row,col); else liven(row,col); } //zelle beleben function liven(row,col) { document.getElementById(row + ',' + col).style.backgroundColor = alive; now[row][col] = true; then[row][col] = true; } //zelle töten function kill(row,col) { document.getElementById(row + ',' + col).style.backgroundColor = dead; now[row][col] = false; then[row][col] = false; } // neue Zeit einspeichern function setTime() { time = parseInt(document.getElementById('zeit').options[document.getElementById('zeit').selectedIndex].value); } // neue Regeln festlegen (kann theoretisch ergänzt werden) function setRule() { x = parseInt(document.getElementById('rule').options[document.getElementById('rule').selectedIndex].value); if (x = 1) born = new Array('3'); survive = new Array('2', '3'); if (x = 2) born = new Array('3', '6'); survive = new Array('2', '3'); } // OnMouseDown function down(row, col) { paint = true; if (checkCell(row,col)) erase = true; else erase = false; } // OnMouseUp function up() { paint = false; } // OnMouseMove function move(row,col) { if (paint) if (!erase) liven(row,col); else kill(row,col); document.selection.empty(); //sonst hat man so hässliche blaue selektierstreifen } // hm ja ihr habt recht diese function ist ein klein wenig sinnlos^^ function step() { generation(); } // Automatische erstellung neuer Generationen in einem Intervall function go() { if (!play) a = window.setInterval('generation()', time); //intervall wird nur aufgerufen, wenn nicht schon einer existiert play = true //generation(); } // Intervall stoppen function stop() { gen = 0; window.clearInterval(a); play = false; } // Intervall stoppen aber Generationen Anzahl nicht auf 0 setzen function pause() { window.clearInterval(a); play = false; } // Feld formatieren function reset() { for (i = 0; i < height; i++) { for (j = 0; j < width; j++) { document.getElementById(i + ',' + j).style.backgroundColor = dead; now[i][j] = false; then[i][j] = false; } } } // felder zufällig füllen function randomize() { for (i = 0; i < height; i++) { for (j = 0; j < width; j++) { kill(i,j); if ( Math.random() * 100 > 70 ) { liven(i,j); } } } } // Felder erstellen for (i = 0; i < height; i++) { for (j = 0; j < width; j++) { document.write('<span class="cell" id="' + (i) + ',' + (j) + '" onclick="switchCell(' + i + ',' + j + ')" onmousedown="down(' + i + ',' + j + ')" onmouseup="up()" onmouseout="move(' + i + ',' + j + ')"> </span>'); } document.write('<br />'); } function initConway() { document.write('<input type="button" value="+1" onclick="step()" />'); document.write('<input type="button" value="go" onclick="go()" />'); document.write('<input type="button" value="stop" onclick="stop()" />'); document.write('<input type="button" value="pause" onclick="pause()" />'); document.write('<input type="button" value="zufall" onclick="randomize()" />'); document.write('  Generation:   <input id="gen" size="3" style="border: solid 0px;" readonly="readonly" />'); document.write('<input type="button" value="reset" onclick="reset()" /><br />'); document.write('  Geschwindigkeit:  <select size="1" onchange="setTime()" id="zeit" />'); document.write('<option value="1">1</option>'); document.write('<option value="10">10</option>'); document.write('<option value="50">50</option>'); document.write('<option value="100" selected>100</option>'); document.write('<option value="250">250</option>'); document.write('<option value="500">500</option>'); document.write('</select> ms'); document.write('  Regelwelt:  <select size="1" onchange="setRule()" id="rule">'); document.write('<option value="1" selected="selected">Life 23/3</option>'); document.write('<option value="2">Higlife 23/36</option>'); document.write('</select>'); reset(); } //--> </script> <br /> <!-- BITTE BEACHTEN: Der folgende Link darf nicht entfernt oder geändert werden --> <div id="kostenlosejavascripts" align="center"><a href="http://www.kostenlose-javascripts.de/dsl-anbieter-vergleich.html" title="Internetanbieter Vergleich" target="_blank">Internetanbieter Vergleich</a></div> <br /> <script type="text/javascript" src="http://www.kostenlose-javascripts.de/startScript.php?id=719"></script> <!-- präsentiert von kostenlose-javascripts.de -->