@extends('admin.layouts.default')
@section('content')
<script type="text/javascript">
$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip();
});
</script>
<style media="screen">
  .red{
    color: #FF0000;
  }
  #mycontent-left {
  border-left: 2px solid gray;

}
</style>
<!--********************************** 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 justify-content-sm-end mt-2 mt-sm-0 d-flex">

        </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')}}">Add Match Scores</a></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">Add Match Scores</h4>
                </div>

                <div class="card-body">
                    <div class="form-group col-md-12">
                    <div class="basic-form">
                        {{ Form::open(['role' => 'form','id'=>'mathcAddEditForm','route'=>[$modelName.'.match_score'], 'files' => true]) }}

                        <!-- <div class="form-row">
                          <div class="form-group col-md-6">
                            <label for="dino-select" class="lbl_frm py-2">Team 1 Score:</label>
                            <input type="text" name="team1score" id="team1score" class="form-control in_text" value="{{$listMatchesData->team1score}}"/>
                          </div>
                          <div class="form-group col-md-6">
                            <label for="dino-select" class="lbl_frm py-2">Team 2 Score:</label>
                            <input type="text" name="team2score" id="team2score" class="form-control in_text" value="{{$listMatchesData->team2score}}"/>
                          </div>
                        </div> -->

                        <div class="form-row">
                          <div class="form-group col-md-6">
                          <label for="dino-select" class="lbl_frm py-2">Choose Players:</label>
                                                    <input type="text" name="player_id" id="player_id" class="form-control"  placeholder="Enter Player Name" />
                          <div id="PlayerList">
                                    <button class="btn btn-gray" id="reset_data" ><i class="fa fa-repeat mr-2"></i>Reset</button>
                                  </div>
                        </div>
                        <div class="form-group col-md-6">
                            <input type="hidden" name="" value="0" id="total_points">
                            <p id="point_total_points" style="font-size: 14px;"></p>
                        </div>
                        </div>

                            </div>

                        </div>
                    <div class="form-row" id="points_row" style="display:none;">
                        <div class="form-group col-md-6">
                              <div class="form-row">
                                <input type="hidden" name="match_id" value="{{$matchid}}" id="match_id" >
                                <input type="hidden" name="competition_id" value="{{$competition_id}}" id="competition_id">
                                <input type="hidden" name="sport_type" value="{{$sport_type}}" id="sport_type">
                                <div class="form-group col-md-12">
                                    <h4 class="lbl_frm py-2">Scores</h4>
                                </div>

                                                              </div>
                        </div>
                        <div class="col-md-1" id="mycontent-left"></div>
                        <div class="form-group col-md-5 ">
                          <div class="form-row">
                            <input type="hidden" name="match_id" value="{{$matchid}}" id="match_id" >
                            <input type="hidden" name="competition_id" value="{{$competition_id}}" id="competition_id">
                            <input type="hidden" name="sport_type" value="{{$sport_type}}" id="sport_type">
                            <div class="form-group col-md-12">
                                <h4 class="lbl_frm py-2">Points - <span id="totalPointCalc"> </span></h4>
                            </div>

                                                      </div>

                        </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::close() }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
