2018 ソフトウェア設計及び演習用の班Wiki - gr10::モジュールごとの制作、仕様書の作成

gr10::モジュールごとの制作、仕様書の作成

archive mode

!!!盤面・得点・ターン表示モジュール(岡野, [[福士　遼|gr10::福士遼]]）の仕様書

*HTMLで読み込んだ白、黒、緑色のマスを表示させる。

*置けるマスを見やすいように色を変えて表示。

*画面遷移はノードの要素を消して新たな要素を貼り付けることで行う。

<<{Screenshot from 2018-08-02 16-38-53.png}

!!HTMLファイル

*スタート画面とゲーム終了画面をそれぞれ画像で表示する
**ゲーム終了画面は白の勝ち画面、黒の勝ち画面、引き分けの3パターンで表示

*得点表示とプレイヤーターンの文字を表示

*音楽を再生する。

*ゲーム画面（オセロの盤面）を何もないマス、黒のマス、白のマス、置けるマスのそれぞれを並べて表示する（並べ方はjsファイルで操作) 
**それぞれのマスのidを定義（何もないマス:cell, 黒のマス:black, 白のマス:white, 置けるマス:placeable） 
**盤面のidを"board", スタート画面を"startgamen"と定義する

*スタート画面→ゲーム画面→終了画面の流れのため、ゲーム画面と終了画面はjavascriptで必要なときに表示されるように　style="display:none"　とし隠しておく

*othllo.cssでそれぞれの画面の大きさや位置を決定するようにする

*classを定義しcssでそのclassを設定する
**square    :何もないマス、白のマス、黒のマス、置けるマス
**cell      :何もないマス
**block     :黒のコマ,白のコマ
**placeable :置けるマス
**sande     :スタート画面、終了画面
**massage   :得点表示
**playerturn:ターン表示

!!CSSファイル
*HTMLファイルで定義されたclassを作成し、それぞれのclass内で画像の大きさ配置、色を設定
**square:縦と横の大きさと色を設定
**cell,block,placeable:画像配置の位置と大きさ、色を設定
**sande :縦と横の大きさを設定
**massage,playerturn:文字の配置を設定

!!javascriptファイル
--variable--
*変数を宣言する。

<<{Screenshot from 2018-08-02 17-12-21.png}

--onload--
*関数start()を呼びだす。

--showbord--

①ターン表示、得点表示モジュールを呼び出し、表示。

② bordのdivタグのノードを取得し"b"に格納 
　"b"の最初の子ノードが０以外である間、"b"の最初の子ノードを削除

③boardの各配列について変数cellを宣言、マスの状態によって色を変える。（stoneを参照)

④cellを盤面のどの位置に表示するかを確定後に中身をbに張りつける形で表示。

⑤PLEACEABLEの時はそのcellを.onclickに登録(cell.onclickについては下の※を参照)。

⑥PLEACEABLE以外の時は、フォーループを抜け、パスのチェック。

⑦パスなら、endcheckを+1し、再びshowBoardを呼び出す。

⑧endcheck==2なら盤面を非表示にしてend()を呼び出し、ゲーム終了。リザルト画面へ。

※cell.onclickについて(showboardを再帰的に呼び出す複雑な動きをします。)

*.onclickはコールバック関数なので特定のcellがクリックされた時呼び出される。この場合はPLACEABLEなcellが呼び出される。
*クリックされたら、そのマスの状態によりトラップの処理か通常のひっくり返しか判断し実行。
*プレイヤーターンの入れ替えを行う。黒ターン：１、白ターン：２で分けそれぞれの値を"player"に格納しplayerの情報を取得。プレイヤーは "player = 3 - player"　で移行 。
*PLEACEABLEのマスをリセット(そのまま残ってしまうと、次ターンのプレイヤーがPLEACEABLEでない場合もPLEACEABLEで表示されてしまうから。)
*showBoardを呼び出す。

--countpiece--
*盤面上の黒コマと白コマの数を数える
*それぞれのコマの数を盤面とともに表示

--displayturn--
*どちらのターンかをターンを要素ptに表示

--board_init--
*引数なし
*使用する変数  stone, board

*それぞれのマスの画像データを得る
**コマ無しの画像データ"cell"
**黒コマの画像データ"black"
**白コマの画像データ"white"
*8✕8のマスそれぞれのメモリ宣言
**二次元配列(board[x][y])で作成
*コマの初期配置を設定

