グルチャ

Map Editorにenchant.js v0.6.3を適用すると正常動作しない問題の解決法

enchant.js用マップエディタenchantMapEditorをjQuery UIに置き換えてみた
http://blog.chat.ac/?p=157
上記の作業中に発生した問題の解決法を備忘録として記す。

enchant.js公式のマップエディタ
https://github.com/wise9/enchantMapEditor
ですが、
これに使われているenchant.js はv0.3と非常に古いバージョンが使われている。
古いバージョンが使われていること自体は問題ないが、
プログラミングの勉強がてらjQuery UIを使ってUIを作り直していたら、
htmlのinputフォームが正常動作しない(inputをクリックしてもアクティブにならない)問題が発生。
原因は良く分からないが、enchant.js v0.6.3を使ったら問題解決した。
しかし、enchant.js v0.6.3を使うと、今度はMap Editorでチップが配置できない(enchant-stageをクリックしてもチップが置かれない)問題が発生。
この問題解決にコードをいじったので、修正箇所を記す。

mapeditor.jsの処理をのぞくと以下の処理を行っていた。
mapeditor.js 116行目

		var editScene = new Scene();
		this.sx = 0;
		this.sy = 0;
		editScene.addEventListener('touchstart', function(e) {

mapeditor.js 163行目

		editScene.addEventListener('touchmove', function(e) {

mapeditor.js 206行目

		game.pushScene(editScene);

このeditSceneはタッチイベントのためだけに作られたシーンのようだ。
これが問題のようで、enchant.js v0.6.3では内部処理が変わったのか、editSceneにはチップがロードされていないのに、editSceneに対してチップを描画しようとして、描画できなくなっていた。
それならば、実際チップを持っているgame.rootSceneにイベントをハンドルすることで解決。
具体的には以下のコードに修正する。
mapeditor.js 116行目

		//var editScene = new Scene();
		this.sx = 0;
		this.sy = 0;
		game.rootScene.addEventListener('touchstart', function(e) {

mapeditor.js 163行目

		game.rootScene.addEventListener('touchmove', function(e) {

mapeditor.js 206行目

		//game.pushScene(editScene);

Leave a reply

Your email address will not be published.

Time limit is exhausted. Please reload CAPTCHA.

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>