@extends('admin.master')

@section('content')
<style>
    #video {
                border: 1px solid black;
                width: 320px;
                height: 240px;
            }

            #photo {
                border: 1px solid black;
                width: 320px;
                height: 240px;
            }


            .camera {
                width: 340px;
/*                display: inline-block;*/
            }

            .output {
                width: 340px;
/*                display: inline-block;*/
            }

            #startbutton {
                display: block;
                position: relative;
                margin-left: auto;
                margin-right: auto;
/*                bottom: 36px;
                padding: 5px;*/
/*                background-color: #6a67ce;
                border: 1px solid rgba(255, 255, 255, 0.7);
                font-size: 14px;
                color: rgba(255, 255, 255, 1.0);*/
                cursor: pointer;
            }

            .contentarea {
                font-size: 16px;
                font-family: Arial;
                text-align: center;
            }
</style>
  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <div class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1 class="m-0">Update your profile</h1>
          </div><!-- /.col -->
          
        </div><!-- /.row -->
      </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->

    <!-- Main content -->
    <section class="content">
      <div class="container-fluid">
          <div class='row'>
                    <!-- Message -->
@if (session('status'))
<div class="alert alert-success alert-dismissible" >
	<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
	<strong>{{ session('status') }}</strong>
</div>
@elseif(session('failed'))
<div class="alert alert-danger alert-dismissible" >
	<button type="button" class="btn-close" ddata-bs-dismiss="alert"></button>
  <strong>{{ session('failed') }}	</strong>
