@extends('layouts.app')

@section('content')
    <!-- Datatables -->
    <link href="{{ url('/') }}/vendors/datatables.net-bs/css/dataTables.bootstrap.min.css" rel="stylesheet">
    <link href="{{ url('/') }}/vendors/datatables.net-buttons-bs/css/buttons.bootstrap.min.css" rel="stylesheet">
    <link href="{{ url('/') }}/vendors/datatables.net-fixedheader-bs/css/fixedHeader.bootstrap.min.css" rel="stylesheet">
    <link href="{{ url('/') }}/vendors/datatables.net-responsive-bs/css/responsive.bootstrap.min.css" rel="stylesheet">
    <link href="{{ url('/') }}/vendors/datatables.net-scroller-bs/css/scroller.bootstrap.min.css" rel="stylesheet">

  <body class="nav-md">
    <div class="container body">
      <div class="main_container">
        @include('partials.sidebar')

        @include('partials.topmenu')

        <!-- page content -->
        <div class="right_col" role="main">
          @if (Session::get('message') != '')
            <div class="alert alert-success alert-dismissible fade in" role="alert">
              <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span>
              </button>
              <strong>{{ Session::get('message') }}</strong>
            </div>
          @endif
          

          <div class="row">
              <div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                  <div class="x_title">
                    <h2>Create Ad <small>form</small></h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                    <form id="demo-form2" action="{{ url('/cp/addads') }}" method="post" data-parsley-validate class="form-horizontal form-label-left">
                      {{ csrf_field() }}
                      <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">Title <span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                          <input type="text" id="first-name" name="title" required="required" class="form-control col-md-7 col-xs-12" value="">
                          @if ($errors->has('title'))
                              <span class="help-block">
                                  <strong>{{ $errors->first('title') }}</strong>
                              </span>
                          @endif
                        </div>
                      </div>
                      <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">Ad Link <span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                          <input type="text" id="first-name" name="ad_link" required="required" class="form-control col-md-7 col-xs-12" value="">
                          @if ($errors->has('ad_link'))
                              <span class="help-block">
                                  <strong>{{ $errors->first('ad_link') }}</strong>
                              </span>
                          @endif
                        </div>
                      </div>
                      <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">Publish Date<span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                          <select name="published_at" id="week_no" class="form-control col-md-7 col-xs-12">
                            @for ($i = date('W'); $i <= 52; $i++)
                              <option value="{{ date( "Y-m-d", strtotime(date('Y')."W".$i."0") ) }}" @if ($i == date('W')) selected="selected" @endif>{{ date( "l, M jS, Y", strtotime(date('Y')."W".$i."0") ) }}</option>
                            @endfor
                          </select>
                          @if ($errors->has('published_at'))
                              <span class="help-block">
                                  <strong>{{ $errors->first('published_at') }}</strong>
                              </span>
                          @endif
                        </div>
                      </div>
                      <div class="ln_solid"></div>
                      <div class="form-group">
                        <div class="col-md-6 col-sm-6 col-xs-12 col-md-offset-3">
                          <button type="submit" class="btn btn-success">Submit</button>
                        </div>
                      </div>
                    </form>
                  </div>
                </div>
              </div>
              <div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                  <div class="x_title">
                    <h2>Ads History</h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                    <table id="datatable-fixed-header" class="table table-striped table-bordered">
                      <thead>
                        <tr>
                          <th>Ad URL</th>
                          <th>Views</th>
                          <th>Total Income</th>
                          <th>Published at</th>
                          <th>Created at</th>
                          <th>Preview</th>
                        </tr>
                      </thead>


                      <tbody>
                      @foreach ($published_ads as $ad)
                        <tr>
                          <td>{{ $ad->ad_link }}</td>
                          <td>{{ $ad->views }}</td>
                          <td>{{ $ad->total_income }}</td>
                          <td>{{ $ad->published_at }}</td>
                          <td>{{ $ad->created_at }}</td>
                          <td>
                            <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#popvideo{{ $ad->id }}" onclick="$('#cartoonVideo').attr('src','{{ $ad->ad_link }}');">View</button>

                            <div class="modal fade bs-example-modal-lg" id="popvideo{{ $ad->id }}" tabindex="-1" role="dialog" aria-hidden="true">
                              <div class="modal-dialog modal-lg">
                                <div class="modal-content">

                                  <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
                                    </button>
                                    <h4 class="modal-title" id="myModalLabel">{{$ad->title}}</h4>
                                  </div>
                                  <div class="modal-body">
                                    <iframe id="cartoonVideo" width="560" height="315" src="{{ $ad->ad_link }}" frameborder="0" allowfullscreen></iframe>
                                  </div>
                                  <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal" onclick="$('#cartoonVideo').attr('src','');">Close</button>
                                  </div>

                                </div>
                              </div>
                            </div>
                            <a type="button" class="btn btn-success" href="{{ url('/cp/addads'.'/'.$ad->id) }}">Edit</button>
                          </td>
                        </tr>
                      @endforeach
                      </tbody>
                    </table>
                  </div>
                </div>
              </div>


              
            </div>
          </div>
        </div>
        <!-- /page content -->
        @include('partials.footer')
      </div>
    </div>

    <!-- jQuery -->
    <!-- jQuery -->
    <script src="{{ url('/') }}/vendors/jquery/dist/jquery.min.js"></script>
    <!-- Bootstrap -->
    <script src="{{ url('/') }}/vendors/bootstrap/dist/js/bootstrap.min.js"></script>
    <!-- FastClick -->
    <script src="{{ url('/') }}/vendors/fastclick/lib/fastclick.js"></script>
    <!-- NProgress -->
    <script src="{{ url('/') }}/vendors/nprogress/nprogress.js"></script>
    <!-- iCheck -->
    <script src="{{ url('/') }}/vendors/iCheck/icheck.min.js"></script>
    <!-- Datatables -->
    <script src="{{ url('/') }}/vendors/datatables.net/js/jquery.dataTables.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-buttons-bs/js/buttons.bootstrap.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-buttons/js/buttons.flash.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-buttons/js/buttons.html5.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-buttons/js/buttons.print.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-fixedheader/js/dataTables.fixedHeader.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-keytable/js/dataTables.keyTable.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-responsive/js/dataTables.responsive.min.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-responsive-bs/js/responsive.bootstrap.js"></script>
    <script src="{{ url('/') }}/vendors/datatables.net-scroller/js/dataTables.scroller.min.js"></script>
    <script src="{{ url('/') }}/vendors/jszip/dist/jszip.min.js"></script>
    <script src="{{ url('/') }}/vendors/pdfmake/build/pdfmake.min.js"></script>
    <script src="{{ url('/') }}/vendors/pdfmake/build/vfs_fonts.js"></script>
    <!-- bootstrap-daterangepicker -->
    <script src="{{ url('/') }}/js/moment/moment.min.js"></script>
    <script src="{{ url('/') }}/js/datepicker/daterangepicker.js"></script>
    <!-- Custom Theme Scripts -->
    <script src="{{ url('/') }}/build/js/custom.min.js"></script>
    <!-- Datatables -->
    <script>
      $(document).ready(function() {

        //$('#single_cal1').daterangepicker({
        //  singleDatePicker: true,
        //  calender_style: "picker_1",
        //  minDate: 0,
        //  daysOfWeekDisabled: [0,2,3,4,5,6]
        //}, function(start, end, label) {
        //  console.log(start.toISOString(), end.toISOString(), label);
        //});

        $('#datatable-fixed-header').DataTable({
          fixedHeader: true
        });
      });
    </script>
    <!-- /Datatables -->
  </body>
@endsection
