にっき

2006/11/23 23:07:25

ねこぱんち２　おんろ～どいべんと

なんだかりり～す直前に大幅変更してるのはいつものことだからおいといて☆
さんぷる用ねこたんすくりぷとの２回目にちゃれんぢにう☆ヾ（・ｘ・。【みかん

まずは hello World のときとおんなじで必須になる html と config の準備☆

/nekotan/index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
 <head>
  <meta http-equiv="content-type"        content="text/html; charset=UTF-8" />
  <meta http-equiv="content-language"    content="ja" />
  <meta http-equiv="content-style-type"  content="text/css" />
  <meta http-equiv="content-script-type" content="text/javascript" />
  <title>Let's Neko Punch</title>
  <link rel="stylesheet" href="http://localhost/nekotan/style.css" type="text/css" media="screen" />
  <script type="text/javascript" src="http://localhost/mutan/core.js"></script>
 </head>
 <body>
  <img src="./img/neko01.gif" id="nekotan" width="40" height="40" alt="nekotan" title="nekotan" />
 </body>
</html>

今回は外部cssも追加したけどとくにこれといったことしてないからする～で☆
ついでにこの前描いたいらすとを
/nekotan/img/neko01.gif
/nekotan/img/neko02.gif
/nekotan/img/serif.gif
に置いておくのも忘れずに☆

ってことで今度は外部のcssを
/nekotan/style.css

*
{
 margin  : 0;
 padding : 0;
}

body
{
 padding : 1em;
}


/* ねこたんを動かせるようにして，場所はてきとうにせっと */
#nekotan
{
 position : absolute;
 top      : 10em;
 left     : 20em;
}

/* ねこたんこんとろ～らのすたいる */
#nekotanPanel
{
 background  : #e7faff;
 color       : #000077;
 border      : 1px solid #0000aa;
 width       : 12em;
 padding     : 0.5em;
 text-align  : center;
}

#nekotanPanel ul li
{
 list-style : none;
 display    : block;
 background : #ffffff;
 color      : #000077;
 border     : 3px double #777777;
 width      : 10em;
 padding    : 0.25em;
 margin     : 0.25em auto;
 cursor     : pointer;
}

/* ろぐを見やすくするためのすたいる */
#mutanLogBox dt
{
 border-top   : 1px solid #777777;
 border-right : 1px solid #777777;
 border-left  : 1px solid #777777;
 margin-top : 2em;
 padding    : 0.125em 1em;
}

#mutanLogBox dd
{
 border-right  : 1px solid #777777;
 border-bottom : 1px solid #777777;
 border-left   : 1px solid #777777;
 padding       : 0.25em 1em;
}

#mutanLogBox .memo
{
 background : #e7faff;
 color      : #007777;
}

#mutanLogBox .notice
{
 background : #e7faff;
 color      : #000077;
}

#mutanLogBox .warning
{
 background  : #e7faff;
 color       : #777700;
 font-weight : bold;
}

#mutanLogBox .critical
{
 background  : #e7faff;
 color       : #770000;
 font-weight : bold;
}

ろぐはくらすを付け忘れてたのであるふぁ６じゃびみょ～かもにう（つｘ；【みかん
CVSから /mutan/lib/logger.js の最新版をDLして上書きするとちゃんと出るかなぁ？
あるふぁ７もそんなに遠くないうちに出そうだけど・・・　（´ω｀；【みかん

それからむぅたんの動作を制御するconfigふぁいるを
/nekotan/config.js

{
 // むぅたんを /mutan/ 以外にせっとしてあるときは要調整
 this.rootPath        = 'http://localhost/mutan/';

 // ねこたんを /nekotan/ 以外にせっとしてあるときは要調整
 this.actionPath      = 'http://localhost/nekotan/actions/';
 this.configPath      = 'http://localhost/nekotan/configs/';
 this.languagesPath   = 'http://localhost/nekotan/lang/';
 this.modelPath       = 'http://localhost/nekotan/models/';

 // むぅたんせっとあっぷ完了時に起動するあくしょん
 this.onloadAction    = 'onload';

 // 使用する言語('en' にすると英語っぽいのになりますです)
 this.language        = 'jp';

 // あくしょん毎に config ふぁいるを設定を上書きできるようにする
 this.useCustomConfig = true;

 // でばっぐも～どおん
 this.useDebug        = true;

 // このでぃれくとり共通の言語ふぁいるを使用する
 // useCustomLanguage であくしょん毎の言語ふぁいるも可能
 this.useDirLanguage  = true;
};

ふみゅ・・・
こめんといれたら解説するようなことなくなっちゃったにう（´・ω・｀；【みかん

useDirLanguage をおんにしたから言語ふぁいるを☆
/nekotan/lang/en/lang.js

{
 this.nekotanButtonPunch   = 'punch';
 this.nekotanButtonNya     = 'nya';
 this.nekotanButtonUp      = 'up';
 this.nekotanButtonRight   = 'right';
 this.nekotanButtonDown    = 'down';
 this.nekotanButtonLeft    = 'left';
 this.nekotanButtonSpecial = 'special';
};

/nekotan/lang/jp/lang.js

