@extends('layouts.header')
@section('pageTitle', 'HireMee Webinar')
@section('content')
@include('partials.webinar.header')
<style>
	.pos-relative {position: relative;}
</style>
<div class="parellax-header ">
	<div class="container">
		<div class="row">
			<div class="col-xs-12 col-md-6 header-content">
				<div class="text">
					<h1 class="wow fadeInDown" data-wow-duration="800ms" data-wow-delay="300ms">Tips and tricks to ace the online assessments</h1>
					<p class="wow fadeInDown" data-wow-duration="1000ms" data-wow-delay="600ms">
						A crash course on techniques to make the best out of your knowledge
						and skills to ace the online assessment and proceed to the interviews
					</p>
					<div class="schedule wow fadeInDown" data-wow-duration="1100ms" data-wow-delay="700ms">
						WEBINAR | Sunday, 20th October | 8 – 9 PM IST
					</div>
					<a data-wow-duration="1200ms" data-wow-delay="800ms" type="button" name="button" class="btn webinar-header-cta wow fadeInDown page-scroll" href="#topics">Explore More <span class="lnr lnr-arrow-down-circle"></span></a>
					<button type="button" name="button" class="btn btn-webinar-play" data-toggle="modal" data-target="#webinar-schedule"><span class="circle"><img src="{{{ URL::asset('assets/home/images/webinar/play-button.svg')}}}" alt=""></span> </button>
				</div>
			</div>
			<div class="col-xs-12 col-md-6 d-flex justify-content-center align-items-center webinar-form-container">
				<div class="webinar-form-wrapper ">
					<h3>join this webinar</h3>
					<form class="p-3" id="js_contact_form" role="form" name="js_contact_form" method="post" action="{{url('Gold-Contact')}}">
						    @csrf
					  <div class="form-group pos-relative">
					    <input type="text" class="form-control" aria-describedby="name" name="name" id="name" placeholder="Name">
					     <span id="name-error"></span>
					  </div>
						<div class="form-group pos-relative">
					    <input type="email" class="form-control" name="email" id="email" aria-describedby="email" placeholder="Email address">
					     <span id="email-error"></span>
					  </div>
						<div class="form-group pos-relative">
					    <input type="text" class="form-control" name="contact_number" id="contact_number" aria-describedby="ContactNumber" placeholder="Contact Number">
					 	 <span id="contact_number-error"></span>
					  </div>
						<div class="form-group">
					    <input type="text" class="form-control" name="college" id="collage" aria-describedby="college" placeholder="College name">
					  	 <span id="collage-error"></span>
					  </div>
						<div class="form-group">
					    <input type="text" class="form-control" name="location" id="location" aria-describedby="location" placeholder="Location">
					  	  <span id="location-error"></span>	
					  </div>
					  <input type="submit" class="btn btn-warning btn-dark-cta  btn-block btn-lg" id="js_contact_button" value="REGISTER NOW"> 
						<!-- <button type="submit" name="submit" id="js_contact_button" class="btn btn-warning btn-dark-cta  btn-block btn-lg">REGISTER NOW</button> -->

					</form>
				</div>
			</div>
		</div>
	</div>
</div>
<section class="section bgm-white section-topics" id="topics">
	<div class="section-header">
		Topics we are Covering
		<span class="divider"></span>
	</div>
	<div class="section-content">
		<div class="container">
			<div class="row">
				<div class="col-xs-12 col-md-6">
					<div class="topics d-flex align-items-center">
						<span class="icon lnr lnr-arrow-right-circle"></span>
						<div class="content">
							Building the right mindset for taking an online assessment
						</div>
					</div>
					<div class="topics d-flex align-items-center">
						<span class="icon lnr lnr-arrow-right-circle"></span>
						<div class="content">
							The preparation required for an online assessment
						</div>
					</div>
					<div class="topics d-flex align-items-center">
						<span class="icon lnr lnr-arrow-right-circle"></span>
						<div class="content">
							The art of eliminating options in an online assessment
						</div>
					</div>
					<div class="topics d-flex align-items-center">
						<span class="icon lnr lnr-arrow-right-circle"></span>
						<div class="content">
							Maintaining focus during the course of assessment
						</div>
					</div>
				</div>
				<div class="col-xs-12 col-md-6">
					<div class="topics d-flex align-items-center">
						<span class="icon lnr lnr-arrow-right-circle"></span>
						<div class="content">
							More is less - Choosing the right questions to answer
						</div>
					</div>
					<div class="topics d-flex align-items-center">
						<span class="icon lnr lnr-arrow-right-circle"></span>
						<div class="content">
							Planning your time during the online assessment
						</div>
					</div>
					<div class="topics d-flex align-items-center">
						<span class="icon lnr lnr-arrow-right-circle"></span>
						<div class="content">
							Managing mental composure during the online assessment
						</div>
					</div>
					<div class="topics d-flex align-items-center">
						<span class="icon lnr lnr-arrow-right-circle"></span>
						<div class="content">
							Reviewing your performance in the online assessment
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<section class="section bgm-light-grap">
	<div class="webinar-speaker d-flex flex-wrap justify-content-center align-items-center">
		<div class="speaker">
			<img src="{{{ URL::asset('assets/home/images/webinar/arnav.jpg')}}}" alt="Arnav">
		</div>
		<div class="speaker-info">
			<h2>ARNAB GHOSH</h2>
			<p>
				Arnab is a PhD candidate at Oxford University and researches on generative models based on Deep Learning based approaches to generate videos. A former student of IIT Kanpur, Arnab has cleared several examinations and quizzes with flying color, be it IIT-JEE, AIEEE or placement tests of several companies such as Adobe, Goldman- Sachs etc. An ardent quizzer, having won quizzes at national level, Arnab will give you his insights on how to ace an online assessment.
			</p>
			<div class="social-links">
				<a href="https://www.linkedin.com/in/arnabgho/" target="_blank"><img height="40" width="40" src="{{{ URL::asset('assets/home/images/webinar/linkedin.svg')}}}" alt=""> </a>
			</div>
		</div>
	</div>
</section>


<div class="modal fade learning-track-modal" id="webinar-schedule" tabindex="-1" role="dialog" aria-labelledby="webinar-schedule" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h6>&nbsp;</h6>
        <button type="button" class="close z-index-high" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true"><i class="lnr lnr-cross"></i> </span>
        </button>
      </div>
      <div class="modal-body popup-alert d-flex justify-content-center flex-column">
        <img src="{{{ URL::asset('assets/home/images/webinar/job-calendar.jpg')}}}" alt="">
        <h5>
          Book your Calendar on<br><span class="text-highlight">Sunday, 20th October | 8-9 PM IST</span ><br> to learn <span class="text-highlight">Tips and tricks to ace the online assessments</span>
        </h5>
      </div>
    </div>
  </div>
</div>
<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 type="text/javascript">
	
	$.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_contact_form').validate({
            errorElement: 'span',
        errorPlacement: function (error,element){
            var parent = $(element).parent();
            $('.tooltip').tooltip('hide');
            $("body").find('#'+error[0].id+'-custom').remove();
            console.log(error[0].id);
            $('#'+error[0].id).append('<span style="position:absolute !important; right:6px !important; top:12px !important;" data-position="left" data-delay="0" data-animation="false" class="js-tootletip hiremee-info text-danger tooltip-validate" id="'+error[0].id+'-custom" data-toggle="tooltip" data-original-title="'+error[0].innerText+'" data-trigger="hover"></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');
      },
     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();
		  } 
		 });
</script>

@endsection