[tmlib.js] tmlib.js でゲームプログラミング始めませんか？

個人的にずっと作ってるゲームライブラリ [tmlib.js](http://phi-jp.github.io/tmlib.js/) の紹介です!

[tmlib.js Advent Calendar 2014](http://qiita.com/advent-calendar/2014/tmlib) 初日の予定だったのにこのタイミングになってしまいすみませんmm


![hiyokos.png](https://qiita-image-store.s3.amazonaws.com/0/7756/7aa8af56-c678-0146-d101-3064923f95b9.png)

**※『国民全員プログラマ化』計画進行中**

## tmlib.js ってなに？

まずは[トップページ](http://phi-jp.github.io/tmlib.js/)を見てください.
なんとなく分かりますかね？w

てかそもそもなんて読むの？って話ですよね.
『**てぃーえむ りぶ ドット じぇいえす**』と読みます.

ざっくり言うと [tmlib.js](http://phi-jp.github.io/tmlib.js/) は

~~**phiのphiによるphiのためのオレオレライブラリ**~~
**アイディアを即座に形にできるライブラリ**

です!!

## tmlib.js ってどんなことできんの？

- [グラフィックス描いたり](http://goo.gl/yhtYLS)
- [ゲーム作ったり](http://phi-jp.github.io/flatm-touch/)
- [ツール作ったり](http://goo.gl/67ANNM)


## 具体的にはどんなよ？

具体的な機能としては

- [コア機能の拡張](http://goo.gl/okMBfH) (最近 [high.js](https://github.com/phi-jp/high) に分離しました)
- [クラス定義, ネームスペースの管理](http://goo.gl/FLqsbF)
- [乱数生成や Ajax といったユーティリティ機能](http://goo.gl/YQHT4V)
- [幾何学(Vector や Matrix)系のクラス](http://goo.gl/ou0IiK)
- [HTML5 Canvas をラップした便利描画クラス](http://goo.gl/zhA1Ri)
- [DOM をラップした拡張クラス](http://goo.gl/JzEDTk)
- ゲームに必要な基本的な機能一式
    + 解像度を維持して自動で画面にフィット(PC, スマホ同時対応)
    + 更新/描画
    + 親子構造をサポート
    + イベント管理
    + タイムライン, トゥイーンアニメーションのサポート
    + 入力系(キーボード, タッチ, アクセラレーションなど)のサポート
    + アセット(画像や音ファイル)のロード
    + ボタンやダイアログ, ゲージといった便利クラス
    + 衝突判定処理
    + 音再生

などなど

## どうやって使うの？

tmlib.js というファイルを読み込むだけです.
下記の一文を html に貼り付ければ ok!!

```html
<script src="http://cdn.rawgit.com/phi-jp/tmlib.js/0.4.0/build/tmlib.js"></script>
```

直リン心配だって人は [tmlib.js](http://cdn.rawgit.com/phi-jp/tmlib.js/0.4.0/build/tmlib.js) ファイルをダウンロードして使って使ってください.

また, 簡単にではありますが, 実行しながら学べるチュートリアルもあるので
よかったらこちらも覗いてみてください. -> [Link](http://phi-jp.github.io/tmlib.js/tutorial.html)

runstant のテンプレートも用意しました.
こちらから気軽に tmlib.js でゲームプログラミング始められます. -> [Link](http://goo.gl/0dd4Sb)

## サポートってどうなってんの？

tmlib.js は twitter 駆動開発を謳っています.
なので twitter などで気軽に要望や質問など投げてもらえればすぐに反応します.

[@phi_jp](http://twitter.com/phi_jp)(自分)や[@daishi_hmr](http://twitter.com/daishi_hmr)さん, [@omatoro](http://twitter.com/omatoro)さんあたりに直接聞くかハッシュタグ [#tmlib](https://twitter.com/hashtag/tmlib?f=realtime&src=hash) をつけてもらえれば何かしら反応します!!

また, 最近公開された日本語版 StackOverflow に tmlib.js タグがあるので
そちらで質問してもらえるとログを共有できて嬉しかったりします!! -> [Link](https://ja.stackoverflow.com/questions/tagged/tmlib.js)

サンプル付きで返信したり, url を送ってもらえれば一緒にエラーの原因探ったりもします.
phi1618jp@gmail.com あてにソースコード送りつけてもらっても構いません.

ちなみにライセンスは MIT License です.
気軽に使ってください♪

## こだわりとかあんの？

独自の実装になりすぎないよう気をつけています.

私自身, もともとコンシューマ業界で C/C++ でゲームを作ってきて, 様々なライブラリに触れてきました.
OpenGL や DirectX といったコアな部分から, 非公開の3Dエンジン, 社内の独自ライブラリ, Havok や Bullet Physics といった物理エンジン, ActionScript, 最近で cocos2d, cocos2d-x や Unity などなど.

そんな中で, 良いとこ取りといったらなんですが, "使いやすいな", "これは一般的だな" というのを
もりもりに盛り込んだライブラリが [tmlib.js](http://phi-jp.github.io/tmlib.js/) です.

なので, 今まで他の開発環境や他のライブラリでゲームを作った経験のある人であれば
ドキュメントを見なくてもなんとなく tmlib.js でゲームを作れたりします.

また, もちろんゲームライブラリである以上, 速度にも気をつけてインターフェースに影響のない範囲で
ゴリゴリに高速化しています.

他の js ゲームライブラリと比べても遜色のないぐらい速く動きます.

## 実際使われてんの？

結構 Web ゲーム開発などに使われています.
が最近だと WebView で包んでネイティブアプリとしても使われていたりします.

みんなが使ってる某有名アプリも実は... なんてことも♪

いくつかゲームを抜粋して紹介♪

### # [TM-Shooter](http://tmshooter.net/) from @daishi_hmr 

<img src="https://qiita-image-store.s3.amazonaws.com/0/7756/6986bb82-c6e5-3d0d-123e-3f12d4e86cc4.png" width=300 />

[プレイ動画](https://www.youtube.com/watch?v=cTF6ak_gkaE)


冠に TM とついてるだけあって tmlib.js で作られたゴリゴリのシューティングゲームです.
ゲームセンターでプレイするシューティングゲームとなんら遜色のないクォリティです!!

これを web で, しかも一人で作るか!! っと @daishi_hmr さんの変態っぷりが伺えます.


### # [ブロック崩さぬ](http://cachacachacom.appspot.com/BlockKUZUSAZU/index.html) from @utyo 

<img src="https://qiita-image-store.s3.amazonaws.com/0/7756/144c8555-4ed8-dc7e-848f-bcb6ac465aaf.png" width=300 />

[プレイ動画](http://www.nicovideo.jp/watch/sm22712258)


奇才 @utyo さんが作られたゲームです.
[Gigazine](http://gigazine.net/news/20140120-block-kuzusazu/) や [ニコ動](http://www.nicovideo.jp/watch/sm22712258) などでかなり話題になりましたが, 実はこれも tmlib.js 制のゲームです.

ブロック崩しを逆転の発想で崩すと負けにするという素晴らしいアイディアのゲームです.

@utyo さんは, まさに tmlib.js が掲げている『**アイディアを即座に形に**』 を体現してくれている方で
様々な面白いゲームを tmlib.js で作ってくれています.
こちらでプレイできるのでよかったらぜひ♪ -> [かちゃコム](http://cachacacha.com/)

### # [RoguePlus](http://rogueplus.testcoding.net/) from @omatoro

<img src="https://qiita-image-store.s3.amazonaws.com/0/7756/a2b0a7cd-3ec8-c694-4a0b-ebe9f564ba85.jpeg" width=300 />

すごいクォリティのローグ系ゲームです.

ちなみに @omatoro さんは tmlib.js を推進してくれていて,
こういった[エントリー](http://testcording.com/?p=1433)wも書いてくれています.

### # [Web Reverse Reverse](http://webrxr.github.io/RxR/) from @halt_jp  

<img src="https://qiita-image-store.s3.amazonaws.com/0/7756/10d4bffa-d71e-6cf9-f8eb-bff850a4383e.png" width=300 />

[プレイ動画](https://www.youtube.com/watch?v=GAI6rc9fbcY)

開発初期から tmlib.js を使ってくれている @halt_jp さんによるゲームです.

もともとiPhoneアプリだったものを Web に移植するという試みで作ったもので
リバースリバースのルールをベースにしたゲームです.


## まとめ

tmlib.js は, よく他のゲームライブラリと違って個人で作っているライブラリだと言われます.
が, 実は逆だと思っています.

個人で公開しているからこそ, みんな気軽に github や twitter で
意見や要望を交わし合って成長してきたライブラリです!

なので個人というよりみんなで作っているライブラリです!!

**tmlib.js は, プログラミングへのハードルをぶち壊すようなライブラリにしていきたいと思ってます!!**
**みなさん一緒にプログラミングを盛り上げていきましょう!!!**

今回は紹介でしたが, 次回は実際に作っていく入門エントリー書こうと思ってます.
以上, ありがとうございました.