{
 this.nekotanButtonPunch   = 'ねこぱんち';
 this.nekotanButtonNya     = 'にゃ';
 this.nekotanButtonUp      = 'うえ';
 this.nekotanButtonRight   = 'みぎ';
 this.nekotanButtonDown    = 'した';
 this.nekotanButtonLeft    = 'ひだり';
 this.nekotanButtonSpecial = 'すーぱーねこぱんち';
};

日本語っていうか ascii 以外の文字を使うときはUTF-8にしとかないとっぽいので注意☆
ここでせっとした値は
mUtils.language.getLanguage('nekotanButtonPunch');
みたいにすると設定されている言語に合わせた値を取得することができますです☆

これで基本的な設定は完了したから今度は onload あくしょんにちゃれんぢ☆

まずは config ふぁいるでこんとろ～らを出力するのに必要なれんだ～さんをせっと
/nekotan/configs/onloadConfig.js

{
 this.renderFile = 'domRender.js';
};

ほんとは easyTemplateRender さんのほうがてんぷれ使えて楽なんだけど・・・
今回は onclick いべんともせっとしたいからこっちで☆

続いてもでるさんを・・・
/nekotan/models/onloadModel.js

{
};

って特に入力はいらないから空っぽで☆　ｄ（´ω｀；【みかん

らすとにめいんとなるあくしょんさん
まずは
/mutan/lib/abstract/abstractAction.js
をこぴぺ☆
それから今回は使わない
_model
executeViewIndex 以外のexecuteView
をかっとして必要なものをぺったんすると・・・

/nekotan/actions/onloadAction.js

{
 // 今回は view を切り替えたりしないからいらないかも？
 this._defaultView = 'executeViewIndex';
 // view でぱねるを生成しちゃえばこれもいらない？
 // でも view であんまりごちゃごちゃするのはにゃぁ・・・　（´ω｀；【みかん
 this._panel = {};

 // もでるさんはいらないから今回は中身も空っぽに
 this.init = function(model)
 {
 };

 // 今回のめいんになる処理
 this.execute = function(request)
 {
  // まずはこんぱねのべ～すになるものを生成
  var panel = DomUtils.createObject('nekotanPanel','div',{},{});
  var list  = DomUtils.createObject('actionList','ul',{},{});
  panel.appendChild(list);

  // ぼたんは起動させるあくしょん＆表示名以外共通だからる～ぷで生成
  // この形式だと追加修正が簡単かも？
  var arr = ['Punch','Nya','Up','Right','Down','Left','Special'];
  for(var i in arr)
  {
   var act = arr[i];

   // ぼたんの生成
   var but = DomUtils.createObject('nekotan' + act,'li',
            {'innerHTML' : mUtils.language.getLanguage('nekotanButton' + act)},{});

   // ぼたんにぺったんするいべんとを生成
   var fnc = new Function('mController.doAction("' + act.toLowerCase() + '");');

   // ぼたんにいべんとをぺったん☆
   DomUtils.appendEvent(but,'click',fnc,'normal');

   // こんぱねにぼたんをぺったん☆
   list.appendChild(but);
  }

  // 完成したものをとりあえず保存
  this._panel = panel;

  // view の名前を返しておしまい
  return this._defaultView;
 };

 // ちゃんと設定できてれば domRender さんが渡されるはず
 this.executeViewIndex = function(render)
 {
  // まずは出力したい場所にあるおぶじぇくとをせっと
  render.setRenderTarget(document.body);

  // 次に出力したいおぶじぇくとをせっとしておしまい
  // って順番はどっちでもよかったりするけど・・・
  render.setRenderValue(this._panel);
 };
};

って今回もこめんといれたらそこでみっしょんこんぷり～と☆
・・・にう？（´ω｀；【みかん

とりあえず一通り描けたらhttpdを起動して
http://localhost/nekotan/
にれっつあくせす☆ヾ（・ｘ・。【みかん

こんなかんじの画面が表示されて，とくにえら～も出なかったらおっけぃ☆

ついでにぼたんを押してみて

こんなかんじでえら～が出たらちゃんといべんとの付加もできてるはずなのです☆
ここまでできたら次回はねこぱんちの実装にちゃれんぢ
ってことにして今日はおしまいなのです☆ヾ（・ｘ・。【みかん

今日の分のそ～すをまとめたものはnekotan2ndDayに置いときますです☆

受信でむぱ(0)| こめんと(0)| 閲覧数(2430)
前のにっき| 次のにっき

こめんと

投稿された内容の著作権はこめんとの投稿者に帰属するっぽいです☆
また，現在 IE6 以下で Sleipnir，Lunascape，Donut じゃないゆ～ざえ～じぇんとからの描き込みを制限してますです☆
該当しちゃうかたはてきとうにゆ～ざえ～じぇんとを偽装しちゃってくださいです（´ω｀；【みかん

2024年 11月
日	月	火	水	木	金	土
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30

にっき

ねこぱんち２　おんろ～どいべんと

こめんと

こめんとする？

あわせて読みたい

2024年 11月
日	月	火	水	木	金	土
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30

2024年 11月
日	月	火	水	木	金	土
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30

にっき

ねこぱんち２ おんろ～どいべんと

こめんと

こめんとする？

あわせて読みたい

ねこぱんち２　おんろ～どいべんと

2024年 11月
日	月	火	水	木	金	土
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30