</div>
@endif              
              <form method="POST" action="/admin/form">
                    @csrf
                    
            <div class="card card-primary col-12 p-0">
              <div class="card-header">
                <h3 class="card-title">Details Updated by BCI (for any in this section please contact to BCI)</h3>
              </div>


              <!-- /.card-header -->
              <div class="card-body">
                
                  <div class="row">
                    
                                          <div class="col-sm-3">
                      <div class="form-group">
                        <label>Enrollment Number</label>
                        <label class="text-bold">Enrollment Number</label>
                        
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Enrollment Date</label>
                        <label class="text-bold">Enrollment Date</label>
                      </div>
                    </div>
                      
                      
                      <div class="col-sm-3">    
                      <!-- text input -->
                      <div class="form-group required">
                        <label class="control-label">Advocate Full Name</label>
                        
                        <div class="input-group">
                  <div class="input-group-prepend">

                    <select class="form-control @error('title') is-invalid @enderror" name="title">
                            <option value=''>select</option
                            @foreach($nameTitle as $nameTitle)
                                <option value="{{ $nameTitle->title }}" @if( $nameTitle->title ==old('title')) {{'selected'}}  @endif>{{ $nameTitle->title }}</option>
                            @endforeach
                        </select> 

                    
                  </div>
                        <input type="text" class="form-control @error('full_name_of_advocate') is-invalid @enderror" name="full_name_of_advocate" value="{{old('full_name_of_advocate')}}">
                        @error('title')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                        @error('full_name_of_advocate')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                
                </div>
                        
                        
                      </div>
                    </div>
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Advocate Name in Cause List</label>
                        <input type="text" class="form-control" name="name_of_advocate_in_cause_list" value="{{old('name_of_advocate_in_cause_list')}}">
                      </div>
                    </div>
                    


                    <div class="col-sm-3">
                      <div class="form-group required">
                        <label class="control-label">Date of Birth</label>

                        <div class="input-group date" id="date_of_birth" data-target-input="nearest">
                        <input type="text" class="form-control datetimepicker-input @error('date_of_birth') is-invalid @enderror" name="date_of_birth" data-target="#date_of_birth" value="{{old('date_of_birth')}}"/>
                        

                        <div class="input-group-append" data-target="#date_of_birth" data-toggle="datetimepicker">
                            <div class="input-group-text"><i class="far fa-calendar-alt"></i></div>
                        </div>
                        
                   

                        @error('date_of_birth')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                        
                    </div>
                
                        
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Gender</label>
                        <div>
                            
                          <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="M" id="gender1" name="gender" {{ old('gender')=="M" ? 'checked='.'"'.'checked'.'"' : '' }}  >
                          <label for="gender1" class="custom-control-label">Male</label>
                        </div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="F" id="gender2" name="gender" {{ old('gender')=="F" ? 'checked='.'"'.'checked'.'"' : '' }}>
                          <label for="gender2" class="custom-control-label">Female</label>
                        </div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="T" id="gender3" name="gender" {{ old('gender')=="T" ? 'checked='.'"'.'checked'.'"' : '' }} >
                          <label for="gender3" class="custom-control-label">Transgender</label>
                        </div>    
                            
                            
                            
                      </div>                                            
                        
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Caste</label>
                        <input type="text" class="form-control" name="caste" value="{{old('caste')}}">
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Father Name</label>
                        <input type="text" class="form-control" name="fathername" value="{{old('fathername')}}">
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Mother Name</label>
                        <input type="text" class="form-control" name="mothername" value="{{old('mothername')}}">
                      </div>
                    </div>  
                      
                             
                      
                             
                    
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Is Senior Advocate</label>
                        
                        <div>
                          <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="0" id="is_senior1" name="is_senior" {{ old('is_senior')=="0" ? 'checked='.'"'.'checked'.'"' : '' }} checked >
                          <label for="is_senior1" class="custom-control-label">No</label>
                        </div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="1" id="is_senior2" name="is_senior" {{ old('is_senior')=="1" ? 'checked='.'"'.'checked'.'"' : '' }}>
                          <label for="is_senior2" class="custom-control-label">Yes</label>
                        </div>   
                            
                            
                      </div>                                            
                       
                        
                      </div>
                    </div>
                      
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Local Language</label>
                        <select class="form-control" name="languages_id">
                            <option value=''>select</option
                            @foreach($languages as $languages)
                                <option value="{{ $languages->languages_id }}" @if( $languages->languages_id ==old('languages_id')) {{'selected'}}  @endif>{{ $languages->language }}</option>
                            @endforeach
                        </select>
                      </div>
                    </div>                              
                    
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Name of Advocate in Local Language</label>
                        <input type="text" class="form-control" name="name_of_advocate_in_local_language" value="{{old('name_of_advocate_in_local_language')}}">
                      </div>
                    </div>                               
                      
                           
                      
                      
                    
                        <div class="col-sm-3">
                      <div class="form-group">
                        <label>Is Dead</label>
                        
                       <div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input isdead" type="radio" value="0" id="isdead1" name="isdead" {{ old('isdead')=="0" ? 'checked='.'"'.'checked'.'"' : '' }} checked>
                          <label for="isdead1" class="custom-control-label">No</label>
                        </div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input isdead" type="radio" value="1" id="isdead2" name="isdead" {{ old('isdead')=="1" ? 'checked='.'"'.'checked'.'"' : '' }} >
                          <label for="isdead2" class="custom-control-label">Yes</label>
                        </div>   
                      </div>                                            
                       
                        
                      </div>
                    </div>
                      
                    <div class="col-sm-3 dateofdead_div d-none">
                      <div class="form-group">
                        <label>Date of Death</label>
                        
                        <div class="input-group date" id="dateofdead" data-target-input="nearest">
                        <input type="text" class="form-control datetimepicker-input" name="dateofdead" data-target="#dateofdead" value="{{old('dateofdead')}}"/>
                        <div class="input-group-append" data-target="#dateofdead" data-toggle="datetimepicker">
                            <div class="input-group-text"><i class="far fa-calendar-alt"></i></div>
                        </div>
                    </div>
                        
                      </div>
                    </div>
                      
                      

                      
                      
                      
                      

                    </div>                               
                    
                    
                  
                
              </div>
              <!-- /.card-body -->
          
              
              

                
              
            </div>


                 
                    
                    <div class="card card-primary col-12 p-0">
              <div class="card-header">
                <h3 class="card-title">Capture Photo (Remove mask, spectacles or any other face covering)</h3>
              </div>


              <!-- /.card-header -->
              <div class="card-body">
                

                  <div class="row col-sm-12">
                    
                      
                          <div class="col-sm-12 contentarea">
                                            <div class="col-sm-4 camera d-inline">
                                                <video id="video">Video stream not available.</video>
                                            </div>
                                            <div class="col-sm-4"><button type="button" class="btn btn-primary" id="startbutton">Take photo</button></div>
                                            <canvas id="canvas" class="my_canvas d-none"></canvas>
                                            <div class="col-sm-4 output d-inline">
                                                <img id="photo" alt="The screen capture will appear in this box." value="hi">
                                            </div>
                          </div>                        
                        
                      
