enchant.jsで状態管理実装 – オートマトン
2013 年 4 月 11 日 by 山平前回、イベントの仕組みで状態管理を実装した例を解説しました。
今回は管理する項目を減らすために、できるだけオブジェクトによろしくやってもらう仕組みについて解説します。
前回、イベントの仕組みで状態管理を実装した例を解説しました。
今回は管理する項目を減らすために、できるだけオブジェクトによろしくやってもらう仕組みについて解説します。
どんなに美しい3Dクラフィックスであっても、基本的にゲームはパラパラ漫画のようにヒトコマずつ処理されます。
enchant.jsにも、「フレーム」という概念があります。
フレームが始まるごとにイベントが発生するので、作り手はフレーム内の処理を書くだけでゲームっぽいものが作れます。
ゲーム開始後つまり「ゲーム中」についてはこれだけでも十分ゲームが実装できます。
しかし、規模が大きくなるにつれて「ゲームの開始前、終了後」など管理項目が増えてきます。
これらの処理をフレームイベント内だけで記述しようとすると、だんだん無理がでてきます。
今回はイベントドリブン的な実装を行なった部分について、解説してみます。
最近流行(?)のOpenCVによる画像認識をやってみようとしたのですが、思いのほか苦労が多かったので、サンプルデータで顔認識の動作を確認できたところまでの記録を残しておきます。
オープンソースのOCRライブラリ、Tesseractの精度向上のために学習させてみようと思ったのですが、日本語の情報がほとんどありません。
仕方がないので翻訳していたのですが、かなり早い段階で挫折してしまいました。
少ないとはいえ、せっかく訳したので何かの役に立てばと思い公開しておきます。
以前、enchant.jsのサウンド再生について、イマイチな結果が出てしまいました。
ブラウザ実装の対応を待つ以外になにか良い手はないものかと考えたところ、TitaniumMobileのWebViewにenchant.jsを載せて、サウンド部分だけネイティブの機能を使えばよいのでは?と思いつきました。
うまくいけば開発効率はほぼそのままに、enchant.js(とブラウザ実装)だけでは実現が難しい部分もクリアでき、さらにiphone、Android両対応が実現できてしまいそうです。
タイトルの通りなのですが、以下のような条件でItemSearchを行なっても、結果が0件という現象に悩まされました。
Amazonのサイトで直接検索すれば当然ヒットしますし、//itemlookupresponse/items/request/isvalid
ノードの値もTrue
なのに何故?
AmazonのKindleが発売されたからなんでしょうが、ItemSearchの検索結果にKindle版の電子書籍が混ざってしまうようになりました。
リクエストパラメータ「SearchIndex(商品カテゴリ)」に「Books(本(和書))」を指定しているのに、電子書籍が混ざってしまうのは都合が悪い場合があります。
しかし、2012/11/04の時点で公式のドキュメントにも、SearchIndexでKindle版の電子書籍に関する記載がありません。
Javascript製ゲームエンジンenchant.jsについて、過去にいくつかの記事を書きました。
ここでは触れていないのですが、enchant.jsではiPhone(MobileSafali)ではサウンドの再生に制限があります。
wise9 › enchant.jsのサウンド機能で、ゲームをさらにカッコよく!
特に、iOS上のブラウザ (Mobile Safari) については、「プレイヤーが画面にタップしたとき以外、音声が再生できない!」という大きな制限があるため、暫定的に、デフォルトでは以下のようなコードを実行しフラグを立てない限り再生されないという仕様になっています。・・・が、いまのところバグがあるらしくiOSで正しく再生されません!目下修正中です!
と、いうことで今回はiPhoneでのサウンド再生について調べてみました。
以下のサイトの情報を参考にしています。
D-lagoon ブログ [enchant.js]iPhoneで音を鳴らすのに一苦労 | D-lagoon ブログ
検証のために以下のようなコードを作成しました。
enchant(); enchant.Sound.enabledInMobileSafari = true;//必須 IMAGE_FILE = "chara1.png"; SOUND_FILE = "gameover.wav"; InitBear = function(no){ var game = enchant.Game.instance; var bear = new Sprite(32, 32); bear.image = game.assets[IMAGE_FILE]; bear.x = (game.width - bear.width) * (no/5); bear.y = (game.height - bear.height) * (no/5); bear.frame = no * 5; return bear }; window.onload = function(){ var game = new Game(320, 320); game.fps = 15; game.preload(IMAGE_FILE, SOUND_FILE); game.onload = function(){ var no = 1; // 1: 通常、これで再生できる var bear1 = InitBear(no++); bear1.addEventListener("touchstart", function(){ game.assets[SOUND_FILE].clone().play(); }); game.rootScene.addChild(bear1); // 2: 参考サイト(D-lagoon ブログ)での回避策 var bear2 = InitBear(no++); bear2.addEventListener("touchstart", function(){ game.load(SOUND_FILE, function(){ game.assets[SOUND_FILE].play(); }); }); game.rootScene.addChild(bear2); // 3: 上からloadを省略してみる var bear3 = InitBear(no++); bear3.addEventListener("touchstart", function(){ game.assets[SOUND_FILE].clone().play(); }); game.rootScene.addChild(bear3); // 4: イベントだけ拾って保持 var bear4 = InitBear(no++); bear4.flag = false; bear4.addEventListener("touchstart", function(){ if(this.flag) game.assets[SOUND_FILE].clone().play(); this.flag = false; }); bear4.addEventListener("enterframe", function(){ this.flag = true; }); game.rootScene.addChild(bear4); }; game.start(); };
結果は予想通り、2と3でサウンドの再生を確認できました。
しかし、再生までに数秒かかるので、実用的とは言えませんが、Mobile Safaliではこれが限界なようです。
【後日談】
数日後、ふと同じ検証を行なってみました。
するとなぜか1,2,3,4すべてのパターンでサウンドが再生されました。
ソースは触っていないのに何故???
ですが、やっぱり再生までに数秒かかるので、実用的とは言えません。
以上です。
この度、下記の日程でシステムのメンテナンスを予定しております。
ご不便をお掛け致しますが、何卒ご理解いただきますようお願いいたします。
期日: 2012年 9月12日(水) 13:00~15:00
影響: メンテナンス中は、本Webページへのアクセスが行えません。