@extends('layouts.master')

@section('content')
<style type="text/css">
  .pointer {
    cursor: pointer;
  }

  i.fa.pointer {
    font-size: 18px;
  }

  i.fa.fa-times-circle {
    color: #d01010;
  }
</style>

<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
  <!-- Content Header (Page header) -->
  <div class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1 class="m-0 text-dark">{{ trans('breadcrumbs.Tournament List') }}</h1>
        </div>
        <!-- /.col -->
        <div class="col-sm-3"></div>
        <div class="col-sm-3">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item">{{ Breadcrumbs::render('Tournament List') }}</li>
          </ol>
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </div>
    <!-- /.container-fluid -->
  </div>
  <!-- /.content-header -->

  <section class="content">
    <div class="card" id="filterDiv">
      <div class="card-header">
        <h3 class="card-title">{{ trans('layout.Filter') }}</h3>
        <div class="col-md-6 card-primary card-form-1">
          <div class="card-body">
            <div class="form-col-1">
              {{ Form::label('TOURNAMENT_NAME', trans('tournament.Tournament Name')) }}
              {{ Form::text('TOURNAMENT_NAME','', ['id' => 'TOURNAMENT_NAME', 'class' => 'form-control', 'placeholder' => trans('tournament.Tournament Name')]) }}
            </div>
            <div class="form-col-1">
              {{ Form::label('TOURNAMENT_TYPE',  trans('tournament.Tournament Type'))}}
              {{ Form::select('TOURNAMENT_TYPE', $tournamentType,'',['class' => 'form-control select2','placeholder' => trans('reports.Select option'),'id' => 'TOURNAMENT_TYPE']) }}
            </div>
            <div class="form-col-1">
              {{ Form::label('STATUS',  trans('tournament.Status'))}}
              {{ Form::select('STATUS', $status,'',['class' => 'form-control select2','placeholder' => trans('reports.Select option'),'id' => 'STATUS']) }}
            </div>
            <div class="form-col-1">
              {{ Form::label('DATE_RANGE',trans('layout.Select Date Range')) }}<br>
              <button type="button" style="width: 100%;" class="btn btn-default" id="daterange-btn">
                <span class="daterange_span pull-left">{{ trans('layout.Select Date Range') }}</span>
              </button>
              <input type="hidden" name="selected_date" id="selected_date">
              <input type="hidden" name="selected_datatime" id="selected_datatime">
            </div>
            <br> <br>
            <div class="button_sec">
              <button class="btn btn-primary" id="getReport">{{ trans('layout.Submit') }}</button>
              <button class="btn btn-default" id="reloadPage">{{ trans('layout.Clear') }}</button>
            </div>
          </div>
        </div>
      </div>
      <!-- /.card-body -->
    </div>

    <hr>

    <div class="card" id="report" style="display:none">
      <div class="card-header">
        <h3 class="card-title" id="report_title"></h3>
      </div>
      <div class="card-body">
        <div class="dt-buttons" onClick="post()">
            <button class="dt-button buttons-excel buttons-html5" tabindex="0" type="button" title="Excel"><span><i class="fa fa-file-excel-o"></i></span></button> 

        </div>

        

        <table id="table" class="table table-bordered table-striped">
          <thead>
            <tr>
              <th class="text-center">{{ trans('tournament.Tournament Name') }}</th>
              <th class="text-center">{{ trans('tournament.Type') }}</th>
              <th class="text-center">{{ trans('tournament.Currency') }}</th>
              <th class="text-center">{{ trans('tournament.Buy In') }} {!! env('CURRENCY_SYMBOL') !!}</th>
              <th class="text-center">{{ trans('tournament.Entry Fee') }} {!! env('CURRENCY_SYMBOL') !!}</th>
              <th class="text-center">{{ trans('tournament.Min Players') }}</th>
              <th class="text-center">{{ trans('tournament.Max Players') }}</th>
              <th class="text-center">{{ trans('tournament.Status') }}</th>
              <th class="text-center">{{ trans('tournament.Prize Amount') }} {!! env('CURRENCY_SYMBOL') !!}</th>
              <th class="text-center">{{ trans('tournament.Prize Type') }}</th>
              <th class="text-center">{{ trans('reports.Action') }}</th>
            </tr>
          </thead>
        </table>
      </div>
      <!-- /.card-body -->
    </div>


  </section>


  <!-- INFORMATION POPUP -->

  <div class="modal fade" id="msg_detail" role="dialog">
    <div class="modal-dialog">
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title" id="msg_title"></h4>
        </div>
        <div class="modal-body" id="msg_body">

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

  <!-- INFORMATION POPUP -->

  <div class="modal fade" id="info_model" role="dialog">
        <div class="modal-dialog">
            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">General Info</h4>
                </div>
                <div class="modal-body">                   
                        <div><b>Tournament Name:</b> <span id='tournamentName'></span></div>
                        <div><b>Tournament Type:</b> <span id='tournamentType'></span></div>
                        <div><b>Tournament Start Time:</b> <span id='tournamentStartTime'></span></div>
                        <div><b>Tournament End Time:</b> <span id='tournamentEndTime'></span></div>
                        <div><b>Minimum Players:</b> <span id='minPlayer'></span></div>
                        <div><b>Maximum Players:</b> <span id='maxPlayer'></span></div>
                        <div><b>Currency:</b> <span id='currency'></span></div>
                        <div><b>Entry Fee:</b> {!! env('POUND') !!} <span id='entryFee'></span></div>
                        <div><b>Tournament Status:</b> <span id='tournamentStatus'></span></div>
                        <div><b>Prize Money:</b>  {!! env('POUND') !!} <span id='prizeMoney'></span></div>
                        <div><b>Buy In:</b>  {!! env('POUND') !!}<span id='buyIn'></span></div>
                </div>
          
            <div class="error" id="modal-error"></div>
        </div>
    </div>
    
