[Java+SpringBoot+JPA] 가위 바위 보 게임

2024. 1. 7. 18:41Java/Practice

반응형

 

🟣 카테고리 생성

   fragments > GBB.html

<li class="nav-item">
 <a class="nav-link" href="/gbbin">GBB</a>
</li>

 

 

 

🟣 layout 생성

   game> gbbin.html

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorate="~{layouts/layout}">

<body>
<!-- content영역 시작-->
<div layout:fragment="content">
  <div class="row">
    <div class="col-sm-3"></div>
    <div class="col-sm-6">

      <div class="container mt-3">
        <h3>가위 바위 보 게임</h3>
        <p>가위, 바위, 보 게임을 시작해보세요.</p>

        <button type="button" class="btn btn-primary mb-3" data-bs-toggle="modal" data-bs-target="#myModal">
          게임시작
        </button>
      </div>

      <!-- The Modal -->
      <form th:action="@{/gbbout}" method="post">
      <div class="modal" id="myModal">
        <div class="modal-dialog">
          <div class="modal-content">

            <!-- Modal Header -->
            <div class="modal-header">
              <h4 class="modal-title">가위 바위 보</h4>
              <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>

            <!-- Modal body -->
            <div class="modal-body">
              <div class="form-check">
                <input type="radio" class="form-check-input" id="radio1" name="userSelect" value="1" checked> 가위
                <label class="form-check-label" for="radio1"></label>
              </div>

              <div class="form-check">
                <input type="radio" class="form-check-input" id="radio2" name="userSelect" value="2"> 바위
                <label class="form-check-label" for="radio2"></label>
              </div>

              <div class="form-check">
                <input type="radio" class="form-check-input" id="radio3" name="userSelect" value="3"> 보
                <label class="form-check-label" for="radio3"></label>
              </div>
            </div>

            <!-- Modal footer -->
            <div class="modal-footer">
              <button type="submit" class="btn btn-danger" data-bs-dismiss="modal">결과확인</button>
            </div>

          </div>
        </div>
      </div>
      </form>

    </div>
    <div class="col-sm-3"></div>
  </div>
</div>
<!-- content영역 끝-->
</body>

</html>

 

   game> gbbout.html

  ▪️ 숫자(정수)를 한글로 출력하는 방법

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorate="~{layouts/layout}">

<body>
<!-- content영역 시작-->
<div layout:fragment="content">
  <div class="row">
    <div class="col-sm-3"></div>
    <div class="col-sm-6">

      <p class="mt-5">
        컴퓨터 : [[${computer == 1 ? '가위' : (computer == 2 ? '바위' : '보')}]] <br>
        사용자 : [[${userSelect == 1 ? '가위' : (userSelect == 2 ? '바위' : '보')}]] <br>
        결과 : [[${result}]]
      </p>

      <button type="button" class="btn btn-primary mt-3 mb-5" th:onclick="|location.href='@{/gbbin}'|">다시 게임</button>

    </div>
    <div class="col-sm-3"></div>
  </div>
</div>
<!-- content영역 끝-->
</body>

</html>

 

 

 

🟣 Controller 생성

   ▪️ 매개변수 : Integer userSelect

   ▪️ 컴퓨터 랜던값 : Random random = new Random( );

   ▪️ 이중 if문 활용

 

@Controller
@RequiredArgsConstructor
public class GameController {

  @GetMapping("/gbbin")
  public String gbbinForm() throws Exception {
    return "game/gbbin";
  }
  
  @PostMapping("/gbbout")
  public String gbboutProc(Integer userSelect, Model model) throws Exception {

    Random random = new Random();

    int computer = random.nextInt(3)+1;
    String result = "";

    if(computer == 1) {
      if (userSelect == 1) {
        result = "비겼습니다.";
      } else if (userSelect == 2) {
        result ="당신이 이겼습니다.";
      } else {
        result = "컴퓨터가 이겼습니다.";
      }
    } else if (computer == 2) {
      if(userSelect == 1) {
        result = "컴퓨터가 이겼습니다.";
      } else if(userSelect == 2) {
        result = "비겼습니다.";
      } else {
        result = "당신이 이겼습니다.";
      }
    } else if (computer ==3) {
      if(userSelect == 1) {
        result = "컴퓨터가 이겼습니다.";
      } else if (userSelect == 2) {
        result = "당신이 이겼습니다.";
      } else {
        result = "비겼습니다.";
      }
    }

    model.addAttribute("computer", computer);
    model.addAttribute("userSelect", userSelect);
    model.addAttribute("result", result);

    return "/game/gbbout";

  }

}

 

  ▪️ 축약해서 작성하는 방법

    if (computer == userSelect) {
        result = "비겼습니다.";
    } else if ((computer == 1 && userSelect == 2) || (computer == 2 && userSelect == 3) || (computer == 3 && userSelect == 1)) {
        result = "당신이 이겼습니다.";
    } else {
        result = "컴퓨터가 이겼습니다.";
    }
반응형