@extends('admin.layouts.default')
@section('content')
<script type="text/javascript">
$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip();
});
</script>
<!--********************************* Content body start  **********************************-->
<div class="container-fluid">
    <div class="row page-titles mx-0" data-aos="fade-up">
        <div class="col-sm-6 p-md-0">
            <!-- <div class="welcome-text">
                <h4>Edit Player</h4>
                <span class="ml-1">Layout</span>
            </div> -->
        </div>

        <div class="col-sm-6 p-md-0 justify-content-sm-end mt-2 mt-sm-0 d-flex">
            <ol class="breadcrumb">
                <li class="breadcrumb-item active"><a href="{{route($modelName.'.view')}}">All Bonus</a></li>
                <li class="breadcrumb-item">Edit</li>
            </ol>
        </div>
    </div>
    <!-- row -->
    <div class="row">
        <div class="col-xl-12 col-xxl-12">
            <div class="card" data-aos="fade-up">
                <div class="card-header">
                    <h4 class="card-title">Edit Bonus Detail</h4>
                </div>
                <div class="card-body">
                    <div class="basic-form">
                        {{ Form::open(['role' => 'form','id'=>'playerEditForm','route'=>[$modelName.'.update',($player->id)], 'files' => true]) }}
                        <!-- <form action="{{ url('update-bonus/'.$player->id) }}" id="playerEditForm"  method="POST"> -->
                            <div class="form-row">

                                <div class="form-group col-md-6">
                                    <label class="lbl_frm py-2">Bonus Name</label>
                                    <input class="form-control in_text" autocomplete="off" placeholder="enter player name here" id="player_name" name="type" type="text" value="{{$player->type}}">
                                </div>

                                <div class="form-group col-md-6">
                                    <label class="lbl_frm py-2">Bonus Price</label>
                                    <input class="form-control in_text" autocomplete="off" placeholder="enter player name here" id="playe r_name" name="price" type="number" value="{{$player->price}}">
                                </div>

                            </div>
                             <div class="form-row">
                               <div class="form-group col-md-6">
                                   <label class="lbl_frm py-2">Bonus Type</label>
                                   <!-- <input class="form-control in_text" autocomplete="off" placeholder="enter player name here" id="playe r_name" name="bonus_type" type="text" value="{{$player->bonus_type}}"> -->
                                   <select class="form-control in_text sport_types" name="bonus_type">
                                       <option value="">Select Type</option>
                                         <option value="Amount" > Amount </option>
                                         <option value="Percentage" >Percentage</option>
                                   </select>
                               </div>

                                <div class="form-group col-md-6">
                                    <label class="lbl_frm py-2">Status</label>
                                    <select class="form-control in_text roles" name="status">
                                        <option value="">Select Status</option>
                                         <option value="0" >Inactive</option>
                                        <option value="1" >Active</option>



                                    </select>
                                </div>

                            </div>
                            <div class="form-row">
                              <div class="form-group col-md-6">
                                <!-- <div class="form-check mb-2"> -->
                                    <!-- <input type="checkbox" class="form-check-input" id="first_deposit" name="first_deposit" value="1" > -->
                                    <label class="lbl_frm py-2">First Deposite</label>
                                    <input type="checkbox" class="form-check-input" name="first_deposit" id="myCheck" onclick="checkBoxcheck()" value="1" />
                                  <input type="hidden" id="text" name="first_deposit" value="">
                                <!-- </div> -->
                              </div>
                              <div class="form-group col-md-6">
                                  <label class="lbl_frm py-2">First Deposit Condition</label>
                                  <input class="form-control in_text" autocomplete="off" placeholder="enter first deposit condition price here" id="player_name" name="first_deposit_condition" type="text" value="{{$player->first_deposit_condition}}">
                                  <div class="error-message help-inline">
                                    {{$errors->first('first_deposit_condition')}}
                                  </div>
                              </div>
                            </div>
                            <div class="form-row" >

                          <div class="form-group col-md-6" id="maxlimit" style="display:none">
                              <label class="lbl_frm py-2">Max Deposit Limit</label>
                                <input class="form-control in_text" autocomplete="off" placeholder="Enter Max Deposit Limit" name="max_deposit_limit" type="number" value="{{ $player->max_deposit_limit }}">

                          </div>


                        </div>




                            <div class="py-2">
                            <button type="submit" class="btn btn-primary mr-2">Submit</button>
                            <button class="btn btn-gray" type="button" id="cancel_btn">Cancel</button></div>
                          <!-- </form> -->
                        {{ Form::close() }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>




<div class="modal fade bd-example-modal-lg imagecrop" data-backdrop="static" data-keyboard="false"

 id="model" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
          <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">New message</h5>
                <!-- <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                </button> -->
            </div>
            <div class="modal-body">
                <div class="img-container">
                    <div class="row">
                        <div class="col-md-11">
                            <img id="image" src="https://avatars0.githubusercontent.com/u/3456749">
                        </div>
                    </div>
                </div>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-secondary"  id="crop1"  data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary crop" id="crop">Crop</button>
              </div>
          </div>
        </div>
      </div>


      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.6/cropper.css"/>
      <!-- <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
      <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> -->
      <script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.6/cropper.js"></script>
      <script>
          var $modal = $('.imagecrop');
          var image = document.getElementById('image');
          var cropper;
          $("body").on("change", ".imageUpload", function(e){
              var files = e.target.files;
              var done = function(url) {
                  image.src = url;
                  $modal.modal('show');
              };
              var reader;
              var file;
              var url;
              if (files && files.length > 0) {
                  file = files[0];
                  if (URL) {
                      done(URL.createObjectURL(file));
                  } else if (FileReader) {
                      reader = new FileReader();
                      reader.onload = function(e) {
                          done(reader.result);
                      };
                      reader.readAsDataURL(file);
                  }
              }
          });
          $modal.on('shown.bs.modal', function() {
              cropper = new Cropper(image, {
                  aspectRatio: 0,
                  viewMode: 0,
              });
          }).on('hidden.bs.modal', function() {
              cropper.destroy();
              cropper = null;
          });
          $("body").on("click", "#crop,#crop1", function() {
              canvas = cropper.getCroppedCanvas({
                  width: 160,
                  height: 160,
              });
              canvas.toBlob(function(blob) {
                  url = URL.createObjectURL(blob);
                  var reader = new FileReader();
                  reader.readAsDataURL(blob);
                  reader.onloadend = function() {
                       var base64data = reader.result;
                       $('#base64image').val(base64data);
                       // document.getElementById('imagePreview').style.backgroundImage = "url("+base64data+")";
                       $modal.modal('hide');
                  }
              });
          })

      </script>



<script type="text/javascript">
    $(document).ready(function(){
        $("#dob").datetimepicker({
            timepicker: false,
            format:'Y-m-d'
        });
        $(document).on("click","#cancel_btn", function(){
            let href = $(".breadcrumb-item.active a").attr("href");
            window.location = href;
        });

        $(".cricket_div").hide();

    });



          var max_deposit_limit = '';
          if(max_deposit_limit == 1){
            maxlimit.style.display = "block";
          }
          else{
            maxlimit.style.display = "none";


          }


          function checkBoxcheck() {

            var checkBox = document.getElementById("myCheck");
            var text = document.getElementById("text");
            // var Max_Deposit_Limit = document.getElementById("maxlimit");


            if (checkBox.checked == true){
              var text = document.getElementById("text").value = '1';
              maxlimit.style.display = "block";

            } else {
              var text = document.getElementById("text").value = '0';
                maxlimit.style.display = "none";
            }
          }
</script>

<!--**********************************
Content body end
***********************************-->
@endsection