<!--                    <div class="row show_msg col-12 mb-3"></div>
                        -->
                        

                    </div>                      
                      

                 </div>                               
                    
                    
                  
                
              </div>
              <!-- /.card-body -->
                

            
                    
            
                    
                    
            <div class="card card-primary col-12 p-0">
              <div class="card-header">
                <h3 class="card-title">General Details</h3>
              </div>


              <!-- /.card-header -->
              <div class="card-body">
                
                  <div class="row">
                    
                                          <div class="col-sm-3">
                      <div class="form-group required">
                        <label class="control-label">Enrollment Number</label>
                        <input type="text" class="form-control @error('enrolment_number') is-invalid @enderror" value="{{old('enrolment_number')}}" name="enrolment_number">
                        @error('enrolment_number')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group required">
                        <label class="control-label">Enrollment Date</label>
                        
                        <div class="input-group date" id="enrolment_date" data-target-input="nearest">
                            <input type="text" class="form-control datetimepicker-input @error('enrolment_date') is-invalid @enderror" value="{{old('enrolment_date')}}" name="enrolment_date" data-target="#enrolment_date"/>
                        <div class="input-group-append" data-target="#enrolment_date" data-toggle="datetimepicker">
                            <div class="input-group-text"><i class="far fa-calendar-alt"></i></div>
                        </div>
                            @error('enrolment_date')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                    </div>
                        
                      </div>
                    </div>
                      
                      
                      <div class="col-sm-3">
                      <!-- text input -->
                      <div class="form-group required">
                        <label class="control-label">Advocate Full Name</label>
                        
                        <div class="input-group">
                  <div class="input-group-prepend">
                    
                    <select class="form-control @error('title') is-invalid @enderror" name="title">
                            <option value=''>select</option
                            @foreach($nameTitle as $nameTitle)
                                <option value="{{ $nameTitle->title }}" @if( $nameTitle->title ==old('title')) {{'selected'}}  @endif>{{ $nameTitle->title }}</option>
                            @endforeach
                        </select> 

                    
                  </div>
                        <input type="text" class="form-control @error('full_name_of_advocate') is-invalid @enderror" name="full_name_of_advocate" value="{{old('full_name_of_advocate')}}">
                        @error('title')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                        @error('full_name_of_advocate')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                
                </div>
                        
                        
                      </div>
                    </div>
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Advocate Name in Cause List</label>
                        <input type="text" class="form-control" name="name_of_advocate_in_cause_list" value="{{old('name_of_advocate_in_cause_list')}}">
                      </div>
                    </div>
                    


                    <div class="col-sm-3">
                      <div class="form-group required">
                        <label class="control-label">Date of Birth</label>

                        <div class="input-group date" id="date_of_birth" data-target-input="nearest">
                        <input type="text" class="form-control datetimepicker-input @error('date_of_birth') is-invalid @enderror" name="date_of_birth" data-target="#date_of_birth" value="{{old('date_of_birth')}}"/>
                        

                        <div class="input-group-append" data-target="#date_of_birth" data-toggle="datetimepicker">
                            <div class="input-group-text"><i class="far fa-calendar-alt"></i></div>
                        </div>
                        
                   

                        @error('date_of_birth')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                        
                    </div>
                
                        
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Gender</label>
                        <div>
                            
                          <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="M" id="gender1" name="gender" {{ old('gender')=="M" ? 'checked='.'"'.'checked'.'"' : '' }}  >
                          <label for="gender1" class="custom-control-label">Male</label>
                        </div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="F" id="gender2" name="gender" {{ old('gender')=="F" ? 'checked='.'"'.'checked'.'"' : '' }}>
                          <label for="gender2" class="custom-control-label">Female</label>
                        </div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="T" id="gender3" name="gender" {{ old('gender')=="T" ? 'checked='.'"'.'checked'.'"' : '' }} >
                          <label for="gender3" class="custom-control-label">Transgender</label>
                        </div>    
                            
                            
                            
                      </div>                                            
                        
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Caste</label>
                        <input type="text" class="form-control" name="caste" value="{{old('caste')}}">
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Father Name</label>
                        <input type="text" class="form-control" name="fathername" value="{{old('fathername')}}">
                      </div>
                    </div>

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Mother Name</label>
                        <input type="text" class="form-control" name="mothername" value="{{old('mothername')}}">
                      </div>
                    </div>  
                      
                             
                      
                             
                    
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Is Senior Advocate</label>
                        
                        <div>
                          <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="0" id="is_senior1" name="is_senior" {{ old('is_senior')=="0" ? 'checked='.'"'.'checked'.'"' : '' }} checked >
                          <label for="is_senior1" class="custom-control-label">No</label>
                        </div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input" type="radio" value="1" id="is_senior2" name="is_senior" {{ old('is_senior')=="1" ? 'checked='.'"'.'checked'.'"' : '' }}>
                          <label for="is_senior2" class="custom-control-label">Yes</label>
                        </div>   
                            
                            
                      </div>                                            
                       
                        
                      </div>
                    </div>
                      
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Local Language</label>
                        <select class="form-control" name="languages_id">
                            <option value=''>select</option
                            @foreach($languages as $languages)
                                <option value="{{ $languages->languages_id }}" @if( $languages->languages_id ==old('languages_id')) {{'selected'}}  @endif>{{ $languages->language }}</option>
                            @endforeach
                        </select>
                      </div>
                    </div>                              
                    
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Name of Advocate in Local Language</label>
                        <input type="text" class="form-control" name="name_of_advocate_in_local_language" value="{{old('name_of_advocate_in_local_language')}}">
                      </div>
                    </div>                               
                      
                           
                      
                      
                    
                        <div class="col-sm-3">
                      <div class="form-group">
                        <label>Is Dead</label>
                        
                       <div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input isdead" type="radio" value="0" id="isdead1" name="isdead" {{ old('isdead')=="0" ? 'checked='.'"'.'checked'.'"' : '' }} checked>
                          <label for="isdead1" class="custom-control-label">No</label>
                        </div>
                        <div class="custom-control custom-radio d-inline">
                          <input class="custom-control-input isdead" type="radio" value="1" id="isdead2" name="isdead" {{ old('isdead')=="1" ? 'checked='.'"'.'checked'.'"' : '' }} >
                          <label for="isdead2" class="custom-control-label">Yes</label>
                        </div>   
                      </div>                                            
                       
                        
                      </div>
                    </div>
                      
                    <div class="col-sm-3 dateofdead_div d-none">
                      <div class="form-group">
                        <label>Date of Death</label>
                        
                        <div class="input-group date" id="dateofdead" data-target-input="nearest">
                        <input type="text" class="form-control datetimepicker-input" name="dateofdead" data-target="#dateofdead" value="{{old('dateofdead')}}"/>
                        <div class="input-group-append" data-target="#dateofdead" data-toggle="datetimepicker">
                            <div class="input-group-text"><i class="far fa-calendar-alt"></i></div>
                        </div>
                    </div>
                        
                      </div>
                    </div>
                      
                      

                      
                      
                      
                      

                    </div>                               
                    
                    
                  
                
              </div>
              <!-- /.card-body -->
          
              
              

                
              
            </div>


                    
            <div class="card card-primary col-12 p-0">
              <div class="card-header">
                <h3 class="card-title">Communication Details</h3>
              </div>


              <!-- /.card-header -->
              <div class="card-body">
                
                  <div class="row">
                                                   <div class="col-sm-3">
                      <div class="form-group required">
                        <label class="control-label">Mobile Number</label>
                        <div class="input-group">
                    <div class="input-group-prepend">
                      <span class="input-group-text"><i class="fas fa-mobile"></i></span>
                    </div>
                                            <input type="text" class="form-control @error('mobile') is-invalid @enderror" name="mobile" value="{{old('mobile')}}">
                                            
                        @error('mobile')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                  </div>
                        
                      </div>
                    </div>
                      
                    
                    <div class="col-sm-3">
                      <div class="form-group required">
                        <label class="control-label">e-Mail Address</label>
                           <div class="input-group">
                  <div class="input-group-prepend">
                    <span class="input-group-text"><i class="fas fa-envelope"></i></span>
                  </div>
                  <input type="email" class="form-control @error('email') is-invalid @enderror" name="email" placeholder="Email" value="{{old('email')}}">
                  
                        @error('email')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
                </div>
                        
                      </div>
                    </div>
                    
                      <div class="col-sm-3">
                      <div class="form-group">
                        <label>Landline Number</label>
                        <div class="input-group">
                    <div class="input-group-prepend">
                      <span class="input-group-text"><i class="fas fa-phone"></i></span>
                    </div>
                                            <input type="text" class="form-control" name="landline_number" value="{{old('landline_number')}}">
                  </div>
                        
                        

                      </div>
                    </div>                      
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Whatsapp Number</label>
                        
                        
                        
                                        <div class="input-group mb-3">
                  <div class="input-group-prepend">
                    <span class="input-group-text"><i class="fab fa-whatsapp"></i></span>
                  </div>
                  <input type="text" class="form-control" name="whatsapp" placeholder="whatapp number" value="{{old('whatsapp')}}">
                </div>
                        
                        
                      </div>
                    </div>                    
                                                                     
                      

                 </div>                               
                    
                    
                  
                
              </div>
              <!-- /.card-body -->
                

            </div>
                    
                    

            <div class="card card-primary col-12 p-0">
              <div class="card-header">
                <h3 class="card-title">Residential Details</h3>
              </div>


              <!-- /.card-header -->
              <div class="card-body">
                
                  <div class="row">
                                                 
                      
                                                    
                    
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Residence Pincode</label>
                        <input type="text" class="form-control" name="residence_pincode">
                      </div>
                    </div>                               

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Residence Address</label>
                        <input type="text" class="form-control" name="residence_address_of_advocate">
                      </div>
                    </div>
                      
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Residence Address in Local Language</label>
                        <input type="text" class="form-control" name="residence_address_of_advocate_in_local_language">
                      </div>
                    </div>  

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Residence State</label>
                        <input type="text" class="form-control" name="residence_state">
                      </div>
                    </div>                                                     
                                                   
                      <div class="col-sm-3">
                      <div class="form-group">
                        <label>Residence District</label>
                        <input type="text" class="form-control" name="residence_district">
                      </div>
                    </div>                               
                      
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Residence Tehsil</label>
                        <input type="text" class="form-control" name="residence_tehsil">
                      </div>
                    </div>
                      
                      <div class="col-sm-3">
                      <div class="form-group">
                        <label>Residence Village</label>
                        <input type="text" class="form-control" name="residence_village">
                      </div>
                    </div>                               
                      

                    </div>                               
                    
                    
                  
                
              </div>
              <!-- /.card-body -->
                

            </div>
                    
            <div class="card card-primary col-12 p-0">
              <div class="card-header">
                <h3 class="card-title">Office Details</h3>
              </div>


              <!-- /.card-header -->
              <div class="card-body">
                
                  <div class="row">
                                                 
                      
                                                    
                    
                       
                                          <div class="col-sm-3">
                      <div class="form-group">
                        <label>Office Pincode</label>
                        <input type="text" class="form-control" name="office_pincode">
                      </div>
                    </div>                               

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Office Address</label>
                        <input type="text" class="form-control" name="office_address">
                      </div>
                    </div>                               
                      
                                          <div class="col-sm-3">
                      <div class="form-group">
                        <label>Office Address in local language</label>
                        <input type="text" class="form-control" name="office_address_in_local_language">
                      </div>
                    </div>                               

                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Office State</label>
                        <input type="text" class="form-control" name="office_state">
                      </div>
                    </div>                                                     
                                                   
                      <div class="col-sm-3">
                      <div class="form-group">
                        <label>Office District</label>
                        <input type="text" class="form-control" name="office_district">
                      </div>
                    </div>                               
                      
                    <div class="col-sm-3">
                      <div class="form-group">
                        <label>Office Tehsil</label>
                        <input type="text" class="form-control" name="office_tehsil">
                      </div>
                    </div>
                      
                      <div class="col-sm-3">
                      <div class="form-group">
                        <label>Office Village</label>
                        <input type="text" class="form-control" name="office_village">
                      </div>
                    </div>  
                    
                      
                      

                      
                      
                      
                      

                    </div>                               
                    
                    
                  
                
              </div>
              <!-- /.card-body -->
                

                <div class="card-footer">
                    
                  <button type="submit" class="btn btn-primary">Save</button>

                </div>
                <!-- /.card-footer -->
              
            </div>


                          </form>
            <!-- /.card -->
            <!-- general form elements disabled -->
          </div>
      </div><!-- /.container-fluid -->
    </section>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->
  <script>
  
