@include('includes.admin.header')
@include('includes.admin.sidebar')
<script>
    $(document).ready(function(){
        $('#schedule-menu').addClass('active');
    });
</script>
<link rel="stylesheet" href="/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css">
<script src="/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
      <!-- Content Wrapper. Contains page content -->
      <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
          <h1>
           Schedule Edit
            <small>From Schedules</small>
          </h1>
          <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
            <li><a href="#">Schedules</a></li>
            <li class="active">Edit Schedule</li>
          </ol>
        </section>

        <!-- Main content -->
        <section class="content">
          <div class="row">
            <div class="col-md-12">
              <div class="box">
                <div class="box-header with-border">
                  <h3 class="box-title">Edit Schedule</h3>
                </div><!-- /.box-header -->
                <div class="col-xs-12 hcenter" id="loading">
                        <img src="/images/loading.gif" class="col-xs-12"/>
                    </div>
               <form class="form-horizontal" id="register-form">
                   <div class="error" style="display: none">
                            
                        </div>
                  <div class="box-body">
                      <div class="form-group">
                        <label for="inputname3" class="col-sm-2 control-label">Name of the Match</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="name" name="name" placeholder="Name of the Match">
                        </div>
                    </div>
                    <div class="form-group">
                      <label for="inputname3" class="col-sm-2 control-label">Start Date</label>
                      <div class="col-sm-9">
                        <input type="date" class="form-control" id="date_date" name="date_date" placeholder="date">
                      </div>
                    </div>
                    <div class="form-group">
                      <label for="state" class="col-sm-2 control-label">Start Time</label>
                      <div class="col-sm-9">
                        <input type="time" class="form-control " id="time_time" name="time_time" placeholder="time">
                      </div>
                    </div>
                    <div class="form-group">
                      <label for="inputname3" class="col-sm-2 control-label">End Date & Time</label>
                      <div class="col-sm-9">
                        <input type="text" class="form-control date_time" id="end_time" name="end_time" placeholder="date & time" readonly="readonly">
                      </div>
                    </div>
                    
                      <div class="form-group">
                      <label for="Ground" class="col-sm-2 control-label">Home/Away</label>
                      <div class="col-sm-9">
                        <select class="form-control" id="home_away" name="home_away">
                            <option value="">---select option---</option>
                            <option value="Home">Home</option>
                            <option value="Away">Away</option>
                            <option value="Neutral">Neutral</option>
                        </select>
                      </div>
                    </div>
                    <div class="form-group">
                      <label for="Ground" class="col-sm-2 control-label">Venue</label>
                      <div class="col-sm-9">
                        <input type="text" class="form-control" id="ground" name="ground" placeholder="Ground">
                      </div>
                    </div>
                    <div class="form-group">
                        <label for="Team" class="col-sm-2 control-label">Opposite Team</label>
                        <div class="col-sm-9">
                            <select class="form-control" id="opposite_team" name="opposite_team">
                                                            
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="Ground" class="col-sm-2 control-label">Goals Home Team Scored</label>
                        <div class="col-sm-9">
                            <input type="number" class="form-control" id="home_goals" name="home_goals" placeholder="Home Goals">
                        </div>
                    </div>
                    <div class="form-group">
                      <label for="Ground" class="col-sm-2 control-label">Goals Opposition Scored</label>
                      <div class="col-sm-9">
                        <input type="number" class="form-control" id="opposition_goals" name="opposition_goals" placeholder="Opposition Goals">
                      </div>
                    </div>
                    <div class="form-group">
                      <label for="result" class="col-sm-2 control-label">Result</label>
                      <div class="col-sm-9">
                          <textarea  class="form-control" id="result" name="result" placeholder="result"></textarea>
                      </div>
                    </div>
                    <div class="form-group">
                      <label for="result" class="col-sm-2 control-label">Youtube Link to URL</label>
                      <div class="col-sm-9">
                          <input type="text" class="form-control" id="youtube" name="youtube" placeholder="Youtube Link to URL" />
                      </div>
                    </div>
                      
                    <div class="form-group">
                      <label for="result" class="col-sm-2 control-label">Current Youtube Video</label>
                      <div class="col-sm-9" id="video-container">
                         
                      </div>
                    </div>

                    <div class="form-group">
                      <label for="result" class="col-sm-2 control-label">Youtube Link to Highlights</label>
                      <div class="col-sm-9">
                          <input type="text" class="form-control" id="highlights" name="highlights" placeholder="Youtube Link to Highlights" />
                      </div>
                    </div>

                    <div class="form-group">
                      <label for="result" class="col-sm-2 control-label">Current Youtube Link to Highlights</label>
                       <div class="col-sm-9" id="video-highlights-container">
                         
                      </div>
                    </div>
                      
                    <div class="form-group">
                     
                      <div class="col-sm-9">
                          <a href='/admin/schedule/{{$UUID}}/player/add/pre' class="btn bg-success" >Add Pre-match Formation to Schedule &nbsp;&nbsp;<i class='glyphicon glyphicon-plus'></i></a>
                          <!-- <a href='/admin/schedule/{{$UUID}}/player/add/post' class="btn btn-default" >Add Live Match Formation to Schedule &nbsp;&nbsp;<i class='glyphicon glyphicon-plus'></i></a>-->
                          <a href='/admin/schedule/{{$UUID}}/player/add/post' class="btn bg-blue" >Add Post-Formation to Schedule &nbsp;&nbsp;<i class='glyphicon glyphicon-plus'></i></a>
                      </div>
                    </div>
                  </div><!-- /.box-body -->
                  <div class="box-footer">
                    <button type="reset" class="btn btn-default">Cancel</button>
                    <button type="button" class="btn btn-info pull-right" id="btn-submit">Submit</button>
                  </div><!-- /.box-footer -->
                </form>
              </div><!-- /.box -->

             
            </div><!-- /.col -->
            
          </div><!-- /.row -->
          
        </section><!-- /.content -->
      </div><!-- /.content-wrapper -->
      
      <script>

      $('#end_time').datetimepicker({format: 'dd M yyyy hh:ii'});
            $(document).ready(function(){
                $.get('/admin/schedule/{{$UUID}}',{"_token": "{{ csrf_token() }}"}, function(res){
                        $('#name').val(res.name);
                        $('#home_away').val(res.home_away);
                        $('#date_date').val(res.date_date);
                        $('#date_date').val(res.date_date);
                        $('#time_time').val(res.time_time);
                        $('#ground').val(res.ground);
                        $('#opposite_team').val(res.opposite_team);
                        $('#result').val(res.result);
                        $('#home_goals').val(res.home_goals);
                        $('#opposition_goals').val(res.opposition_goals);
                        $('#youtube').val(res.youtube);
                        $('#video-container').html(res.youtube_embed);
                        $('#highlights').val(res.highlights);
                        $('#video-highlights-container').html(res.highlights_embed);
                        $('#end_time').val(res.end_time);
                        $('#loading').hide();
                        $('#register-form').show();
                    },'json');
                $('#btn-submit').click(function(){
                    var current  = $(this);
                    current.attr('disabled', 'disabled').text('Please Wait. Updating.....');
                    var data = $("#register-form").serializeArray();
                    $.post('/admin/schedule/update/{{$UUID}}',{data:data, "_token": "{{ csrf_token() }}"}, function(res, status){
                        
                        alert('Schedule Added Successfully');
                        window.location.href = '#body';
                        window.location.href = '/admin/schedule';
                    },'json')
                    .fail(function(xhr) {
                        var html = '';
                        var res = xhr.responseJSON;
                        $(res).each(function(i, value){
                            html+= '<p>' + value + '</p>';
                        });
                        $('.error').html(html).show();
                        current.html('Submit').removeAttr('disabled');
                        window.location.href = '#body';
                    },'json');;
                });
            });
        </script>
@include('includes.admin.footer')