<div class="row">
	<div class="col-md-12" id="printtopscroll">
      
		<h2 class='h3'>Journal Proposal</h2>
        @php
        			$reg_type = "journalproposal";
        @endphp	
  	<hr>

  	 <div class="card bigbox-hvr-slow">
		  <div class="card-body">
	   
<form name="first" method="post" action="{{ route('proposal') }}" enctype="multipart/form-data">    
	@csrf
 <div class="row">
 	<div class="col-md-12">
 		
		@if ($errors->any())
		<div class="form-row">
		<div class="col-md-12 alert alert-danger px-3 pt-3">
			<strong>Whoops!</strong> There were some problems with your input.<br>
			<ul class="px-3 pt-2 m-0 ">
				@foreach ($errors->all() as $error)
					<li>{{ $error }}</li>
				@endforeach
			</ul>
		</div>
		</div>
		@endif

	  @if ($message = Session::get('success'))
		<div class="alert alert-success alert-dismissible fade show" role="alert">
			{!! $message !!}
			<button type="button" class="close" data-dismiss="alert" aria-label="Close">
			<span aria-hidden="true">&times;</span>
			</button>
		</div>
	  @endif

	    <input type="hidden" name="reg_type" value="{{$reg_type}}">
	    <input type="hidden" name="journal_id" value="{{$journal->journal_id}}">

		<div class="form-row">

			<div class="form-group col-md-4">
				<label for="edit-last_name">Title: *</label>
				<select class="form-control w-100" id="title" name="title"  required = 'required'>
					<option value="Mr." @if(old('title') == 'Mr.') {{ 'selected' }} @endif>Mr. </option>
					<option value="Mrs." @if(old('title') == 'Mrs.') {{ 'selected' }} @endif>Mrs.</option>
					<option value="Ms." @if(old('title') == 'Ms.') {{ 'selected' }} @endif>Ms</option>
					<option value="Prof." @if(old('title') == 'Prof.') {{ 'selected' }} @endif>Prof.</option>
					<option value="Dr." @if(old('title') == 'Dr.') {{ 'selected' }} @endif>Dr.</option>	
				</select>
			</div>

			<div class="form-group col-md-4">
				<label class="control-label">First Name: *</label>
			<input type="text" maxlength="50" name="first_name" size="60" value="{{ old("first_name") }}" class="form-control" required="required">
			</div>
			
			<div class="form-group col-md-4">
				<label for="edit-last_name">Last Name: *</label>
				<input type="text" maxlength="100" name="last_name" id="" size="60" value="{{ old("last_name") }}" class="form-control" required="required">
			</div>

			<div class="form-group col-md-4">
				<label for="edit-email">Email: *</label>
				<input type="email" maxlength="50" name="email" id="" size="60" value="{{ old("email") }}" class="form-control" required="required">
			</div>

			<div class="form-group col-md-4">
				<label class="control-label">City: *</label>
			<input type="text" maxlength="50" name="city" size="60" value="{{ old("city") }}" class="form-control" required="required">
			</div>

			<div class="form-group col-md-4">
				<label for="edit-last_name">Country: *</label>
				<select class="form-control w-100" id="country" name="country"  required = 'required'>
					<option value="">Country</option>
					@foreach ($country as $countries)
					<option value="{{$countries->country_id}}" {{ old("country") == $countries->country_id ? "selected" : "" }}> {{$countries->printable_name}}</option>
					@endforeach
				</select>
			</div>

			<div class="form-group col-md-6">
				<label class="control-label">Field of expertise: *</label>
				<textarea class="form-control" rows="2" name="field_of_experties" required>{{ old("field_of_experties") }}</textarea>
			</div>

			<div class="form-group col-md-6">
				<label for="edit-email">Affiliation: *</label>
				<textarea class="form-control" rows="2" name="affiliation" required>{{ old("affiliation") }}</textarea>
			</div>

			<div class="form-group col-md-6">
				<label for="edit-email">H-index: *</label>
				<input type="text" maxlength="50" name="hindex" id="" size="60" value="{{ old("hindex") }}" class="form-control" required>
			</div>			

			<div class="form-group col-md-6">
				<label for="edit-email">Tentative Title of New Journal Proposal: *</label>
				<input type="text" name="title_proposed_journal" value="{{ old("title_proposed_journal") }}" class="form-control" required>
			</div>	

			<div class="form-group col-md-6">
				<label class="control-label">Aims and Scope: *</label>
				<textarea class="form-control" rows="2" name="aims_and_scope" required>{{ old("aims_and_scope") }}</textarea>
			</div>

			<div class="form-group col-md-6">
				<label for="edit-email">Comment:</label>
				<textarea class="form-control" rows="2" name="comments">{{ old("comments") }}</textarea>
			</div>

			<div class="form-group col-md-12"> 
				<div class="input-group mb-3">
				  <div class="input-group-prepend">
				    <span class="input-group-text" id="inputGroupFileAddon01">Upload CV</span>
				  </div>
				  <div class="custom-file">
				    <input type="file" name="cv[]" class="custom-file-input" id="inputGroupFile01" aria-describedby="inputGroupFileAddon01" accept=".png,.gif,.jpg,.jpeg,.pdf,.doc,.docx">
				    <label class="custom-file-label mt-0" for="inputGroupFile01">Choose file</label>
				  </div>
				</div>

			</div>

			<div class="form-group col-md-12">
              <div class="form-group row mt-3 w-100"> 
                    
                      <div class="col-auto mx-auto w-100 d-flex ">
                          <div class="col-md-6 text-right">
                              <div class="captcha">                                       
                                  <span>{!! captcha_img() !!}</span>             
                              </div>
                          </div>
                          <div class="col-md-6">                                        
                              <button type="button" class="btn btn-danger" class="refresh-captcha" id="refresh-captcha">
                                  &#x21bb;
                              </button> 
                          </div>
                      </div>
                      <div class="form-group my-2 mx-auto">
                          <input id="captcha" type="text" class="form-control" placeholder="Enter Captcha" name="captcha">
                          @if ($errors->has('captcha'))

                            <span class="invalid-feedback" style="display: block;">

                                <strong>{{ $errors->first('captcha') }}</strong>

                            </span>

                        @endif
                      </div>
              </div>			
          </div>
			
		</div>
		<hr>
		</div>
 	<div class="col-md-9 text-center m-auto">
		
		
		   <a class="btn btn-outline-dark" href="/journal/{{$journal->journal_id}}">Back</a>
		   <input class="btn btn-dark" name="issue_purchase_form" type="submit" value="Submit">	
		   <br />
		   <br />

	  </div>
	</div>
   
		</form>
				
        </div>
    
      </div>
    </div>
   </div>



   @section('footer_scripts')
<script type="text/javascript">
$(document).ready(function(){
    /* Get iframe src attribute value i.e. YouTube video url
    and store it in a variable */
    var url = $("#cartoonVideo").attr('src');
    
    /* Remove iframe src attribute on page load to
    prevent autoplay in background */
    $("#cartoonVideo").attr('src', '');
    
    /* Assign the initially stored url back to the iframe src
    attribute when modal is displayed */
    $("#myModal").on('shown.bs.modal', function(){
        $("#cartoonVideo").attr('src', url);
    });
    
    /* Assign empty url value to the iframe src attribute when
    modal hide, which stop the video playing */
    $("#myModal").on('hide.bs.modal', function(){
        $("#cartoonVideo").attr('src', '');
    });
});
</script>

<!--JQuery & Script for BS4 Custom file upload-->
<script src="{{ asset('js/jquery-3.2.1.slim.min.js') }}"></script>
<script>
            $('#inputGroupFile01').on('change',function(){
                //get the file name
                var fileName = $(this).val();
                //replace the "Choose a file" label
                $(this).next('.custom-file-label').html(fileName);
            })
</script>
   @stop
