@extends('main')

@section('css')
<link href="{{ asset('/css/bootstrapValidator.min.css')}}" rel="stylesheet">
@endsection

@section('content')
 <section class="main_content talent_defines">
    <div class="container">
      @if (Session::get('succ_msg'))
             <div class="alert alert-success clearfix col-sm-12">
                 <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                   <span aria-hidden="true">&times;</span>
                 </button>
                  {{Session::get('succ_msg')}}
              </div>
           @endif
      <div class="row">
          
             
           
        <div class="col-md-1"></div>
        <div class="col-md-10">
          <div class="row">
            <div class="col-sm-12">
              <h1 class="signup-step-1-head">What defines you best ? </h1>
              <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
                Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
                when an unknown printer took a galley of type and scrambled it to make a type specimen book. 
                It has survived not only five centuries</p>
            </div>

            <div class="clearfix"></div>
              @if ($validation_errors && count($validation_errors) > 0)
                    <div class="alert alert-danger clearfix">
                        <strong>Whoops!</strong> There were some problems with your input.<br><br>
                        <ul>
                            @foreach ($validation_errors as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif
            <div class="clearfix"></div>
            
            <form name="profile_step1" id="profile_step1" method="post" onsubmit="return check_step1()" >
                <div role="tabpanel">
                  <div class="col-sm-3 col-lg-2"> 
                    <!-- Nav tabs -->
                    <ul class="nav nav-tabs" role="tablist">
                      @if($individual)
                      <li role="presentation" class="active"><a href="#individual" id="ind" aria-controls="individual" role="tab" data-toggle="tab"><div class="pfo-pic-70"><img src="{{URL::asset('uploads/profile_images/default-profile.png')}}"  class="img-responsive" /></div>Individual</a></li>
                      @endif
                      @if($organization)
                      <li role="presentation" class="active"><a href="#organization" id="org" aria-controls="organization" role="tab" data-toggle="tab"><div class="pfo-pic-70"><img src="{{URL::asset('uploads/profile_images/default-profile.png')}}"  class="img-responsive" /></div>Organization</a></li>
                      @endif
                    </ul>
                  </div>
                  <div class="col-sm-9 col-lg-9"> 
                  <div id="profile_step1_errors" class="txt-red"></div>
                    <!-- Tab panes -->
                    <div class="tab-content">
                      @if($individual)
                      <div role="tabpanel" class="tab-pane-ind active" id="individual">
                        
                        <div class="btn-group" data-toggle="buttons">
                          <input type="text" class="form-control talent_search" placeholder="Search . . .">
                          @foreach ($individual as $i)
                              <label class="btn btn-primary talent_categories">
                                  <input type="checkbox" autocomplete="off" name="indv[]" value="{{$i->id}}" class="talent_cat">
                                {{$i->name}} </label>
                           @endforeach 
                        </div>
                      </div>
                      @endif
                      @if($organization)
                      <div role="tabpanel" class="tab-pane-org" id="organization">
                        <div class="btn-group" data-toggle="buttons">
                          <input type="text" class="form-control organization_search" placeholder="Search . . .">
                          @foreach ($organization as $o)
                              <label class="btn btn-primary organization_categories">
                                  <input type="checkbox" autocomplete="off" name="org[]" value="{{$o->id}}" class="organiz_cat">
                                {{$o->name}} </label>
                           @endforeach 
                        </div>
                      </div>
                      @endif
                    </div>
                    <div class="sign-up-step-1">
                      <button type="submit" class="btn go-to-profile" id="goto_profile" value="goto_profile">Goto Profile</button>
    	           <button type="submit" class="btn signup-setp1-next " id="profile_next" name="next" value="step1">Next >></button>
                </div>
                  </div>
                  <div class="clearfix"></div>
                </div>
                   <input type="hidden" name="_token" value="{{ csrf_token() }}">
                   <input type="hidden" name="profile_save_type" id="profile_save_type" value="next">
    	       
            </form>
          </div>
        </div>
      </div>
    </div>
  </section>
@endsection
@section('js')
<script src="{{ asset('js/bootstrapValidator.min.js')}}"></script>
<script src="{{ asset('js/maskedinput/jquery.maskedinput.min.js')}}"></script>
<script src="{{ asset('js/validation.js')}}"></script>
<script type="text/javascript">
    $(function(){
        if($('.talent_cat').length=0){$('.tab-pane-org').hide();}
        
        $('#ind').click(function(){
           $('.tab-pane-org').hide();
            $('.tab-pane-ind').show();
            $('.organization_categories').removeClass('active');
            $('.organiz_cat').attr('checked', false); // Unchecks it
        });
        $('#org').click(function(){
           $('.tab-pane-ind').hide();
           $('.tab-pane-org').show();
           $('.talent_categories').removeClass('active');
           $('.talent_cat').attr('checked', false); // Unchecks it
        });
    });
</script>
@endsection