なんだかんだで2周年。
RebRankの弾幕STG、五月雨を購入。
敵弾を吸収すると自機弾がやたら強くなる攻性なバリアを使いつつ避ける弾幕STG。自分には難易度が高すぎたかも・・・。
昨日のアレについて背景事情解説。
端的に言うと手段のためなら目的を選ばないという話。
JavaScriptのベクターグラフィックライブラリ(SVG,VML)のraphael.jsの存在を知ったのが発端。
このライブラリの特徴として文字列描画系が結構弄れると言う点。
この特徴を活かして何か作りたいなウフフとか考えてたらアレができた。マジキチと言われる筋合いはない。
アレに関して引き続き諸注意。クロスブラウザ、と言いたいところだがIEだと文字列に対するマウスイベントがうまく取得出来ていないためIEでは遊べません。眺めるだけです。それにしてもGoogleChromeってSVGもサクサク動くんだね。
Numberオブジェクトのプロトタイプを弄ってRubyでいう3.times.do〜みたいな表記を実装してみた。getterを使っている都合上、IEでは動かない。
(function(){ function undef(val){ return typeof val === "undefined"; } Number.prototype.__defineGetter__("times",function(){ var c = 0+this; var _stock = function(initialStock,addFunc){ var i = 0; var res = initialStock; while(i<c){ res = addFunc(res,i,c); i++; } return res; } return{ exec:function(f){ return _stock([],function(res,i){ res.push(f(i)); return res; }); }, str:function(repeatStr,separator){ separator = undef(separator) ? "" : separator; return this.arr(repeatStr).join(separator); }, arr:function(el){ return _stock([],function(res){ res.push(el); return res; }); } } }); Number.prototype.to = function(num,step){ var from = 0+this; var to = num; var step = (from<to ? 1 : -1) * (undef(step) ? 1 : step); var _stock = function(initialStock,addFunc){ var res = initialStock; var contp = step>0 ? function(j,m){ return j<=m; } : function(j,m){ return j>=m; }; for(var i=from;contp(i,to);i+=step){ res = addFunc(res,i,to,step); } return res; } return { exec:function(f){ return _stock([],function(res,i){ res.push(f(i)); return res; }); }, str:function(separator){ separator = undef(separator) ? "" : separator; return this.arr().join(separator); }, arr:function(){ return _stock([],function(res,i){ res.push(i); return res; }); } } } })();
使い方。というかサンプル。
num.timesはnum回繰り返す操作をする。
var i = 10; //num.times.exec(func(i)) //関数funcをnum回実行する。funcの引数として現在の関数の実行回-1を渡す //戻り値は各回のfuncの戻り値の配列 i.times.exec(function(i){ alert(i); return i; }); //0,1,2,3,4,5,6,7,8,9の順にアラートを表示し、[0,1,2,3,4,5,6,7,8,9]を戻り値として返す。 //num.times.str(str,separator) //文字列strをnum回繰り返した文字列を返す。区切り文字separatorを指定できる。 i.times.str("abc",","); //"abc,abc,abc,abc,abc,abc,abc,abc,abc,abc"を返す //num.times.arr(element) //num個のelementを要素として持つ配列を返す i.times.arr("abc"); //["abc","abc","abc","abc","abc","abc","abc","abc","abc","abc"]を返す
num.to(toNum,step).*はnumからtoNumまでstepずつ(デフォルトでは1)変化する添字による操作を行う。
var i = 10; //num.to(toNum,step).exec(func(i)) return Array i.to(20).exec(function(i){ alert(i); return i; }); //10,11,12,13,14,15,16,17,18,19,20の順にアラートを表示し、[10,11,12,13,14,15,16,17,18,19,20]を戻り値として返す。 //num.to(toNum,step).str(separator) return String i.to(20,2).str(","); //"10,12,14,16,18,20"を返す //num.to(toNum,step).arr() return Array i.to(30,3).arr(); //[10,13,16,19,22,25,28]を返す
エイプリルフールということでサイトを弄ろう、てなわけでDOSチックなスタイルシートを昨日部会から帰ってからもりもり書いておりました。で、ご覧の通り。
とりあえずIE8,Firefox3.5.8,GoogleChrome5.0.360.4dev,Opera10.50,Safari4.04(いずれもWin7(64bit))で動作確認済み。
明日になったら戻します。