Javascript記述方法(最新Canvas版)

Java版での記述方法とほぼ同じですが、Java版とJavascript版ではメソッド、一部記述方法に多少の差などがあるので注意が必要です。
基本的なJSSの使い方等はRyo氏のMasaoJSS使用方法まとめをご覧ください。
等ページではCanvas版で拡張するにあたりまず何を書けばいいかわからないという方向けに雛形的なものを公開する程度であることをご理解いただきたい。


<script>タグ内に拡張機能を埋め込む場合

Canvas版からの記述方法で使用します。
まず下記は<script>タグでのparamデータです。

<script type="text/javascript">
new CanvasMasao.Game({
	"map0-0" : "............................................................",
	"map0-1" : "............................................................",
	パラメータ群.....
	});
</script>

Javascript拡張にはいくつかの書き方がありますが、ここではクロージャを使用した書き方でご紹介します。
上記に下記の青部分を追加してみましょう。

<script type="text/javascript">
new CanvasMasao.Game({
	"map0-0" : "............................................................",
	"map0-1" : "............................................................",
	パラメータ群.....
	},null,{userJSCallback: (function(){

//  グローバル変数
var Applet1 = 0;	//  JavaApplet
var init_f = false;	//  JavaApplet 起動時の初期化をしたかどうかのフラグ

return function(Offscreen_g, mode, view_x, view_y, ap){
  //   JavaApplet 起動時の初期化
  if(init_f == false) {
  init_f = true;
  //  JavaApplet 起動時の初期化
  userInitJS(ap);
  }
    if(mode == 1) {
    // タイトル
    //  JavaScript タイトル画面表示中を呼び出す
      userTitleJS(Offscreen_g);
    }
  else if(mode >= 100  &&  mode < 200) {
    //  ゲーム中
    if(Applet1.getJSMes() >= 1) {
      //  ゲーム開始
      //  JavaApplet からのメッセージをクリアー
      Applet1.setJSMes(0);
      //  JavaScript ゲーム開始
      userGameStartJS();
    }
  else {
    //  JavaScript ゲーム中
    userGameJS(Offscreen_g,view_x,view_y);
    }
  }else if(mode == 200) {
    //  JavaScript ゲームオーバー
    userGameoverJS(Offscreen_g);
  }else if(mode == 300) {
    //  JavaScript エンディング
    userEndingJS(Offscreen_g);
  }

 }

//  JavaApplet 起動時に JavaScript から1回だけ呼び出される
function userInitJS(ap) {
	//  JavaApplet を取得
	Applet1 = ap;
}

//  タイトル画面表示中に JavaScript から呼び出される
function userTitleJS(Offscreen_g) {

}

//  ゲーム開始時に JavaScript から1回だけ呼び出される
function userGameStartJS() {

}

//  ゲーム中    描画直前に JavaScript から呼び出される
function userGameJS(Offscreen_g,view_x,view_y) {

}

//  ゲームオーバー    描画直前に JavaScript から呼び出される
function userGameoverJS(Offscreen_g) {

}

//  エンディング    描画直前に JavaScript から呼び出される
function userEndingJS(Offscreen_g) {

}

}
)()
});
</script>

青部分が、Java版当時のサンプルのように見やすくした形になります。
用途に合わせてご使用ください。


<applet>タグからreplaceの場合

Java版のappletタグからreplaceを使用した正男の場合
まず下記は<applet>タグの部分です。

<applet code="MasaoJSS.class" width="512" height="320" archive="mc_c.jar" id="applet1_id" mayscript>

id="applet1_id"がない場合はタグ内にいれてください。(ここではapplet1_idとして説明します。)
次に<head>〜</head>内での記述です。わかりやすいようCanvasMasao.jsを呼び出してからその下に書くことをおすすめします。

<script type="text/javascript" src="../Outputs/CanvasMasao.js"></script>
<script type="text/javascript">
JSMasao.replace("applet1_id", { userJSCallback: userJS });

//  グローバル変数
var Applet1 = 0;	//  JavaApplet
var init_f = false;	//  JavaApplet 起動時の初期化をしたかどうかのフラグ

//  JavaApplet から全てのモードで  描画直前に呼び出される
function userJS(Offscreen_g,mode,view_x,view_y,ap) {

  //   JavaApplet 起動時の初期化
  if(init_f == false) {
  init_f = true;
  //  JavaApplet 起動時の初期化
  userInitJS(ap);
  }
    if(mode == 1) {
    // タイトル
    //  JavaScript タイトル画面表示中を呼び出す
      userTitleJS(Offscreen_g);
    }
  else if(mode >= 100  &&  mode < 200) {
    //  ゲーム中
    if(Applet1.getJSMes() >= 1) {
      //  ゲーム開始
      //  JavaApplet からのメッセージをクリアー
      Applet1.setJSMes(0);
      //  JavaScript ゲーム開始
      userGameStartJS();
    }
  else {
    //  JavaScript ゲーム中
    userGameJS(Offscreen_g,view_x,view_y);
    }
  }else if(mode == 200) {
    //  JavaScript ゲームオーバー
    userGameoverJS(Offscreen_g);
  }else if(mode == 300) {
    //  JavaScript エンディング
    userEndingJS(Offscreen_g);
  }

 }

//  JavaApplet 起動時に JavaScript から1回だけ呼び出される
function userInitJS(ap) {
	//  JavaApplet を取得
	Applet1 = ap;
}

//  タイトル画面表示中に JavaScript から呼び出される
function userTitleJS(Offscreen_g) {

}

//  ゲーム開始時に JavaScript から1回だけ呼び出される
function userGameStartJS() {

}

//  ゲーム中    描画直前に JavaScript から呼び出される
function userGameJS(Offscreen_g,view_x,view_y) {

}

//  ゲームオーバー    描画直前に JavaScript から呼び出される
function userGameoverJS(Offscreen_g) {

}

//  エンディング    描画直前に JavaScript から呼び出される
function userEndingJS(Offscreen_g) {

}
</script>

こちらもほぼ同じとなっております。
Java版まではアプレットの取得に

Applet1 = document.getElementById("applet1_id");
を使用していましたが、Canvas版ではできないようです。
代わりにuserJSにAppletにあたるオブジェクトを渡す第5引数(ap)で各メソッドを呼び出せるようです。詳しくは本家様のまとめをご覧ください
上記の部分も↓のようにすっきり。
Applet1 = ap;

メソッドの違い

Java版とCanvas版,相応に対応するメソッドで細かな違いがあったのでメモしておきます。
微妙な違いのため、移植等ではご注意ください。

CanvasJavaメソッド内容
getHighscore()getHighScore()ハイスコアを取得するメソッドです。
setMapchip()setMapChip()パターン画像から指定した標準レイヤーの座標にマップチップを配置する。
getMapchip()getMapChip()指定した標準レイヤーの座標にあるもののコードを取得する。
setMapchip2()setMapChip2()レイヤー画像から指定した背景レイヤーの座標にマップチップを配置する。
getMapchip2()getMapChip2()指定した背景レイヤーの座標にあるもののコードを取得する。

間違いやご指摘等ありましたらTex(現「赤いシールド」)までご連絡ください。
スーパー正男MY+トップに戻る