!!!裏返しモジュール（結城）
*石を置けるかどうかの判定、置いた場合の裏返し動作をするものはほぼ完成。

*石を置けるかどうかの判定
  　check.can(newboard, x, y, player)
*裏返しの実行
    check.turn(newboard, x, y, player)
8<
  引数　　newboard　現在の盤面
       　 x　　　 石をおいたx座標
      　  y　　　 石をおいたy座標
      　  plyer  石をおいたプレイヤー（１ or ２）

check.canの返り値　　1 　ここには石が置ける
  　　　　　　　　　   0　 ここには石が置けない

check.turnの返り値 　newboard  ひっくり返したあとの盤面（あとは表示するだけ）
>8

!!!スタートモジュール、エンドモジュール(千葉)

--start--
*スタート画面が生成される。
*スタート画面をボタンとして動くように変更。
*スタート画面がクリックされたならスタート画面の要素を削除して盤面の初期化
*トラップセット画面へ

--end--
*ターン表示と特典表示を非表示にする。
*画面の表示（スコアによって画像変更）

var ed;

if(scorewhite > scoreblack){

ed = document.getElementById("whitewin");

}//if

else if(scorewhite < scoreblack){

ed=document.getElementById("blackwin");

}//else if

else if(scorewhite == scoreblack){

ed=document.getElementById("draw");

}//else if

*エンド画面をボタンとして動くように変更
*エンド画面がクリックされたらエンド画面の要素を削除
*スタートを呼び起こす

!!!BGMモジュール(千葉)

*タイトル画面と同時にBGMが再生される
*BGMはひとつの曲をループする

!!!トラップモジュール（大嶋、玉川）
--set_trap--
*指定した座標にトラップを設置する
*配置するトラップの種類はランダム
*罠を置いた時にtrapnumに１〜３のうちのどれかが入り、トラップ１〜３に対応している
*黒番と白番でそれぞれ罠を設置するために２種類用意・どちらが罠を設置する番かを文章で明記

---trap--
罠の内容（３種類）
*トラップ１（スキップ）,２（無力化） , 3 (置いた周りのコマがすべて相手の色)

罠発動時の効果音

htmlファイル

</audio>

jsファイル

document.getElementById( 'sound-file' ).play(); //音楽ファイル再生

!!!通信モジュール＋シーン切り替えモジュール（田代）

*通信が必要なこと
・プレイヤーの入室、退室

・盤面の状況

・コマの数

・ターン状況

・罠の状態

・勝敗判定

・ゲーム進行状態

*通信の流れ

<<{dsc250,300.jpg}

*サーバー側(main.js)

