@extends('layouts.header')
@section('pageTitle', 'HireMee Gold Pricing')
@section('content')
@include('partials.v2.header-gold')
<div class="gold-header-subs">
  <h4>HireMee Gold Pricing</h4>
</div>
<section class="section">
	<div class="container">
		<div class="row">
      <div class="col-12 col-md-6 ">
				<div class="contact-form-wrapper">
					<div class="section-header">
						Connect with us
					</div>
					<form class="features-form" method="post" action="{{secure_url('gold-pricing')}}" id="js_pricing_form">
					  <div class="form-group pos-relative">
					  	@csrf
					    <label class="required" for="name required">Name <sup>*</sup></label>
					    <input type="text" class="form-control" id="name" name="name" aria-describedby="name" placeholder="Name">
					  </div>

						<div class="form-group pos-relative">
					    <label class="required" for="business-email required">Email <sup>*</sup></label>
					    <input type="email" class="form-control" name="email" id="email" aria-describedby="business-email" placeholder="Email address">
					  </div>

						<div class="form-group pos-relative">
					    <label class="required" for="contact-number required">Contact Number <sup>*</sup></label>
					    <input type="text" class="form-control" name="contact_number" id="contact_number" aria-describedby="contact-number" placeholder="Contact Number">
					  </div>

						<div class="form-group">
					    <label for="company">College</label>
					    <input type="text" class="form-control" name="company" id="company" aria-describedby="company" placeholder="College Name">
					  </div>

						<div class="form-group d-flex justify-content-start">
              <div class="gold-radio">
                <input id="radio-1" name="who_am_i"  type="radio" checked value ="1">
                <label for="radio-1" class="radio-label">I am a Student</label>
              </div>
              <div class="gold-radio">
                <input id="radio-2" name="who_am_i" type="radio" value ="2">
                <label for="radio-2" class="radio-label">I am a TPO</label>
              </div>
					  </div>

						<div class="form-group">
					    <label for="desc">Comments</label>
					    <textarea  class="form-control long-text" name="desc" id="desc" placeholder="Comments . . ."></textarea>
					  </div>

					  <button type="submit" class="btn btn-warning  btn-block btn-lg">SUBMIT</button>
					</form>
				</div>

			</div>
			<div class="col-12 col-md-6">
        <div class="price-option-wrapper border-gold">
          <span class="counter1 bgm-light-gold">A</span>
          Get in touch with your Placement Officer
        </div>
        <div class="price-option-wrapper border-blue">
          <span class="counter1 bgm-light-blue">B</span>
          Contact HireMee Campus Manager
        </div>
        <div class="price-option-wrapper border-dark-gold">
          <span class="counter1 bgm-dark-gold">C</span>
          Talk to your Job Captain

        </div>
        <div class="price">
          Price: Rs. 1,100/ Inclusive of all Taxes
        </div>

        	<!-- @author Naveenkumar S <V2E17315> @version 20.1 @purpose check is need to gold upgrade -->
			<center>
				<div>
	              <button type="button" name="button" class="btn btn-primary js-gold-activate">Pay now</button>
	            </div>
			</center>

			</div>

		</div>
	</div>

</section>
<script src="{{ secure_asset('assets/js/jquery.validate.min.js') }}"></script>
<script type="text/javascript" src="{{ secure_asset('assets/js/additional-methods.min.js') }} "></script>

<script>
	var tooltip_direction_options;
  $(document).ready(function(){
    tooltip_direction_options = {
      placement: function (context, source) {
        var position = $(source).position();
        if (position.left < 280) {
          return "left";
        }            
        else {
          return "left";
        }
      } , trigger: "hover"
    };
  });
  
  $('.parallax-container').parallax({
    imageSrc: '{{{ URL::asset("img/pro/test-library.jpg")}}}',
    speed: '.5',
    bleed: '10'
  });
	
	$.validator.addMethod("validateEmail", function(value, element) {
	    return this.optional(element) || /^\s*([0-9a-zA-Z]([-_\\.]*[0-9a-zA-Z]+)*)@([0-9a-zA-Z]([-_\\.]*[0-9a-zA-Z]+)*)[\\.]([a-zA-Z]{1,9})[\w\W ]*[^ ]$/.test(value);
	  }, "Please Enter a valid email id.");

	$.validator.addMethod("lettersonly", function(value, element) {
      return this.optional(element) || /^[a-zA-Z\s]*$/.test(value);
    });

	$.validator.addMethod('yopmailvalidation', function (value) {
   	 return /^([\w-.]+@(?!yopmail\.com)([\w-]+.)+[\w-]{2,4})?$/.test(value);
	},"we won't allowed the Yopmail email address");

    $('#js_pricing_form').validate({
         errorElement: 'span',
           errorPlacement: function (error,element){
               var parent = $(element).parent();
               $('.tooltip').tooltip('hide');
               $("body").find('#'+error[0].id+'-custom').remove();
               parent.append('<span data-position="left" style="top:45px !important; z-index:100 !important; right:6px !important;"  data-animation ="false" data-delay="0" data-toggle="tooltip" data-original-title="'+error[0].innerText+'" class="js-tootletip hiremee-info text-danger tooltip-validate tooltipped" id="'+error[0].id+'-custom"></span>');
               $('#'+error[0].id+'-custom').tooltip(tooltip_direction_options);
           },
           success: function (element){
             $("body").find('#'+element[0].id+'-custom').remove();
             $('#'+element[0].id+'-custom').tooltip('hide');
             $('.js-tooltip-validate').tooltip();
           },
            onfocusout: false,
		    rules: {         
		    name: {
		      required:true,
		      lettersonly:true,
		      normalizer: function(value) {
			       return $.trim(value);
			    }
		    },
		    email: {
		      required:true,
		      validateEmail:true,
		      yopmailvalidation:true,
		       normalizer: function( value ) {
                   return $.trim( value );
                }
		    },  
		    contact_number: {
		      required: true,
		      number: true,
		      minlength:10,
		      maxlength:12
		    }
		    
		  },
		  messages: {
		     name: {
		      required:"Name required",
		    },
		    email: {
		      required:"Email required",
		      validateEmail:"Please valid Email",
		    },
		    contact_number: {
		      required: "Contact Number required",
		      minlength: "Contact Number must 10 characters",
		    }
		            
		  },
		  submitHandler:function(form,event){
		  	event.preventDefault();
			$("#js_contact_button").attr("disabled",true);
	   		form.submit();
		  } 
		 });

		 // @author Naveenkumar S <V2E17315> @version 20.1 @purpose check is need to gold upgrade

		 $('.js-gold-activate').click(function(){
			var self = $(this);
			var baseUrl = $("meta[name='base_url']").attr("content");
			var signin_url = "candidate/login"+"?token=$2y$10$q0i6nTheJjdyhAiHmNBn2u0pFj.J7ma62Qd1aFxtcP15UM/.K1j0C";
			var signup_url = "candidate/register"+"?token=$2y$10$q0i6nTheJjdyhAiHmNBn2u0pFj.J7ma62Qd1aFxtcP15UM/.K1j0C";
			
			swal({
				html: true, 
				title: '', 
				text: 'He/she is already registered on HireMee or not?',
				type: "warning",
				showCancelButton: true,
				confirmButtonText: "Sign In",
				cancelButtonText: "Sign Up",
				closeOnConfirm: false,
				confirmButtonColor: '#ffbc01',
				},function(isConfirm){
				if (isConfirm) {
					window.location.replace(signin_url);
				}else{
					window.location.replace(signup_url);
				}
				swal.close();
				});
		 });
</script>
@endsection