@extends('layouts.contentLayoutMaster')
{{-- page title --}}
@section('title','遊戲開始')
{{-- vendor styles --}}
@section('vendor-styles')

@endsection

{{-- page styles --}}
@section('page-styles')
<style>
.radio label:before{
	display: none;
}
.radio input[type=radio]:checked~label:after{
	display: none;
}
label {
    text-align: center;
    padding: 5px 50px;
    border: 1px solid;
	border-radius: 5px;
}
input:checked + label{
	background-color: #5a8dee;
	color: #fff;
	border-radius: 5px;
}
</style>
@endsection

@section('content')
<section id="multiple-column-form">
  <div class="row match-height">
    <div class="col-12">
      <div class="card">
        <div class="card-header">
          <h4 class="card-title">遊戲開始</h4>
        </div>
        <div class="card-content">
          <div class="card-body">
            <form class="form" method="POST" action="{{route('gameTianjiu.play')}}">
            @csrf
            
            @if($gameInfo===NULL)
			<div class="row">
			  <div class="col-md-12 col-12">
				 
              </div>
              <input type="hidden" name="nextStatus" value="new"  />
                    <button type="submit" class="btn btn-primary mr-1 mb-1">開局</button>
                    
                    </div>
			</div>
            @else 
                        
            
            
            <input type="hidden" name="gameId" value="{{$gameInfo->gameId}}"  />
              <div class="form-body">
                <div class="row">
				  <div class="col-md-6 col-12">
					<div class="form-group {{ $errors->has('session') ? 'error' : '' }}">
					  <div class="mb-2">
						<span>場次</span>
						<span style="font-weight:bold;">
                        {{ $gameInfo->date }}#{{$gameInfo->seq }}
                       </span>
					  </div>
                      <div class="mb-2">
						<span>開局時間</span>
						<div class="badge badge-pill badge-light-primary mr-1">{{ $gameInfo->created_at }}</div>
					  </div>
                      <div class="mb-2">
						<span>Game ID：</span>
						<span>
                        {{ $gameInfo->gameId }}
                       </span>
					  </div>
                      <div class="mb-2">
						<span>狀態：</span>
						<div class="badge badge-pill badge-light-success mr-1"><h4><b>{{ $gameInfo->statusName }}</b></h4></div>
					  </div>
                      
                      
					</div>
				  </div>
				  <div class="col-md-6 col-12">
				  </div>
                  
                  @if($gameInfo->status=="begin")
                    
                    <div class="col-12 d-flex justify-content-end">
                    <input type="hidden" name="nextStatus" value="getBanker"  />
                    <button type="submit" class="btn btn-primary mr-1 mb-1">搶莊</button>
                    <button type="submit" class="btn btn-light-secondary mr-1 mb-1" onClick="giveup()">放棄遊戲</button>
                    </div>
                   
                  @endif
                  
                  @if($gameInfo->status=="getBanker")
                    
                    <div class="col-12 d-flex justify-content-end">
                    <input type="hidden" name="nextStatus" value="startBet"  />
                    <button type="submit" class="btn btn-primary mr-1 mb-1">開始下注</button>
                    <button type="submit" class="btn btn-light-secondary mr-1 mb-1" onClick="giveup()">放棄遊戲</button>
                    </div>
                   
                  @endif
                  
                  @if($gameInfo->status=="startBet")
                    
                    <div class="col-12 d-flex justify-content-end">
                    <input type="hidden" name="nextStatus" value="stopBet"  />
                    <button type="submit" class="btn btn-primary mr-1 mb-1">停止下注</button>
                    <button type="submit" class="btn btn-light-secondary mr-1 mb-1" onClick="giveup()">放棄遊戲</button>
                    </div>
                   
                  @endif
                  
                  @if($gameInfo->status=="stopBet")
                    
                    <div class="col-12 d-flex justify-content-end">
                    <input type="hidden" name="nextStatus" value="play"  />
                    <button type="submit" class="btn btn-primary mr-1 mb-1">開始遊戲</button>
                    <button type="submit" class="btn btn-light-secondary mr-1 mb-1" onClick="giveup()">放棄遊戲</button>
                    </div>
                   
                  @endif
                  
                  @if($gameInfo->status=="play")
                  <input type="hidden" name="nextStatus" value="end"  />
				  <div class="col-md-4 col-12">
					<div class="form-group">
					  <span>角色A</span>
						<ul class="list-unstyled mb-0">
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="a_radio" id="radio2" value="win">
								<label for="radio2">贏</label>
							  </div>
							</fieldset>
						  </li>
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="a_radio" id="radio3" value="draw">
								<label for="radio3">和</label>
							  </div>
							</fieldset>
						  </li>
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="a_radio" id="radio1" value="lose" checked>
								<label for="radio1">輸</label>
							  </div>
							</fieldset>
						  </li>
						</ul>
					  
					</div>
				  </div>
				  <div class="col-md-4 col-12">
					<div class="form-group">
					  <span>角色B</span>
						<ul class="list-unstyled mb-0">
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="b_radio" id="radio5" value="win">
								<label for="radio5">贏</label>
							  </div>
							</fieldset>
						  </li>
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="b_radio" id="radio6" value="draw">
								<label for="radio6">和</label>
							  </div>
							</fieldset>
						  </li>
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="b_radio" id="radio4" value="lose" checked>
								<label for="radio4">輸</label>
							  </div>
							</fieldset>
						  </li>
						</ul>
					  
					</div>
				  </div>
				  <div class="col-md-4 col-12">
					<div class="form-group">
					  <span>角色C</span>
						<ul class="list-unstyled mb-0">
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="c_radio" id="radio8" value="win">
								<label for="radio8">贏</label>
							  </div>
							</fieldset>
						  </li>
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="c_radio" id="radio9" value="draw">
								<label for="radio9">和</label>
							  </div>
							</fieldset>
						  </li>
						  <li class="d-inline-block mr-2 mb-1">
							<fieldset>
							  <div class="radio">
								<input type="radio" name="c_radio" id="radio7" value="lose" checked>
								<label for="radio7">輸</label>
							  </div>
							</fieldset>
						  </li>
						</ul>
					  
					</div>
				  </div>
				  
                  <div class="col-12 d-flex justify-content-end">
                    <button type="submit" class="btn btn-primary mr-1 mb-1">遊戲結算</button>
                    <button type="reset" class="btn btn-light-secondary mr-1 mb-1">重置</button>
                  </div>
                  @endif
                </div>
              </div>
            </form>
            @endif
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
@endsection

