ブログランキング・にほんブログ村へ


iPhone/iPad用潜水艦ゲームアプリ ソナーエコー iTunesにて公開中

2013年07月01日

[html5]スマホだけでカスタマイズ設置できるゲームを作ってみた

スマホだけでカスタマイズ&設置できるゲームってのを作ってみた。


(スマホ専用、PCでは動かない)

ゲーム作るのはこっち。

上のゲームのリンクからでもいける。
くどいようだけど、PCではできない。


今さらながらのhtml5(+jQuery mobile)。

前からちょこちょこやってたけど、ゲームとして複雑すぎるとスマホで操作するのが煩わしくていやになってしまう。

そんで結局もぐらたたき。面白いかどうかはまぁさておき、一応できたってことで。

そしてプラットフォーム。

iPhoneとAndroid共用ってことになるともうhtml5しかないんだけど、これがもう全然互換性がめちゃくちゃで、jQuery mobile使ってさえも挙動を揃えるのが大変。

音声とか。iOSは音声ファイルをユーザー操作(タッチ)をキーにしてしか読めないってどういうしばりやねん。あとiOSは音声同時に1つしか扱えない。だからもちろんSE頑張って入れてもBGMとか絶対無理。
iTunes connectにアプリ登録して審査を受けた後、クソゲー送ってくんな的Rejectかまされるときの定型文に「あなたはもしかしたらhtml5でリリースしたいと思うかもしれません」って一文があるけど、無理。絶対無理。

それから処理速度。このもぐらたたき程度でもiPhone4レベルくらいのシングルコア系ではアップアップでなんとか動いてるレベル。レイヤ構成とかもっともっと単純にしないとだめだけど。そうまでしてhtml5で書く理由がないとしかいえない。プラットフォームって結局iOSとAndroidしかないわけだし。Unityとかもあるし。

開発環境。とにかくこれがもうほんと辛い。基本テキストエディタとサーバPHPの組み合わせになるんでほんのちょっとしたスペルミスとかでも気づかないと修正が結構な工数になる。html,css,javascript,php,いろんな言語を同時に扱い、置き場所もまちまちなので、これらの対応をしっかり押さえながら作業を進めるのが非常に苦痛。


html5だけでちょろっと素材画像を描いたりもできるようにしたかったんでそのあたりにこだわってみた。



こんな感じのペイントツールもどきで素材を描く。

たたいていいもの(もぐらとか)
たたいちゃいけないもの(女の子とか)

を指で描いて、ゲームの名前を付けたらそれだけで完成。
テキトーな絵なら全部で1分、少し頑張って描いても10分ってとこ。
ただ、作るもの遊ぶのもスマホ専用。





一応あとから編集もできる。

やっぱりお金にはならないけど、趣味でやるにはiOSとxcodeが一番気分がいいと思った。

一時期html5が全てを呑み込むっていう感じになったことがあったけど、それはなさそう。これは収束しない。最近html5がとんと話題にならないのはそれが認知されたってことだったのか。
これはフラッシュの代わりにはなれない。処理速度のことよりも、プラットフォーム依存のまちまちな実装がいけない。
そもそもスマホに限って言えばPCのようにブラウザの立場はそれほど高くない。そうするとアプリで充分っていうかそのほうが速いし。
iOSのようにブックマークをアプリのようにホーム画面に置けるとまるっきりアプリとかわんない。それならむしろきっちり作れてパフォーマンスもちゃんと出るアプリのほうがいいってことになってしまう。

というわけでまたiOSに戻ることにした。
posted by みこあいさ at 16:41| JavaScript

2013年06月20日

[jquery] jqueryの$.ajaxで complete等の後処理関数に値を渡したい

jqueryのajaxはとっても便利なんだけど、completeなどの後処理関数に値を渡す方法をずっと調べてなかったんで調査・実装。

どういう時かっていうと、ajaxの通信のひな形は同じだけど、パラメータのささいな違いで後処理が全然違うとかそういうパターン。
phpとかとやりとりするときなんかは割と多いケースの気がする。

// ajax通信
my_ajax: function( dataObj,completeFunc ){
$.mobile.showPageLoadingMsg();

$.ajax({
__completeFunc: completeFunc,

type: "POST",
url: "http://www.xxxxxx.com/xxxxx.php",
data: dataObj,
dataType: "json",
complete: function( data, status ){
var json = JSON.parse( data.responseText );

switch( json.status ){
case "ok":
this.__completeFunc( json );

break;
default:
//なんかエラー処理
break;
}
$.mobile.hidePageLoadingMsg();
},
error: function(XMLHttpRequest,textStatus,errorThrown ){
$.mobile.hidePageLoadingMsg();
//なんかエラー処理
}
});
}

こんなふうにぶつからないように自前パラメータを追加する。
この例では
__completeFunc
という成功時の処理関数を渡している。.phpの戻り値のjsonの"status"の項目が"ok"のときのみ処理する関数。

キモは、completeの中からみると、$.ajaxに渡したパラメータをもったオブジェクトはthisになってるってこと。
はじめdata のほうかと思った。javascriptのスコープ的に当然のことなのかもしれない。そこまでjavascript突っ込みたくないんでここは経験則的理解でいいや。

で呼び出し側は

this.my_ajax(
{
"mode": "getinfo",
"id": this.id,
"pw": this.pw,
},
function( json ){
//通信成功時の処理をここにかく
}
);

何回か呼び出してとこがあったりするとだいぶすっきりする。

通信IFの仕様変更とかあっても対応しやすくなる。
posted by みこあいさ at 11:08| JavaScript

[javascript chrome]Chromeのデベロッパーツールで、jqueryがことあるごとに止まる

chromeのデベロッパーツールで調子よくjqeury(mobile)つかjavascript書いてたら、突然ことあるごとにポーズが掛かるようになってうざい、っていう現象。
ほんとにポーズで、デバッガのResume(右黒三角アイコン)を押すと問題なく進む。



赤丸んとこみると Paused on 'DOMException'

と表示されてる。

これ、なんかの拍子に赤矢印んとこを押してしまったのが原因らしい。この赤矢印のポーズアイコンみたいのがグレー以外になってら注意。
スクショのように青いときホバーすると Pause on all exceptions. とか出る。まさにこれ。
もう1回押すと赤黒くなって、Pause on uncaught exceptions.でどうやらキャッチしてない例外のみ停止、
もう1度でグレーになって Don't pause on exceptions.(例外で停止しない)となる。

赤かグレーがいいのではないかと。javaとかc++と違って例外取りこぼしても落ちたりはしないんでリリース状態に近いといえばグレーで充分じゃないかと。
posted by みこあいさ at 10:03| JavaScript