Merge pull request #27 from 2d-rpg/feature/yoshikawa

progressの実装

frontend/src/scripts/stage/field_selection.js

@@ -22,6 +22,7 @@ export default function FieldSelection(props) {
         const field_selection = (data) => {
             setShowField(true);
             if(!data.player.isMaster){ // 語り部以外のプレイヤーの場合
+                props.setMessage('あなたは子です(ﾟ∀ﾟ)親が出したと思うカードを選択してください(=^▽^)σ');
                 setFieldButtons(
                     data.game.field.cards.map((card, index) => {
                         var id = 'field' + index;
@@ -33,6 +34,7 @@ export default function FieldSelection(props) {
                     })
                 );
             }else{ // 語り部の場合
+                props.setMessage('あなたは親です(ﾟ∀ﾟ)子の選択を待ちましょう( ´Д`)y━･~~');
                 setFieldButtons(
                     data.game.field.cards.map((card) => {
                         var hand_src = "../images/" + card.filename;
@@ -44,6 +46,7 @@ export default function FieldSelection(props) {
         };
         /** 語り部以外のプレイヤーがフィールド上のカードを選んだときの動作 */
         const others_field_select = (socket,data,index) => {
+            props.setMessage('あなたは子です(ﾟ∀ﾟ)他の子の選択を待ちましょう( ´Д`)y━･~~');
             setShowField(false);
             setSrc("../images/" + data.game.field.cards[index].filename);
             setShowSelected(true);
@@ -64,7 +67,7 @@ export default function FieldSelection(props) {
         <div id='field-wrapper'>
             <div id="field" style={ {display: showfield ? 'inline' : 'none'} }>{ field_buttons }</div>
             <div className="form-inline" id="selected_field_card" style={{display: showselected ? 'inline' : 'none'}}>
-                あなたが選んだカード:
+                あなたがフィールドから選んだカード:
                 <img id="selected_field_card" width={ WIDTH } height={ HEIGHT } src={ src } alt="フィールドから選んだカード"/>
             </div> 
         </div>

frontend/src/scripts/stage/hand_selection.js

@@ -32,6 +32,7 @@ export default function HandSelection(props) {
             setStory('');
             setSelectedCard(false);
             if(data.player.isMaster){ //語り部の場合
+                props.setMessage('あなたは親です(ﾟ∀ﾟ)カードを選択してください(=^▽^)σ');
                 setHandButtons(
                     data.player.hand._array.map((card, index) => {
                         var id = 'hand' + index;
@@ -43,14 +44,14 @@ export default function HandSelection(props) {
                     })
                 );
             }else{ // 語り部以外のプレイヤーの場合
+                props.setMessage('あなたは子です(ﾟ∀ﾟ)待機中( ´Д`)y━･~~');
                 setHandButtons(
                     data.player.hand._array.map((card) => {
                         var hand_src = "../images/" + card.filename;
                         return (<img width={ WIDTH } height={ HEIGHT } src={ hand_src } alt={ card.filename }></img>);
                     })
                 );
             }
-            props.setMessage('aaa');
         };
         /** 語り部が手札からカードを選択したときの動作 */
         const master_select = (data, index) => {
@@ -59,6 +60,7 @@ export default function HandSelection(props) {
         };
         /** 語り部が手札から選んだカードの表示と手札の非表示及びお題フォームの表示 */
         const story_selection = (data, index) => {
+            props.setMessage('あなたは親です(ﾟ∀ﾟ)カードのお題を入力してください⊂((・x・))⊃');
             setSrc("../images/" + data.player.hand._array[index].filename);
             setSelectedCard(true);
             //setShowHand(false);
@@ -67,9 +69,10 @@ export default function HandSelection(props) {
         /** 語り部以外のプレイヤーの手札の表示 */
         const others_hand_selection = (data) => {
             if(data.player.isMaster){
+                props.setMessage('あなたは親です(ﾟ∀ﾟ)待機中( ´Д`)y━･~~');
                 props.socket.emit('wait');
             }else{
-                console.log("others_hand_selectionにきたよ");
+                props.setMessage('あなたは子です(ﾟ∀ﾟ)お題に沿ったカードを選択してください(=^▽^)σ');
                 console.log(data.player.hand);
                 setShowHand(true);
                 setStory("お題:" + data.game.masterClaim);
@@ -87,6 +90,7 @@ export default function HandSelection(props) {
         };
         /**語り部以外のプレイヤーが手札からカードを選んだときの動作 */
         const others_select = (socket, data, index) => {
+            props.setMessage('あなたは子です(ﾟ∀ﾟ)他の子の選択を待ちましょう( ´Д`)y━･~~');
             setShowHand(false);
             setSrc("../images/" + data.player.hand._array[index].filename);
             setSelectedCard(true);
@@ -119,7 +123,7 @@ export default function HandSelection(props) {
             <div id="hand" style={ {display: showhand ? 'inline' : 'none'} }>{ hand_buttons }</div>
             <div id="story">{ story }</div>
             <form className="form-inline" id="selected_hand_card_form" style={{display: selectedcard ? 'inline' : 'none'}}>
-                あなたがフィールドから選んだカード:
+                あなたが手札から選んだカード:
                 <img id="selected_hand_card" width={ WIDTH } height={ HEIGHT } src={ src } alt="あなたが選んだカード"/> 
             </form> 
 

frontend/src/scripts/stage/result.js

@@ -11,6 +11,7 @@ export default function Result(props) {
     useEffect(() => {
         /** result画面の表示 */
         const show_result = (data) => {
+            props.setMessage('結果発表ですわぁ(⌒,_ゝ⌒)');
             let result_str = "";
             data.game.players.forEach(player => {
                 result_str += player.name + ": " + player.score + "点 ";

frontend/src/scripts/stage/start.js

@@ -12,6 +12,7 @@ export default function Start(props) {
     useEffect(() => {
         /** プレイヤーが揃ったので，スタートボタンを表示 */
         const start = (player) => {
+            props.setMessage('準備が出来たらスタートボタンを押しましょうᕦ(ò_óˇ)ᕤ');
             setShow(true);
             setName(player.name);
             setShowName(true);