{{-- vendor scripts --}}
@section('vendor-scripts')
@endsection

{{-- page scripts --}}
@section('page-scripts')
<script>
$("button").on("click", function(){
	switch($(this).attr("class")) {
	  case "btn btn-primary mr-1 mb-1":
		var status = "begin";
		gameBTN(status);
		break;
	  case "btn btn-secondary mr-1 mb-1":
		var status = "getBanker";
		gameBTN(status);
		break;
	  case "btn btn-success mr-1 mb-1":
		var status = "startBet";
		gameBTN(status);
		break;
	  case "btn btn-info mr-1 mb-1":
		var status = "stopBet";
		gameBTN(status);
		break;
	  case "btn btn-warning mr-1 mb-1":
		var status = "start";
		gameBTN(status);
		break;
	  case "btn btn-danger mr-1 mb-1":
		var status = "end";
		gameBTN(status);
		break;
	  default:
		// code block
	}
});
function gameBTN(status){
		$.ajax({
		  method: "GET",
		  url:"{{ route('ajax.tjgStatus')}}",
		  dataType:"json",
		  data:{
			  status:status
		  }
		})
		.done(function( msg ) {
			console.log(msg)
		});
}

//放棄遊戲
function giveup(){
    $("input[name=nextStatus]").val("end");
}
</script> 
@endsection