//        $(document).on('click', '.isdead', function () {
//            var flag = $(this).val();
//            if(flag == 1){
//                $(".dateofdead_div").removeClass("d-none");
//            }else{
//                $(".dateofdead_div").addClass("d-none");                        
//            }                    

    
 //});
        /* JS comes here */
        (function() {

            var width = 320; // We will scale the photo width to this
            var height = 0; // This will be computed based on the input stream

            var streaming = false;

            var video = null;
            var canvas = null;
            var photo = null;
            var startbutton = null;

            function startup() {
                video = document.getElementById('video');
                canvas = document.getElementById('canvas');
                photo = document.getElementById('photo');
                startbutton = document.getElementById('startbutton');

                navigator.mediaDevices.getUserMedia({
                    video: true,
                    audio: false
                })
                    .then(function(stream) {
                        video.srcObject = stream;
                        video.play();
                    })
                    .catch(function(err) {
                        console.log("An error occurred: " + err);
                    });

                video.addEventListener('canplay', function(ev) {
                    if (!streaming) {
                        height = video.videoHeight / (video.videoWidth / width);

                        if (isNaN(height)) {
                            height = width / (4 / 3);
                        }

                        video.setAttribute('width', width);
                        video.setAttribute('height', height);
                        canvas.setAttribute('width', width);
                        canvas.setAttribute('height', height);
                        streaming = true;
                    }
                }, false);

                startbutton.addEventListener('click', function(ev) {
                    takepicture();
                    ev.preventDefault();
                }, false);

                clearphoto();
            }


            function clearphoto() {
                var context = canvas.getContext('2d');
                context.fillStyle = "#AAA";
                context.fillRect(0, 0, canvas.width, canvas.height);

                var data = canvas.toDataURL('image/png');
                photo.setAttribute('src', data);
            }

            function takepicture() {
                var context = canvas.getContext('2d');
                if (width && height) {
                    canvas.width = width;
                    canvas.height = height;
                    context.drawImage(video, 0, 0, width, height);

                    var data = canvas.toDataURL('image/png');
                    photo.setAttribute('src', data);

//                var filename = "RecordedVideo.png";
//                var fd1 = new FormData();
//
//                fd1.append("file", ph_image, filename);

                console.log(fd1);
                return false;
console.log(baseSixtyFourData);
return false;
                } else {
                    clearphoto();
                }
            }

            window.addEventListener('load', startup, false);
        })();
</script> 
  @endsection