@extends('_layout.sessions')

@section('title') Register
@endsection

@section('modals')
@include('_layout.partials.infomodal')
<div id="progressModal" class="modal modal-info fade" tabindex="-1" role="dialog" data-keyboard="false" data-backdrop="static">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel">Uploading. Please wait...</h4>
            </div>
            <div id="container" class="modal-body">
                <div id="filelist"></div>
                <div id="uploadProgressContainer" class="progress xs">
                    <div id="uploadProgress" class="progress-bar progress-bar-green" style="width: 0%;">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection


@section('content')
{{ Form::open(['route' => 'postRegister', 'method' => 'post', 'class' => 'login-form' ,'style' => 'display: block;', 'id' => 'registerForm']) }}
  {!! Form::hidden("ndaFileId",-1,['id' => 'ndaFileId']) !!}
  {!! Form::hidden("salesAgreementFileId",-1,['id' => 'salesAgreementFileId']) !!}
  <h3 class="form-title font-green">Register</h3>
  <div class="form-group">
    {!! Form::text('email', null, ['placeholder' =>'Email', 'class' => 'form-control', 'required' => 'required']) !!}
  </div>

  <div class="form-group">
    {!! Form::text('first_name', null, ['placeholder' =>'First name', 'class' => 'form-control', 'required' => 'required']) !!}
  </div>
  <div class="form-group">
    {!! Form::text('last_name', null, ['placeholder' =>'Last name', 'class' => 'form-control', 'required' => 'required']) !!}
  </div>

  <div class="form-group">
    {!! Form::text('phone', null, ['placeholder' =>'Phone', 'class' => 'form-control', 'required' => 'required']) !!}
  </div>

  <div class="form-group">
    {!! Form::password('password', ['placeholder' =>'Password', 'class' => 'form-control', 'required' => 'required']) !!}
  </div>
  <div class="form-group">
    {!! Form::password('password_confirmation', ['placeholder' =>'Retype Password', 'class' => 'form-control', 'required' => 'required']) !!}
  </div>
  <div class="form-group" id="ndaGroup">
    <div class="input-group">
      {{ Form::text('nda',null, ['placeholder' =>'Signed NDA', 'class' => 'form-control','disabled' =>'disabled','id' =>'ndaFile']) }}
      <span class="input-group-btn">
        <button id="selectNDAFileButton" class="btn btn-success uppercase" type="button" style="height: 43px">Select</button>
      </span>
    </div>
  </div>
  <div class="form-group" id="salesAgreementGroup">
    <div class="input-group">
      {{ Form::text('sales_agreement',null, ['placeholder' =>'Signed sales agreement', 'class' => 'form-control','disabled' =>'disabled','id' =>'salesAgreementFile']) }}
      <span class="input-group-btn">
        <button id="selectSalesAgreementFileButton" class="btn btn-success uppercase" type="button" style="height: 43px">Select</button>
      </span>
    </div>
  </div>

  <div class="row form-actions">
    <div class="col-xs-4">
      <button type="submit" class="btn btn-success uppercase" id="saveButton">Submit</button>  
    </div>  
    <div class="col-xs-8" style="text-align: right;">
      <div><a href="{{asset('files/MMS_NDA.pdf')}}" target="blank">Download NDA</a></div>
      <div><a href="{{asset('files/Sales_Representative_Agreement.pdf')}}" target="blank">Download sales agreement</a></div>
    </div>
  </div> 
  <div class="create-account">
    <p>
      <a href="{{route('login')}}">Already have a valid account?</a>
    </p>
  </div>

{{ Form::close() }}

@endsection

@section('page-script')
<script src="{{asset('assets/js/plupload.full.min.js')}}"></script>
<script type="text/javascript">

  if ( $('#ndaFileId').val()!='-1')
      $('#ndaGroup').hide();
  if ($('#salesAgreementFileId').val()!='-1')
      $('#salesAgreementGroup').hide();
    
  var uploader1 = new plupload.Uploader({
      runtimes : 'html5',
      browse_button : 'selectNDAFileButton',
      container: document.getElementById('container'),
      filters:{mime_types: [{title : "Pdf documents", extensions : "pdf"}]},
      multi_selection: false,
      chunk_size: '2048kb',
      rename: false,
      url : "{{route('uploadContractFiles')}}",
      headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
      init: {
          FilesAdded: function(up, files) {
              plupload.each(files, function(file) {
                  document.getElementById('filelist').innerHTML = '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></div>';
                  $('#ndaFile').val(file.name);
              });
          },
   
          UploadProgress: function(up, file) {
              $('#uploadProgress').width(file.percent+'%');
          },

          FileUploaded: function(up, file, res) 
          {
              var errors=false;
              try {
                  var result = JSON.parse(res.response);
                  if (result.result.status!='success')
                      errors=true;
              } catch(err)
              {
                  errors=true;
              }
              if (errors)
              {
                  $('#progressModal').modal('hide');
                  $('#infoModal .modal-body').text('Error uploading file. Please try again.');
                  $('#infoModal').modal('show');
              }
              else
              {
                $('#ndaFileId').val(result.result.file);
                uploader2.start();
                //$('#registerForm').submit();
              }
          },
      }
  });
  uploader1.init();

  var uploader2 = new plupload.Uploader({
      runtimes : 'html5',
      browse_button : 'selectSalesAgreementFileButton',
      container: document.getElementById('container'),
      filters:{mime_types: [{title : "Pdf documents", extensions : "pdf"}]},
      multi_selection: false,
      chunk_size: '2048kb',
      rename: false,
      url : "{{route('uploadContractFiles')}}",
      headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
      init: {
          FilesAdded: function(up, files) {
              plupload.each(files, function(file) {
                  document.getElementById('filelist').innerHTML = '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></div>';
                  $('#salesAgreementFile').val(file.name);
              });
          },
   
          UploadProgress: function(up, file) {
              $('#uploadProgress').width(file.percent+'%');
          },

          FileUploaded: function(up, file, res) 
          {
              var errors=false;
              try {
                  var result = JSON.parse(res.response);
                  if (result.result.status!='success')
                      errors=true;
              } catch(err)
              {
                  errors=true;
              }
              if (errors)
              {
                  $('#progressModal').modal('hide');
                  $('#infoModal .modal-body').text('Error uploading file. Please try again.');
                  $('#infoModal').modal('show');
              }
              else
              {
                $('#salesAgreementFileId').val(result.result.file);
                $('#registerForm').submit();
              }
          },
      }
  });
  uploader2.init();

$('#saveButton').on('click', function (e) {
  e.preventDefault();
  //console.log(uploader.files.length,$('#ndaFileId').val());
  if ($('#registerForm')[0].reportValidity() && $('#ndaFileId').val()!='-1' && $('#salesAgreementFileId').val()!='-1')
    $('#registerForm').submit();
  else 
    if (uploader1.files.length==1 && uploader2.files.length==1 && $('#registerForm')[0].reportValidity())
    {
      $('#progressModal').modal('show');
      uploader1.start();
    }
  return false;
});


</script>
@endsection

@section('page-css')
<meta name="csrf-token" content="{{ csrf_token() }}">
@endsection