任意サイズテトリスを JS / HTML Canvas に移植した

f:id:susisu:20160726213606p:plain

こちらから遊べます → dotris

Flash で作ったもの (なんと最初のバージョンは 5 年も前らしい) を JS / HTML Canvas に移植しました. 最新の FirefoxChrome ならとりあえず動くと思います.

2016年7月31日追記: たぶん flag 変更しなくても大丈夫になりました. Chrome で動作が重い場合は chrome://flags から #disable-accelerated-2d-canvas を無効にしてみてください (自己責任で). Firefox でも何かした方が良かったかもしれませんが忘れました.

不具合や改善すべき点などがありましたらお気軽に @susisu2413 をつっついてください. ただ異なる環境への対応なんかは (古いブラウザでも新しいブラウザでも) 基本的にしないと思います.

ソースコードなど諸々は GitHub に置いてあります. github.com

特徴

既知の問題点

Safari で描画とかがバグる

あまりちゃんと確認していませんが, Safari の drawImage() がバグっていて, 自分自身に描画するときに事前にソース領域をコピーしていないせいだと思われます.

HTML Canvas 2D Context

Chromeで境界付近が欠けたりする

Chrome (Blink), Retina Mac, High resolution mode でステージの大きさを最大にすると境界付近が 1 サブピクセル欠けたり外側が表示されることがあります. よくわかりませんが Chrome の描画が微妙にずれるようです. おそらくフルスクリーンでは問題ないようなので, 気になる場合はフルスクリーンをお試しください.