@extends('index-left-sidebar')

@section('content')
<div id="krik-single-event-nametags">

  {{-- Event Name, Date, Location  --}}
  <div class="panel krik-panel">
    <div class="panel-heading">
      <h2 class="krik-single-event-title">{{ $event_info->name }}</h2>
      <h3 class="krik-single-event-info">
        @php
          $event_start = new DateTime($event_info->start_ts);
          $event_end = new DateTime($event_info->end_ts);
          $event_days_diff = $event_start->diff($event_end)->d;
        @endphp
        @if($event_info->type_by_venue == 'physical')
          @if ($event_days_diff > 0)
            {{ date("d.m.Y. H:i", strtotime($event_info->start_ts)) . ' - ' . date("d.m.Y. H:i", strtotime($event_info->end_ts)) . ', ' . $event_info->venue_name }}
          @else
           {{ date("d.m.Y. H:i", strtotime($event_info->start_ts)) . ', ' . $event_info->venue_name }}
          @endif
        @else
          @if ($event_days_diff > 0)
            {{ date("d.m.Y. H:i", strtotime($event_info->start_ts)) . ' - ' . date("d.m.Y. H:i", strtotime($event_info->end_ts)) }}
          @else
            {{ date("d.m.Y. H:i", strtotime($event_info->start_ts)) }}
          @endif
        @endif
      </h3>
    </div>
  </div>

  <h1 class="krik-badges-desc">Nametags Generating</h1>

  <div id="krik-badges">

    {{ Form::open(array('url' => getenv('APP_URL') . '/events/' . $event_code . '/badges', 'method' => 'put', 'class' => 'form-horizontal', 'files' => true)) }}

    <div class="row krik-row">
      <div class="col-lg-9 col-md-12 krik-nametags-left">

        <div class="krik-badges-box">
          <h2 class="krik-badges-title">Nametag Type</h2>
        </div>

        <div class="krik-badges-box">
          <div class="form-group">
            <div class="col-md-4">
              <p class="krik-bages-type-title">90x50 mm</p>
              <div class="krik-badges-type" id="krik-nametag-type-small">
                <label for="nametag-type-small" class="krik-badges-label"><div class="krik-badges-90-50-img" style="background-image: url('{{ getenv('APP_URL') }}/assets/images/nametags/nametag-90-50.svg')"></div></label>
                <label for="nametag-type-small" class="krik-badges-label-footer">
                  <div class="rdio rdio-theme circle">
                    <input id="nametag-type-small" type="radio" name="nametag-type" value="nametag-type-small">
                    <label for="nametag-type-small" class="krik-badges-label-bottom">I'll use this nametag</label>
                  </div>
                </label>
              </div>
            </div>
            <div class="col-md-4">
              <p class="krik-bages-type-title">95x58 mm</p>
              <div class="krik-badges-type" id="krik-nametag-type-medium">
                <label for="nametag-type-medium" class="krik-badges-label"><div class="krik-badges-95-55-img" style="background-image: url('{{ getenv('APP_URL') }}/assets/images/nametags/nametag-95-55.svg')"></div></label>
                <label for="nametag-type-medium" class="krik-badges-label-footer">
                  <div class="rdio rdio-theme circle">
                    <input id="nametag-type-medium" type="radio" name="nametag-type" value="nametag-type-medium">
                    <label for="nametag-type-medium" class="krik-badges-label-bottom">I'll use this nametag</label>
                  </div>
                </label>
              </div>
            </div>
            <div class="col-md-4">
              <p class="krik-bages-type-title">95x95 mm</p>
              <div class="krik-badges-type" id="krik-nametag-type-large">
                <label for="nametag-type-large" class="krik-badges-label"><div class="krik-badges-95-95-img" style="background-image: url('{{ getenv('APP_URL') }}/assets/images/nametags/nametag-95-95.svg')"></div></label>
                <label for="nametag-type-large" class="krik-badges-label-footer">
                  <div class="rdio rdio-theme circle">
                    <input id="nametag-type-large" type="radio" name="nametag-type" value="nametag-type-large">
                    <label for="nametag-type-large" class="krik-badges-label-bottom">I'll use this nametag</label>
                  </div>
                </label>
              </div>
            </div>
          </div>
        </div>

        <div class="krik-badges-box">
          <h2 class="krik-badges-title">Information on the Nametags</h2>
          <div class="form-group krik-form-group">
            <div class="ckbox ckbox-theme krik-events-search-filter">
              <input id="name" name="name" value="name" type="checkbox">
              <label for="name">Name</label>
            </div>
          </div>
          <div class="form-group krik-form-group">
            <div class="ckbox ckbox-theme krik-events-search-filter">
              <input id="company-name" name="company-name" value="company-name" type="checkbox">
              <label for="company-name">Company Name</label>
            </div>
          </div>
          <div class="form-group krik-form-group">
            <div class="ckbox ckbox-theme krik-events-search-filter">
              <input id="country" name="country" value="country" type="checkbox">
              <label for="country">Country</label>
            </div>
          </div>
          <div class="form-group krik-form-group">
            <div class="ckbox ckbox-theme krik-events-search-filter">
              <input id="barcode" name="barcode" value="barcode" type="checkbox">
              <label for="barcode">Barcode</label>
            </div>
          </div>
        </div>

        <div class="krik-badges-box" id="krik-nametag-header" style="display: none;">
          <h2 class="krik-badges-title">Header</h2>
          <div class="col-lg-6 col-md-6 krik-nametag-header">
            <div class="rdio rdio-theme circle">
              <input id="nametag-header-colors" type="radio" name="nametag-header" value="nametag-header-colors">
              <label for="nametag-header-colors" class="krik-badges-label-bottom">Header has Background Color & Event Title</label>
            </div>
            <div class="nametag-header-colors" style="display: none;">
              <div class="input-group color-picker colorpicker-element nametags-colors-bg">
                {{ Form::text('nametags-colors-header-bg', $event_bg, array('class'=>'form-control', 'placeholder'=>'Header Background Color')) }}
                <span class="input-group-addon"><i @if($event_bg) style="background-color: {{ $event_bg }}" @else style="background-color: #4a4a4a" @endif></i></span>
              </div>
              <div class="input-group color-picker colorpicker-element nametags-text-color">
                {{ Form::text('nametags-colors-header-text', $event_color, array('class'=>'form-control', 'placeholder'=>'Header Text Color')) }}
                <span class="input-group-addon"><i @if($event_color) style="background-color: {{ $event_color }}" @else style="background-color: #4a4a4a" @endif></i></span>
              </div>
            </div>
          </div>
          <div class="col-lg-6 col-md-6 krik-nametag-header">
            <div class="rdio rdio-theme circle">
              <input id="nametag-header-img" type="radio" name="nametag-header" value="nametag-header-img">
              <label for="nametag-header-img" class="krik-badges-label-bottom">Header is Custom Image <span class="header-img-size"></span></label>
            </div>
            <div class="fileinput fileinput-new krik-header-img" data-provides="fileinput" style="display: none;">
              <span class="btn btn-default btn-file">
                <span class="fileinput-new">Upload Header Image</span>
                {{ Form::file('upload_header_img', array('id' => 'upload_header_img')) }}
                <span class="fileinput-filename"></span>
              <a href="#" class="close fileinput-exists" data-dismiss="fileinput" style="float: none">&times;</a>
            </div>
          </div>
          <div class="clearfix"></div>
        </div>

        <div class="krik-badges-box" id="krik-nametag-logos" style="display: none;">
          <h2 class="krik-badges-title">Logo(s) Below the Name (260 x 90 px)</h2>
          <div class="col-md-6">
            <div class="fileinput fileinput-new krik-file-logos" data-provides="fileinput">
              <span class="btn btn-default btn-file">
                <span class="fileinput-new">Upload Left Logo</span>
                {{ Form::file('upload_left_img', array('id' => 'upload_left_img')) }}
                <span class="fileinput-filename"></span>
              <a href="#" class="close fileinput-exists" data-dismiss="fileinput" style="float: none">&times;</a>
            </div>
          </div>
          <div class="col-md-6">
            <div class="fileinput fileinput-new krik-file-logos" data-provides="fileinput">
              <span class="btn btn-default btn-file">
                <span class="fileinput-new">Upload Right Logo</span>
                {{ Form::file('upload_right_img', array('id' => 'upload_right_img')) }}
                <span class="fileinput-filename"></span>
              <a href="#" class="close fileinput-exists" data-dismiss="fileinput" style="float: none">&times;</a>
            </div>
          </div>
          <div class="clearfix"></div>
        </div>

        <div class="krik-badges-box" id="krik-nametag-footer" style="display: none;">
          <h2 class="krik-badges-title">Footer</h2>
          <div class="col-lg-6 col-md-6 krik-nametag-footer">
            <div class="rdio rdio-theme circle">
              <input id="nametag-footer-colors" type="radio" name="nametag-footer" value="nametag-footer-colors">
              <label for="nametag-footer-colors" class="krik-badges-label-bottom">Footer has Text</label>
            </div>
            <div class="nametag-footer-colors" style="display: none;">
              <div class="input-group krik-footer-text">
                {{ Form::text('nametags-footer-text', null, array('class'=>'form-control', 'placeholder'=>'Footer Text')) }}
              </div>
              <div class="input-group color-picker colorpicker-element nametags-colors-bg">
                {{ Form::text('nametags-colors-footer-bg', $event_bg, array('class'=>'form-control', 'placeholder'=>'Footer Background Color')) }}
                <span class="input-group-addon"><i @if($event_bg) style="background-color: {{ $event_bg }}" @else style="background-color: #4a4a4a" @endif></i></span>
              </div>
              <div class="input-group color-picker colorpicker-element nametags-text-color">
                {{ Form::text('nametags-colors-footer-text', $event_color, array('class'=>'form-control', 'placeholder'=>'Footer Text Color')) }}
                <span class="input-group-addon"><i @if($event_color) style="background-color: {{ $event_color }}" @else style="background-color: #4a4a4a" @endif></i></span>
              </div>
            </div>
          </div>
          <div class="col-lg-6 col-md-6 krik-nametag-footer">
            <div class="rdio rdio-theme circle">
              <input id="nametag-footer-img" type="radio" name="nametag-footer" value="nametag-footer-img">
              <label for="nametag-footer-img" class="krik-badges-label-bottom">Footer is Custom Image (1190 x 170 px)</label>
            </div>
            <div class="fileinput fileinput-new krik-footer-img" data-provides="fileinput" style="display: none;">
              <span class="btn btn-default btn-file">
                <span class="fileinput-new">Upload Footer Image</span>
                {{ Form::file('upload_footer_img',  array('id' => 'upload_footer_img')) }}
                <span class="fileinput-filename"></span>
              <a href="#" class="close fileinput-exists" data-dismiss="fileinput" style="float: none">&times;</a>
            </div>
          </div>
          <div class="clearfix"></div>
        </div>

        <div class="krik-badges-box">
          <h2 class="krik-badges-title">Order of the Nametags</h2>
          <div class="form-group krik-form-group">
            <div class="rdio rdio-theme circle">
              <input id="order_registration" name="badges_order" value="registration" type="radio" checked>
              <label for="order_registration">Registration time</label>
            </div>
          </div>
          <div class="form-group krik-form-group">
            <div class="rdio rdio-theme circle">
              <input id="order_alphabet" name="badges_order" value="alphabet" type="radio">
              <label for="order_alphabet">Alphabetically by last name</label>
            </div>
          </div>
        </div>

        <div class="krik-badges-box krik-submit">
          {{ Form::submit('Generate Nametags', array('class' => 'btn btn-block krik-btn-green', 'name' => 'submit')) }}
        </div>

      </div>

      <div class="col-lg-3 col-md-12 krik-nametags-right">
        <div class="krik-badges-box">
          <h2 class="krik-badges-title">Leads Selection</h2>
        </div>

        <div class="krik-badges-box">
          <div class="krik-checkbox">
            <input type="checkbox" name="all-registered-contacts"> <span class="krik-checkbox-text">All Leads with Approved Registration</span>
          </div>
          <div class="krik-checkbox">
            <input type="checkbox" name="newly-registered-contacts"> <span class="krik-checkbox-text">Newly Leads with Approved Registration</span>
          </div>
        </div>

        <div class="krik-badges-box">
          <div class="krik-checkbox">
            <input type="checkbox" name="manually-choose-contacts"> <span class="krik-checkbox-text">Manually Choose Registered Leads</span>
          </div>
        </div>
        <div class="krik-badges-box" id="krik-nametags" style="display: none;">
          <div class="table-responsive">
            <table id="krik-nametag-table" class="table table-striped" cellspacing="0" width="100%">
              <thead>
                <tr>
                  <th style="max-width: 10px !important;"></th>
                  <th>Name & Surname</th>
                  {{-- <th>Company</th> --}}
                </tr>
              </thead>
            </table>
          </div>
          <script>
              $(function() {
                $('#krik-nametag-table').DataTable({
                  processing: false,
                  serverSide: false,
                  ajax: {
                    url: '{!! route('badges.data') !!}',
                    data: {
                      event_code: '{!! $event_code !!}',
                    }
                  },
                  info: false,
                  bSort: false,
                  paging: false,
                  autoWidth: false,
                  search: true,
                  scrollY: "300px",
                  scrollCollapse: true,
                  columns: [
                    {data: 'id',
                     name: 'registrations.id',
                     targets: 0,
                     orderable: false,
                     searchable: false,
                     width: "1px",
                     render: function(data, type, row) {
                       return '<div class="ckbox ckbox-success"><input name="manually-choosen-contacts[]" id="manually-' + row.id + '" type="checkbox" value="' + row.id + '"><label for="manually-' + row.id + '"></label></div>';
                    }},
                    {data: 'name_surname', name: 'name_surname', searchable: true, targets: 1},
                    // {data: 'company_name', name: 'leads.company_name', searchable: true, targets: 2}
                  ],
                  language: {
                    search: "_INPUT_",
                    searchPlaceholder: "Search",
                  },
                });
              });
          </script>
        </div>
      </div>
    </div>

    {{ Form::close() }}

  </div>

</div>
@endsection