//通信確立
io.sockets.on('connection', function(socket){

//ゲーム起動
  
io.sockets.emit('startm',{value:st});

//スタート画面からトラップへ
    
 socket.on("battle",function(){
     
 io.sockets.emit("gobattle",{value:bt});

});
 
 //トラップから対戦へ
    
   socket.on("battle2",function(){
   
     io.sockets.emit("gobattle2",{value:bt});
  
  });

//データが送られてきたら全員にデータを送り返す
  
socket.on('board',function(board){
    
 io.sockets.emit('newboard',board);

});
 
 socket.on('player',function(player){
  
   io.sockets.emit('newplayer',player);

});
 
 //対戦からエンドへ
      
 socket.on("end",function(){
     
   io.sockets.emit("goend",{value:bt});

});

各モジュールからそれぞれ信号を受け取りそれに対応したデータ、信号を送り返しシーンを切り替える。

*クライアント側

start→set_trap→showBoard→end→startの順にそれぞれのモジュールにサーバーに通信を行い

データや通信が送り返されてきたら次のモジュールへシーンを変える。

Tag:

Attachment

New: append-tag

(download: 32563 bytes, at 2018/08/03 11:22:03 )
(download: 65910 bytes, at 2018/08/02 17:26:30 )
(download: 37404 bytes, at 2018/08/02 17:20:53 )
(download: 1 bytes, at 2018/06/29 13:08:00 <frozen> )
(download: 582 bytes, at 2018/06/29 13:22:20 <frozen> )
(download: 588 bytes, at 2018/06/29 13:22:34 <frozen> )
(download: 592 bytes, at 2018/06/29 13:22:53 <frozen> )
(download: 592 bytes, at 2018/06/29 13:23:37 <frozen> )
(download: 746 bytes, at 2018/07/06 13:09:10 <frozen> )
(download: 866 bytes, at 2018/07/06 13:19:47 <frozen> )
(download: 887 bytes, at 2018/07/06 13:50:29 <frozen> )
(download: 1195 bytes, at 2018/07/06 14:00:59 <frozen> )
(download: 1476 bytes, at 2018/07/06 14:08:10 <frozen> )
(download: 1614 bytes, at 2018/07/06 14:13:53 <frozen> )
(download: 1614 bytes, at 2018/07/06 14:15:11 <frozen> )
(download: 1814 bytes, at 2018/07/06 14:22:20 <frozen> )
(download: 1862 bytes, at 2018/07/06 14:25:34 <frozen> )
(download: 1864 bytes, at 2018/07/06 14:26:36 <frozen> )
(download: 1993 bytes, at 2018/07/06 14:37:19 <frozen> )
(download: 2058 bytes, at 2018/07/06 14:42:42 <frozen> )
(download: 1993 bytes, at 2018/07/06 14:42:53 <frozen> )
(download: 2068 bytes, at 2018/07/06 14:44:31 <frozen> )
(download: 1995 bytes, at 2018/07/06 14:44:43 <frozen> )
(download: 2069 bytes, at 2018/07/06 14:45:41 <frozen> )
(download: 1993 bytes, at 2018/07/06 14:45:50 <frozen> )
(download: 2587 bytes, at 2018/07/06 14:54:55 <frozen> )
(download: 2611 bytes, at 2018/07/06 16:32:35 <frozen> )
(download: 2602 bytes, at 2018/07/06 16:38:22 <frozen> )
(download: 2721 bytes, at 2018/07/06 16:41:14 <frozen> )
(download: 2773 bytes, at 2018/07/06 16:49:23 <frozen> )
(download: 3165 bytes, at 2018/07/06 16:54:17 <frozen> )
(download: 3205 bytes, at 2018/07/06 16:57:06 <frozen> )
(download: 3207 bytes, at 2018/07/06 17:00:07 <frozen> )
(download: 3258 bytes, at 2018/07/13 14:11:16 <frozen> )
(download: 3282 bytes, at 2018/07/13 15:23:40 <frozen> )
(download: 3368 bytes, at 2018/07/13 15:28:56 <frozen> )
(download: 3479 bytes, at 2018/07/13 15:32:00 <frozen> )
(download: 3513 bytes, at 2018/07/13 15:34:21 <frozen> )
(download: 4280 bytes, at 2018/07/13 15:59:21 <frozen> )
(download: 4289 bytes, at 2018/07/13 16:00:38 <frozen> )
(download: 4294 bytes, at 2018/07/20 15:32:26 <frozen> )
(download: 4356 bytes, at 2018/07/20 15:38:38 <frozen> )
(download: 4489 bytes, at 2018/07/28 17:39:24 <frozen> )
(download: 4494 bytes, at 2018/07/28 17:40:10 <frozen> )
(download: 4643 bytes, at 2018/07/28 17:43:16 <frozen> )
(download: 4690 bytes, at 2018/07/28 17:45:05 <frozen> )
(download: 4691 bytes, at 2018/07/28 17:45:18 <frozen> )
(download: 4697 bytes, at 2018/08/01 12:02:58 <frozen> )
(download: 4718 bytes, at 2018/08/01 12:04:35 <frozen> )
(download: 4719 bytes, at 2018/08/02 15:32:06 <frozen> )
(download: 5103 bytes, at 2018/08/02 15:49:26 <frozen> )
(download: 5119 bytes, at 2018/08/02 15:51:26 <frozen> )
(download: 5845 bytes, at 2018/08/02 15:53:13 <frozen> )
(download: 5846 bytes, at 2018/08/02 15:53:38 <frozen> )
(download: 5848 bytes, at 2018/08/02 15:54:05 <frozen> )
(download: 5846 bytes, at 2018/08/02 15:54:28 <frozen> )
(download: 6263 bytes, at 2018/08/02 16:03:03 <frozen> )
(download: 6258 bytes, at 2018/08/02 16:04:03 <frozen> )
(download: 6267 bytes, at 2018/08/02 16:04:58 <frozen> )
(download: 6267 bytes, at 2018/08/02 16:05:30 <frozen> )
(download: 6266 bytes, at 2018/08/02 16:06:11 <frozen> )
(download: 6264 bytes, at 2018/08/02 16:06:33 <frozen> )
(download: 6457 bytes, at 2018/08/02 16:12:21 <frozen> )
(download: 6433 bytes, at 2018/08/02 16:12:40 <frozen> )
(download: 6429 bytes, at 2018/08/02 16:12:57 <frozen> )
(download: 6441 bytes, at 2018/08/02 16:13:30 <frozen> )
(download: 6544 bytes, at 2018/08/02 16:18:22 <frozen> )
(download: 6754 bytes, at 2018/08/02 16:24:37 <frozen> )
(download: 6925 bytes, at 2018/08/02 16:45:27 <frozen> )
(download: 6924 bytes, at 2018/08/02 16:46:51 <frozen> )
(download: 7142 bytes, at 2018/08/02 16:53:27 <frozen> )
(download: 7142 bytes, at 2018/08/02 16:54:06 <frozen> )
(download: 7127 bytes, at 2018/08/02 16:54:41 <frozen> )
(download: 6909 bytes, at 2018/08/02 16:56:06 <frozen> )
(download: 7189 bytes, at 2018/08/02 16:57:42 <frozen> )
(download: 7195 bytes, at 2018/08/02 16:58:29 <frozen> )
(download: 7536 bytes, at 2018/08/02 17:09:11 <frozen> )
(download: 7777 bytes, at 2018/08/02 17:13:30 <frozen> )
(download: 7724 bytes, at 2018/08/02 17:14:45 <frozen> )
(download: 7960 bytes, at 2018/08/02 17:19:32 <frozen> )
(download: 7962 bytes, at 2018/08/02 17:21:40 <frozen> )
(download: 8011 bytes, at 2018/08/02 17:27:14 <frozen> )
(download: 8049 bytes, at 2018/08/02 17:29:35 <frozen> )
(download: 7981 bytes, at 2018/08/02 17:30:26 <frozen> )
(download: 8006 bytes, at 2018/08/02 17:31:27 <frozen> )
(download: 8034 bytes, at 2018/08/02 17:33:59 <frozen> )
(download: 7654 bytes, at 2018/08/02 17:41:39 <frozen> )
(download: 7647 bytes, at 2018/08/03 11:22:32 <frozen> )
(download: 7712 bytes, at 2018/08/03 11:24:24 <frozen> )
(download: 7584 bytes, at 2018/08/03 11:37:43 <frozen> )
(download: 7613 bytes, at 2018/08/03 11:39:05 <frozen> )
(download: 7628 bytes, at 2018/08/03 11:40:37 <frozen> )
(download: 7622 bytes, at 2018/08/03 11:41:51 <frozen> )
(download: 8499 bytes, at 2018/08/03 11:58:11 <frozen> )
(download: 8631 bytes, at 2018/08/03 13:00:36 <frozen> )
(download: 8642 bytes, at 2018/08/03 13:17:23 <frozen> )
(download: 8669 bytes, at 2018/08/03 14:35:43 <frozen> )
(download: 8735 bytes, at 2018/08/03 15:35:14 <frozen> )
(download: 8737 bytes, at 2018/08/03 15:35:25 <frozen> )
(download: 8838 bytes, at 2018/08/03 15:44:50 <frozen> )
(download: 8790 bytes, at 2022/02/09 11:52:23 <frozen> )
(download: 8799 bytes, at 2022/02/09 11:53:53 <frozen> )
(download: 8789 bytes, at 2022/02/09 11:54:11 <frozen> )

Syntax Help

URL Link

[text|http://example.com//] http://example.com/to{text}

Page Link

[[PageName]] [[text|PageName]] >>{PageName} >>{PageName}{text}

Image or Attachment

<<{filename} <<{filename}{text}

Text Decoration

'' Italic '' ''' Bold ''' '''' Large-font '''' `` Typewriter `` `?` Preformatted `?` __ Underline __ == Strike == == DEL =={ INS } ((br)) line feed

Special Letter

((amp)) & ((bq)) ` ((lt)) < ((gt)) > ((lp)) ( ((rp)) ) ((lb)) [ ((rb)) ] ((ll)) (( ((rr)) ))

Headline

!!!! site-name !!! section-name !! subsection-name ! subsubsectino-name << section-name >> <<< subsection-name >>> <<<< subsubsection-name >>>> >> Centering and Large-font <<

Itemize

* item1 ** item1-1 ** item1-2

Enumerate

+ item1 + item2 ++ item2-1

Table

|| 1-1 | 1-2 | 1-3 || 2-1 | 2-2 | 2-3

Description

:item ::description

Quotation

6< quotation >9

Preformatted text

8< preformatted-text >8

Edit