ライフゲームとか。
昨日、ライフゲーム*1を作る流れが86辺りであったので、時代に乗り遅れつつ書いてみた。
みんなRubyとかで書いてて見た目つまんないのでJavaScriptで。
んで、出来たのはこんな感じ。
http://negator.s56.xrea.com/junk/lifegame.html
アルゴリズムとかどっか間違ってるかもしれん。あんまちゃんと確認してないので。
作成時間は…どんくらいだ?多分3,4時間くらいです。
ライフゲームのアルゴリズムより言語周りでやたら時間食った。
たまには普段使わない言語も触っておかないと駄目ですね。
ソースは以下。へたれなので長いよ。
<?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <title>Lifegame</title> <style type="text/css"> <!-- td {height: 16px; width: 16px;} td.dead {background-color: red;} td.live {background-color: green;} --> </style> </head> <form> h:<input type="text" id="height" value="24" /> w:<input type="text" id="width" value="24" /> <a href="javascript: start();">start</a> <a href="javascript: clearInterval(intervalId);">stop</a> </form> <table> <tbody></tbody> </table> <body> <script type="text/javascript" language="JavaScript"> <!-- var Lifegame = function() { this.h = 0; this.w = 0; this.cell = []; } Lifegame.prototype = { init : function(h,w) { this.h = h; this.w = w; this.cell = new Array(h); for(var i = 0; i < h; ++i) { this.cell[i] = new Array(w); for(var j = 0; j < w; ++j) { this.cell[i][j] = (Math.random()*6 < 1) ? 1 : 0; } } }, getEnv : function(h,w) { var c = 0; for(var i = -1; i <= 1; ++i) { var y = h+i; if(y < 0) { y = this.h-1; } if(y >= this.h) { y = 0; } for(var j = -1; j <= 1; ++j) { if (i==0&&j==0) { continue; } var x = w+j; if(x < 0) { x = this.w-1; } if(x >= this.w) { x = 0; } c += this.cell[y][x]; } } return c; }, next : function() { newCell = new Array(this.h); for(var i = 0; i < this.h; ++i) { newCell[i] = new Array(this.w); } for(var i = 0; i < this.h; ++i) { for(var j = 0; j < this.w; ++j) { var env = this.getEnv(i,j); if(this.cell[i][j]==0 && env==3) { newCell[i][j] = 1; } else if(this.cell[i][j]==1 && (env==2 || env==3)) { newCell[i][j] = 1; } else { newCell[i][j] = 0; } } } this.cell = newCell; } } var lifegame = new Lifegame(); var Board = function() { this.h = 0; this.w = 0; } Board.prototype = { init : function() { this.h = parseInt(document.getElementById("height").value); this.w = parseInt(document.getElementById("width").value); //table var table = document.createElement("table"); var tbody = document.createElement("tbody"); for(var i = 0; i < this.h; ++i) { var row = document.createElement("tr"); for(var j = 0; j < this.w; ++j) { var col = document.createElement("td"); col.setAttribute("class", "dead"); row.appendChild(col); } tbody.appendChild(row); } table.appendChild(tbody); var oldTable = document.getElementsByTagName("table")[0]; document.getElementsByTagName("body")[0].replaceChild(table, oldTable); lifegame.init(this.h, this.w); }, draw : function() { var table = document.getElementsByTagName("td"); for(var i = 0; i < this.h; ++i) { for(var j = 0; j < this.w; ++j) { table[i*this.w+j].setAttribute("class",(lifegame.cell[i][j]!=0) ? "live" : "dead"); } } } } var board = new Board(); var intervalId = 0; function start() { if(intervalId != 0) { clearInterval(intervalId); } board.init(); board.draw(); intervalId = setInterval(function() { lifegame.next(); board.draw(); }, 2000); } //--> </script> </body> </html>
追記:
setAttribute("class",~)などとしているのでIEでは動かない罠を発見した。
IE爆発しろ。
*1:ルールはこの辺参照:ライフゲーム - Wikipedia