</div>

  <!-- Cancel POPUP -->

  <div class="modal fade" id="cancel-model" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header text-center">
          <button type="button" class="close" data-dismiss="modal">×</button>
          <h4 class="modal-title">{{ trans('tournament.Cancel Tournament') }}</h4>
        </div>
        <div class="modal-body">
          <div class="form-col-3">
            {{ Form::label('REASON', trans('tournament.Reason')) }}
            {{ Form::text('REASON', '', ['id' => 'REASON', 'class' => 'form-control']) }}
            {{ Form::hidden('TOURNAMENT_ID', '', ['id' => 'TOURNAMENT_ID', 'class' => 'form-control']) }}
          </div>
          <span id="reason-error" class="error-help-block"></span>
          <br>
          <div id="popup-button">
            <button class="btn btn-primary" id="cancel-tournament">{{ trans('layout.Submit') }}</button>
            <button class="btn btn-default" data-dismiss="modal">{{ trans('layout.Close') }}</button>
          </div>
          <div id="popup-loader" style="display:none"><img style="height:50px; width: 50px" src="{{ asset('img/lg.double-ring-spinner.gif') }}"></div>
        </div>
      </div>
    </div>
  </div>

  <!-- Cancel POPUP -->

</div>
@endsection
@section('javascript')
@include('datatablejs')
<script type="text/javascript">
  var reportTable;
  $("#getReport").click(function() {
    $("#selected_datatime").val($("#selected_date").val());

    $('#report_title').html("Tournament List: " + $('.daterange_span').html());
    $('#report').show();

    reportTable = $('#table').DataTable({
      "responsive": true,"scrollX": true,
      "pagingType": "numbers",
      "processing": true,
      "bDestroy": true,
      "serverSide": true,
      "searching": false,
      "aaSorting": [],
      "lengthMenu": [
        [20, 50, 100, 200],
        [20, 50, 100, 200]
      ],
      "columnDefs": [{
          "orderable": false,
          "targets": [10]
        },
        {
          "className": 'text-right',
          "targets": [3, 4, 8],
        },
        {
          "className": 'text-center',
          "targets": [0, 1, 2, 5, 6, 7, 9, 10],
        }
      ],
      "ajax": {
        "url": "{{ route('rummytournament.fetch') }}",
        "type": "GET",
        "data": function(d) {
          d.filter_date = $("#selected_datatime").val();
          d.filter_tournament_name = $("#TOURNAMENT_NAME").val();
          d.filter_tournament_type = $("#TOURNAMENT_TYPE").val();
          d.filter_status = $("#STATUS").val();


        },
        "error": function(e) {
          swal("{{ trans('layout.Something went wrong') }}", {
            icon: "warning",
          });
        },
      },
      "drawCallback": function(response, settings) {
        var api = this.api();
        var rows = api.rows({
          page: 'current'
        }).nodes();
        if (rows.length > 0) {
          $('.dt-buttons').show();
        } else {
          $('.dt-buttons').hide();
        }
      }
    });
  });

  function showReason(id) {
    var data = new FormData();
    data.append('id', id);
    data.append('_token', '{{ csrf_token() }}');

    $.ajax({
      type: 'POST',
      url: "{{ route('rummytournament.showReason') }}",
      data: data,
      dataType: 'JSON',
      contentType: false,
      processData: false,
      success: function(response) {
        var message = response.msg;
        var status = response.status;
        if (status == 200) {
          $('#msg_title').html("{{ trans('tournament.Cancel Reason') }}");
          $('#msg_body').html(message);
          $('#msg_detail').modal('show');
        } else {
          swal("{{ trans('layout.Something went wrong') }}", {
            icon: "warning",
          });
        }
      },
      error: function() {
        swal("{{ trans('layout.Something went wrong') }}", {
          icon: "warning",
        });
      }
    });
  }

  function showTime(id) {
    var data = new FormData();
    data.append('id', id);
    data.append('_token', '{{ csrf_token() }}');

    $.ajax({
      type: 'POST',
      url: "{{ route('rummytournament.showTime') }}",
      data: data,
      dataType: 'JSON',
      contentType: false,
      processData: false,
      success: function(response) {
        var message = response.msg;
        var status = response.status;
        if (status == 200) {
          $('#msg_title').html("{{ trans('tournament.Tournament Timings') }}");
          $('#msg_body').html(message);
          $('#msg_detail').modal('show');
        } else {
          swal("{{ trans('layout.Something went wrong') }}", {
            icon: "warning",
          });
        }
      },
      error: function() {
        swal("{{ trans('layout.Something went wrong') }}", {
          icon: "warning",
        });
      }
    });
  }

  // Delete tournament
  function deleteTournament(id) {

    swal({
        title: " {{ trans('tournament.Alert')  }} ",
        text: "{{ trans('tournament.Alertmsg') }}",
        icon: "warning",
        buttons: true,
        dangerMode: true,
      })
      .then((willUpdate) => {
        if (willUpdate) {
          $.ajaxSetup({
            headers: {
              'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
          });
          $.ajax({
            url: "{{ route('rummytournament.delete') }}",
            method: "GET",
            dataType: 'json',
            data: {
              id: id
            },
            success: function(response) {
              var message = response.msg;
              var status = response.status;
              if (status == 200) {
                $('select[name=table_length]').trigger('change');
                swal("{{ trans('tournament.StatusSuccess') }}", {
                  icon: "success",
                });
              } else {
                swal("{{ trans('layout.Something went wrong') }}", {
                  icon: "warning",
                });
              }
            }
          });
        } else {

        }
      });
  }


  function cancelTournament(id) {
    $("#REASON").val('');
    $("#reason-error").html('');
    $("#TOURNAMENT_ID").val(id);

    $("#cancel-model").modal({
      backdrop: 'static',
      keyboard: false
    });
  }

  $(document).on('click', '#cancel-tournament', function() {
    var reason = $("#REASON").val();
    if (reason.length < 2) {
      $("#reason-error").html('Enter valid reason');
      return;
    }

    $("#reason-error").html('');

    var data = new FormData();
    data.append('reason', reason);
    data.append('id', $("#TOURNAMENT_ID").val());
    data.append('_token', '{{ csrf_token() }}');

    $.ajax({
      type: 'POST',
      url: "{{ route('rummytournament.cancel') }}",
      data: data,
      dataType: 'JSON',
      contentType: false,
      processData: false,
      beforeSend: function() {
        $("#popup-button").hide();
        $("#popup-loader").show();
      },
      success: function(response) {
        var message = response.msg;
        var status = response.status;
        if (status == 200) {
          $('select[name=table_length]').trigger('change');
          $('#cancel-model').modal('hide');
          swal("{{ trans('tournament.CancelSuccess') }}", {
            icon: "success",
          });
        } else {
          $("#reason-error").html(message);
        }
      },
      error: function() {
        $("#reason-error").html("{{ trans('layout.Something went wrong') }}");
      },
      complete: function() {
        $("#popup-loader").hide();
        $("#popup-button").show();
      }
    });
  });

  function post() {
    const form = document.createElement('form');
    form.method = 'get';
    form.action = "{{ route('rummytournament.download') }}";

    const hiddenField = document.createElement('input');
    hiddenField.type = 'hidden';
    hiddenField.name = 'filter_date';
    hiddenField.value = $("#selected_datatime").val();

    form.appendChild(hiddenField);

    const hiddenField2 = document.createElement('input');
    hiddenField2.type = 'hidden';
    hiddenField2.name = 'filter_tournament_name';
    hiddenField2.value = $("#TOURNAMENT_NAME").val();

    form.appendChild(hiddenField2);

    const hiddenField3 = document.createElement('input');
    hiddenField3.type = 'hidden';
    hiddenField3.name = 'filter_tournament_type';
    hiddenField3.value = $("#TOURNAMENT_TYPE").val();

    form.appendChild(hiddenField3);

    const hiddenField4 = document.createElement('input');
    hiddenField4.type = 'hidden';
    hiddenField4.name = 'filter_status';
    hiddenField4.value = $("#STATUS").val();

    form.appendChild(hiddenField4);

    document.body.appendChild(form);
    form.submit();
  }
  
  function tournamentInfo(tournament_id) {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $.ajax({
            url: "{{ route('rummytournament.tournamentInfo') }}",
            method: "POST",
            dataType: 'json',
            data: {
                id: tournament_id,

            },
            success: function(response) {
                if (response.status == 200) {
                    $('#tournamentName').html(response.data.TOURNAMENT_NAME);
                    // $('#tournamentType').html(response.data.TOURNAMENT_TYPE_ID);
                     $('#tournamentType').html(response.data.TOURNAMENT_TYPE);
                    $('#tournamentStartTime').html(response.data.TOURNAMENT_START_TIME);
                    $('#tournamentEndTime').html(response.data.TOURNAMENT_END_TIME);
                    $('#currency').html(response.data.CURRENCY);
                    $('#minPlayer').html(response.data.MIN_PLAYER);
                    $('#maxPlayer').html(response.data.MAX_PLAYER);
                    $('#buyIn').html(response.data.BUYIN);
                    $('#entryFee').html(response.data.ENTRY_FEE);
                    $('#tournamentStatus').html(response.data.TOURNAMENT_STATUS);
                    $('#prizeMoney').html(response.data.PRIZE_AMOUNT);
                    $("#info_model").modal({
                        backdrop: 'static',
                        keyboard: false
                    });
                } else {
                    swal("{{ trans('layout.Something went wrong') }}", {
                        icon: "warning",
                    });
                }
            }
        });
    }

</script>
@stop