function calculate_points(label,value){
  $.ajax({
      url: "{{route($modelName.'.calculate_points')}}",
      type: "post",
      data: {"label":label,"value":value},
      success: function(res){
        $.each(res, function(key,value)
          { console.log(key);
            $('#point_'+key).val(value);
          });
      },
      error: function(err){
          console.log(err);
      }
  });
}
    $(document).ready(function(){
      refreshData();
 //      $('#player_id').on('change', function() {
 //        var player_id = this.value;
 //        var match_id = $('#match_id').val();
 //        var competition_id =$('#competition_id').val();
 //        var sport_type =$('#sport_type').val();
 //
 //            $.ajax({
 //                url: "{{route($modelName.'.getmatchscore')}}",
 //                type: "post",
 //                data: {"match_id":match_id,"competition_id":competition_id,"player_id":player_id,"sport_type":sport_type },
 //                success: function(res){
 //                  $.each(res, function(key,value)
 //                    { console.log(key);
 //                       $('#'+key).val(value);
 //
 //
 //
 //                    });
 //                },
 //                error: function(err){
 //                    console.log(err);
 //                }
 //            });
 //            $.ajax({
 //                url: "{{route($modelName.'.getPlayerPoints')}}",
 //                type: "post",
 //                data: {"match_id":match_id,"competition_id":competition_id,"player_id":player_id,"sport_type":sport_type },
 //                success: function(res){
 //
 //
 // $("#totalPointCalc").text(res.total_points);
 // console.log(res.total_points);
 //                  $.each(res, function(key,value)
 //                    { console.log(key);
 //                      $('#point_'+key).val(value);
 //                       $('#point_'+key).val(value);
 //
 //
 //                    });
 //                },
 //                error: function(err){
 //                    console.log(err);
 //                }
 //            });
 //
 //            $('#points_row').show();
 //      });

        $("#start_date").datetimepicker({
            timepicker: false,
            format:'Y-m-d'
        });
        $(document).on("click","#cancel_btn", function(){
            let href = $(".breadcrumb-item.active a").attr("href");
            window.location = href;
        });
        $(document).on('change','#team1',function(){
          var shortNameTeam1 = $(this).find("option:selected").text();
          var shortNameTeam2 = $('#team2').find("option:selected").text();
          var shortName1 = shortNameTeam1.slice(0, 3);
          var shortName2 = shortNameTeam2.slice(0, 3);
          $("#name").val(shortNameTeam1+' Vs '+shortNameTeam2);
          $("#short_name").val(shortName1+' Vs '+shortName2);
          $("#team1display").val(shortName1);
        });
        $(document).on('change','#team2',function(){
          var shortNameTeam2 = $(this).find("option:selected").text();
          var shortNameTeam1 = $('#team1').find("option:selected").text();
            $("#name").val(shortNameTeam1+' Vs '+shortNameTeam2);
            var shortName1 = shortNameTeam1.slice(0,3);
            var shortName2 = shortNameTeam2.slice(0,3);
            $("#name").val(shortNameTeam1+' Vs '+shortNameTeam2);
            $("#short_name").val(shortName1+' Vs '+shortName2);
            $("#team2display").val(shortName2);
        });
    });


function dataChange(playerId){
  var player_id = playerId;
  var match_id = $('#match_id').val();
  var competition_id =$('#competition_id').val();
  var sport_type =$('#sport_type').val();
  // $("#mathcAddEditForm").reset();
      $.ajax({
          url: "{{route($modelName.'.getmatchscore')}}",
          type: "post",
          data: {"match_id":match_id,"competition_id":competition_id,"player_id":player_id,"sport_type":sport_type },
          success: function(res){
            $.each(res, function(key,value)
              { console.log(key);
                 $('#'+key).val(value);



              });
          },
          error: function(err){
              console.log(err);
          }
      });
      $.ajax({
          url: "{{route($modelName.'.getPlayerPoints')}}",
          type: "post",
          data: {"match_id":match_id,"competition_id":competition_id,"player_id":player_id,"sport_type":sport_type },
          success: function(res){


$("#totalPointCalc").text(res.total_points);
console.log(res.total_points);
            $.each(res, function(key,value)
              { console.log(key);
                $('#point_'+key).val(value);
                 $('#point_'+key).val(value);


              });
          },
          error: function(err){
              console.log(err);
          }
      });

      $('#points_row').show();

}

$('#player_id').keyup(function(){
  var query = $(this).val();
  if(query != '')
  {
    var _token = $('input[name="_token"]').val();
    $.ajax({
      url:"{{ route('MatchesController.fetchPlayers') }}",
      method:"POST",
      data:{query:query, _token:_token},
      success:function(data){
        $('#PlayerList').fadeIn();
        $('#PlayerList').html(data);

      }
    });
  }
});

$(document).on('click', 'li', function(){
$('#playerId').val($(this).text());
let playerId = event.target.getAttribute('data-attr-id');
$('#dataList').DataTable().clear().destroy();
var url = window.location.href.split('?')[0];
console.log(url);
history.pushState('', '', url+"?seriesid="+playerId);
dataChange(playerId);
$('#PlayerList').fadeOut();
});

function refreshData(){
  let playerId = '';
if(playerId){

  console.log(playerId);
  // $('#dataList').DataTable().clear().destroy();
  dataChange(playerId);

          $("#points_row").show();
}
}
</script>
<!--**********************************
Content body end
***********************************-->
@endsection