@extends('layouts.registration')

@push('css')
	<link rel="stylesheet" href="{{ asset('/assets/vendor/intl-tel/17.0.15/css/intlTel.css') }}">
	<style>
		#msform input:not(.form-control), #msform textarea {
			padding:0.5rem;
		}
		.iti {
			flex: auto;
		}
	</style>
@endpush
@section('nav')
    <x-nav brand="EKYC REGISTRATION"></x-nav>
@endsection

@section('content')
    <div class="container-fluid breadcrum-wrapper">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="hero-componentainer hero-content-componentainer" style="height: auto;padding: 15px 0;">
                        <h1 class="text-dark">EKYC Registration</h1>
                        <h2 class="text-dark text-bold">Mango CA EKYC is a full technology stack for e-sign platform.</h2>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
		<div class="card p-3 kyc-step-from-wrapper" style="border:none;">
			<div class="step-title">
				<h2 class="text-left text-dark mb-0">Step 1: Verify Your NID</h2>
			</div>
			<div class="card-body p-0 border-top" id="div_contatiner">
				<div id="msform">
					<div class="w-100 my-4">
						<!-- progressbar -->
						<ul id="progressbar" class="m-0 d-flex align-items-center w-100 justify-content-between">
							<li class="active" id="account"><p class="content-title mb-0">Verify Your NID</p></li>
							<li id="personal"><p class="content-title mb-0">Verify Your Photo</p></li>
							<li id="payment"><p class="content-title mb-0">Register Your Email/Mobile</p></li>
							<li id="confirm" class="text-right"><p class="content-title mb-0">Complete Registration</p></li>
						</ul>
					</div>
					<!-- fieldsets -->
					<fieldset>
						<div class="container">
							<div class="row">
                                <div class="col-md-12">
                                    <div class="d-md-flex justify-between px-4">
                                        <div class="mb-2 position-relative">
                                            <div class="text-left">
                                                <h3 class="inner-title">NID Front Side Photo</h3>
                                            </div>
                                            <div class="document-capture-page-container-in-photo-capture-col">
                                                <div class="photo-capture-component-in-photo-capture-component">
                                                    <div class="photo-capture-component-in-photo-capture position-relative"
                                                        id="front_nid_pic_x" data-target="front">
                                                        <img id="front_nid_image" src="" style="display: none;" />
                                                        <img src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTI3IiBoZWlnaHQ9IjMzNiIgdmlld0JveD0iMCAwIDUyNyAzMzYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHg9IjIiIHk9IjIiIHdpZHRoPSI1MjMiIGhlaWdodD0iMzMyIiByeD0iMTQiIHN0cm9rZT0iI0U2RThFQyIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPHJlY3QgeD0iNDAiIHk9IjQwIiB3aWR0aD0iMTMwIiBoZWlnaHQ9IjE2MCIgcng9IjgiIGZpbGw9IiNFNkU4RUMiLz4KPHJlY3QgeD0iMjEwIiB5PSI0MCIgd2lkdGg9IjI3NyIgaGVpZ2h0PSIzMiIgcng9IjgiIGZpbGw9IiNFNkU4RUMiLz4KPHJlY3QgeD0iMjEwIiB5PSIxMDQiIHdpZHRoPSIyNzciIGhlaWdodD0iMzIiIHJ4PSI4IiBmaWxsPSIjRTZFOEVDIi8+CjxyZWN0IHg9IjIxMCIgeT0iMTY4IiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjMyIiByeD0iOCIgZmlsbD0iI0U2RThFQyIvPgo8L3N2Zz4K"
                                                            class="img-fluid" alt="front">
                                                    </div>
                                                    <div class="text-center front-image-wrapper flex justify-content-between">
                                                        <button type="button" id="front_nid_pic"
                                                            class="btn btn-icon btn-primary btn-circle"><i
                                                                class="fas fa-camera mr-1"></i>
                                                        </button>
                                                        <button type="button" id="front_nid_label"
                                                            class="btn btn-custom-success btn-icon btn-circle"><i class="fas fa-file-upload mr-1"></i>
                                                        </button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="mb-2 position-relative">
                                            <div class="text-left">
                                                <h3 class="inner-title">NID Back Side Photo</h3>
                                            </div>
                                            <div class="document-capture-page-container-in-photo-capture-col">
                                                <div>
                                                    <div class="photo-capture-component-in-photo-capture-component">
                                                        <div class="photo-capture-component-in-photo-capture position-relative"
                                                            id="back_nid_pic_x" data-target="back">
                                                            <img id="back_nid_image" src=""
                                                                style="display: none;" />
                                                            <img src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTI3IiBoZWlnaHQ9IjMzNiIgdmlld0JveD0iMCAwIDUyNyAzMzYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHg9IjIiIHk9IjIiIHdpZHRoPSI1MjMiIGhlaWdodD0iMzMyIiByeD0iMTQiIHN0cm9rZT0iI0U2RThFQyIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPHJlY3QgeD0iNDAiIHk9IjQwIiB3aWR0aD0iNDQ3IiBoZWlnaHQ9IjMyIiByeD0iOCIgZmlsbD0iI0U2RThFQyIvPgo8cmVjdCB4PSIyODMiIHk9IjEwNCIgd2lkdGg9IjIwNCIgaGVpZ2h0PSIzMiIgcng9IjgiIGZpbGw9IiNFNkU4RUMiLz4KPHJlY3QgeD0iNDAiIHk9IjEwNCIgd2lkdGg9IjIwNCIgaGVpZ2h0PSIzMiIgcng9IjgiIGZpbGw9IiNFNkU4RUMiLz4KPHJlY3QgeD0iNDAiIHk9IjE2OCIgd2lkdGg9IjIwNCIgaGVpZ2h0PSIzMiIgcng9IjgiIGZpbGw9IiNFNkU4RUMiLz4KPC9zdmc+Cg=="
                                                                class="img-fluid" alt="back">
                                                        </div>
                                                        <div class="text-center back-image-wrapper flex justify-content-between">
                                                            <button type="button" id="back_nid_pic"
                                                                class="btn btn-icon btn-primary btn-circle"><i
                                                                class="fas fa-camera mr-1"></i>
                                                            </button>
                                                            <button type="button" id="back_nid_label"
                                                                class="btn btn-custom-success btn-icon btn-circle"><i class="fas fa-file-upload mr-1"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
							<div class="row">
								<div class="col-md-12">
									<div class="text-center w-100 mt-4">
										<button id="processNidBtn" onclick="processNID($(this))"
											type="button" class="btn btn-custom-success button-component-submit mb-2"></i> Process NID</button>
									</div>
									<div class="col-md-12">
                                        <div class="Nid Information processed_nid px-4">

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

							</div>
						</div>
						<button id="afterVerifyNextBtn"
							class="btn btn-custom-success button-component-submit mt-3 mb-2 next"
							style="display: none;">Step 2: Verify Your Photo</button>
					</fieldset>
					<fieldset>
						<div class="container">
							<div class="row">
								<div class="offset-md-3 col-md-6">
									<div class="document-capture-page-container-in-photo-capture-col mt-3">
										<div class="photo-capture-component-in-photo-capture-component">
											<div
												class="photo-capture-component-in-photo-capture position-relative" style="height: 350px;width: 350px !important;display: inline-flex;">
												<img src="#" id="shoot_user_image" data-is-dummy="1"
													class="image-viewer" style="display: none;height: 350px;width: 350px !important;z-index: 0 !important;"
													alt="" />
												<img src="data:image/png;base64,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"
													class="photo-capture-component__in-photo-capture-bg___2WSTn"
													alt="selfie">
												<div class="text-center py-3 front-image-wrapper">
													<button type="button" id="shoot_user_pic"
														class="btn btn-icon btn-custom-success btn-circle">
                                                            <svg style="fill: #fff;width: 25px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.1.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M152 0C156.4 0 160 3.582 160 8C160 12.42 156.4 16 152 16H40C26.75 16 16 26.75 16 40V152C16 156.4 12.42 160 8 160C3.582 160 0 156.4 0 152V40C0 17.91 17.91 0 40 0H152zM512 152C512 156.4 508.4 160 504 160C499.6 160 496 156.4 496 152V40C496 26.75 485.3 16 472 16H360C355.6 16 352 12.42 352 8C352 3.582 355.6 0 360 0H472C494.1 0 512 17.91 512 40V152zM320 256C320 291.3 291.3 320 256 320C220.7 320 192 291.3 192 256C192 220.7 220.7 192 256 192C291.3 192 320 220.7 320 256zM256 208C229.5 208 208 229.5 208 256C208 282.5 229.5 304 256 304C282.5 304 304 282.5 304 256C304 229.5 282.5 208 256 208zM325.8 111.6L332 128H368C394.5 128 416 149.5 416 176V336C416 362.5 394.5 384 368 384H144C117.5 384 96 362.5 96 336V176C96 149.5 117.5 128 144 128H180L186.2 111.6C189.7 102.2 198.6 96 208.6 96H303.4C313.4 96 322.3 102.2 325.8 111.6zM144 144C126.3 144 112 158.3 112 176V336C112 353.7 126.3 368 144 368H368C385.7 368 400 353.7 400 336V176C400 158.3 385.7 144 368 144H320.9L310.9 117.2C309.7 114.1 306.7 112 303.4 112H208.6C205.3 112 202.3 114.1 201.1 117.2L191.1 144H144zM0 360C0 355.6 3.582 352 8 352C12.42 352 16 355.6 16 360V472C16 485.3 26.75 496 40 496H152C156.4 496 160 499.6 160 504C160 508.4 156.4 512 152 512H40C17.91 512 0 494.1 0 472V360zM360 512C355.6 512 352 508.4 352 504C352 499.6 355.6 496 360 496H472C485.3 496 496 485.3 496 472V360C496 355.6 499.6 352 504 352C508.4 352 512 355.6 512 360V472C512 494.1 494.1 512 472 512H360z"/></svg>
													</button>
												</div>
											</div>
										</div>
									</div>
								</div>
								<div class="col-md-12">
									<div class="text-center w-100 mt-5 d-md-flex align-items-center justify-content-center">
										<button class="btn btn-primary button-component-submit previous">
											<span>Step 1: Verify Your NID</span>
										</button>
										<button id="re_shoot_user_pic"
											type="button"
											style="display: none"
											class="btn btn-custom-success button-component-submit ">
											Retake Picture
										</button>
										<button id="faceCompareButton" onclick="faceCompare(this)"
											type="button"
											class="btn btn-custom-success button-component-submit " disabled><i
												class="fas fa-cog"></i> Verify Face
										</button>
										<button id="faceCompareNextBtn"
											class="btn btn-custom-success button-component-submit next"
											style="display: none">Step 3: OTP Verification</button>

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

					</fieldset>
					<fieldset>
						<div class="container">
							<div class="row justify-content-center">
								<div class="col-md-6 otp-wrapper m-5 otp_media_container">
									<ul class="nav nav-tabs" id="myTab" role="tablist">
										@if(config('custom.sms_enable'))
										<li class="nav-item" role="presentation">
											<button class="nav-link active" id="phone-tab" data-bs-toggle="tab" data-bs-target="#phoneTab" type="button" role="tab" aria-controls="phone" aria-selected="true"><i class="fa fa-mobile"></i> OTP Verification</button>
										</li>
										@endif
									</ul>
									<div class="tab-content my-3" id="myTabContent">
										<div class="tab-pane fade m-3 show active" id="phoneTab" role="tabpanel" aria-labelledby="phone-tab">
											
											@if(config('custom.sms_enable'))
											<div class="input-group mb-3">
												<span class="input-group-text"><label for="phone">Phone</label></span>
												<x-input id="phone" class="block w-full" type="text" name="phone" :value="old('phone')" required data-otp-media-type="phone" autofocus placeholder="Enter your mobile number" />
												<button onclick="sendOTP($(this), 'phone')" data-otp-media-type="phone" type="button" class="btn btn-primary send_otp_phone_btn">Send OTP</button>
											</div>
											@else
											<div class="input-group mb-3">
												<span class="input-group-text"><label for="phone">Phone</label></span>
												<x-input id="phone" class="block w-full" type="text" name="phone" :value="old('phone')" required data-otp-media-type="phone" autofocus placeholder="Enter your mobile number" disabled/>
											</div>
											<label class="d-block" style="color: red;text-align: left;padding: 0 10px;font-size: 13px;">SMS gateway didn't configure yet</label>
											@endif
											

											<span class="d-block" style="margin-bottom: 15px;">OR</span>

											<div class="input-group mb-3">
												<span class="input-group-text"><label for="email">Email</label></span>
												<x-input id="email" class="block w-full" type="email" name="email" :value="old('email')" required data-otp-media-type="email" placeholder="Enter your email"/>
												<button onclick="sendOTP($(this), 'email')" data-otp-media-type="email" type="button" class="btn btn-custom-success send_otp_phone_btn">Send OTP</button>
											</div>
										</div>
									</div>
									<!-- <div class="input-group mt-5 otp_media_container">
										<input id="phone_number_email" style="height: 39px;"
											data-is-verified="0" data-otp-media-type="phone" name="phone_number_email" type="text"
											placeholder="Phone" required="required" class="form-control">
										<div class="input-group-append">
											<button onclick="sendOTP($(this))" data-otp-media-type="phone"
												type="button"
												class="btn btn-primary send_otp_phone_btn">Send OTP</button>
										</div>
									</div> -->
								</div>
								<div class="phone_email_otp_submission_area">
								</div>
								<div class="col-md-12 mb-5">
									<button class="btn btn-custom-success button-component-submit previous">
                                        <span>Step 2: Verify Your Photo</span>
                                    </button>
									<button class="btn btn-custom-success button-component-submit next"
										style="display: none;">Confirm</button>
								</div>
							</div>
						</div>

					</fieldset>
					<fieldset>
						<div class="form-card">
							<h2 class="fs-title text-center">Success !</h2> <br><br>
							<div class="row justify-content-center">
								<div class="col-3"> <img
										src="https://img.icons8.com/color/96/000000/ok--v2.png"
										class="fit-image"> </div>
							</div> <br><br>
							<div class="row justify-content-center">
								<div class="col-7 text-center">
									<h5>You Have Successfully Signed Up</h5>
								</div>
							</div>
						</div>
					</fieldset>
				</div>
			</div>
		</div>
    </div>

	<div class="capture_shoot_modal_area">
    </div>
	<form id="user_register_form" action="" class="d-none d-print-none">
        <input id="f_nid_front" name="nid_front" type="file">
        <input id="f_nid_back" name="nid_back" type="file">
        <input id="f_user_photo" name="user_photo" type="file">
        <input id="f_user_email" name="user_email" type="email" value="">
        <input id="f_user_phone" name="user_phone" type="tel" value="">
    </form>
@endsection

@push('scripts')
    <script type="text/javascript" src="{{ asset('/assets/vendor/intl-tel/17.0.15/js/intlTel.min.js') }}"></script>
    <script>
        $('.digit-group').find('input').each(function() {
            $(this).attr('maxlength', 1);
            $(this).on('keyup', function(e) {
                var parent = $($(this).parent());

                if (e.keyCode === 8 || e.keyCode === 37) {
                    var prev = parent.find('input#' + $(this).data('previous'));

                    if (prev.length) {
                        $(prev).select();
                    }
                } else if ((e.keyCode >= 48 && e.keyCode <= 57) || (e.keyCode >= 65 && e.keyCode <= 90) || (
                        e.keyCode >= 96 && e.keyCode <= 105) || e.keyCode === 39) {
                    var next = parent.find('input#' + $(this).data('next'));

                    if (next.length) {
                        $(next).select();
                    } else {
                        if (parent.data('autosubmit')) {
                            parent.submit();
                        }
                    }
                }
            });
        });

		@if(config('custom.sms_enable'))
        // var phone_number = window.intlTelInput(document.querySelector("#phone_number_email"), {
        var phone_number = window.intlTelInput(document.querySelector("#phone"), {
            separateDialCode: true,
            preferredCountries:["bd"],
            hiddenInput: "full",
            utilsScript: "//cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.3/js/utils.js",
            // // autoHideDialCode: true,
            // autoPlaceholder: "ON",
            // // dropdownContainer: document.body,
            // formatOnDisplay: true,
            // hiddenInput: "full_number",
            // // initialCountry: "auto",
            // // nationalMode: true,
            // placeholderNumberType: "MOBILE",
            // preferredCountries: ['bd'],
            // separateDialCode: true
            });
		@endif


        $('#front_nid_pic').click(function() {
            takeLivePicture('front_nid', '#front_nid_image')
        })
		$('#front_nid_label').click(function() {
            takeLivePicture('front_nid_file', '#front_nid_image')
        })

        $('#back_nid_pic').click(function() {
            takeLivePicture('back_nid', '#back_nid_image')
        })
		$('#back_nid_label').click(function() {
            takeLivePicture('back_nid_file', '#back_nid_image')
        })

        $('#shoot_user_pic').click(function() {
            takeLivePicture('shoot_user', '#shoot_user_image')
        })

        $('#re_shoot_user_pic').click(function() {
            takeLivePicture('shoot_user', '#shoot_user_image')
        })



        function takeLivePicture(shoot_type, image_area) {
            url = '{{ url("/get-shoot-modal") }}';
            data = {
                shoot_type,
                image_area
            }
            ajaxCallAsyncCallback(url, data, 'post', function(response) {
                $('.capture_shoot_modal_area').html('');
                $('.capture_shoot_modal_area').html(response);
                $('#captureShootModal').modal('show');
            });
        }

        function processNID(element) {
			$(element).prop('disabled', true).html('<i class="fas fa-spinner fa-pulse"></i> Processing...');
            front_nid_pic = $('#front_nid_image')
            back_nid_pic = $('#back_nid_image')
            if (front_nid_pic.attr('data-is-dummy') == 0 && back_nid_pic.attr('data-is-dummy') == 0) {
                url = "{{ url('/process-nid-image') }}";
                data = {
                    front_image: front_nid_pic.attr('src'),
                    back_image: back_nid_pic.attr('src')
                }
				getLoader("Your NID info is being processed, it will take about 1 minutes.");
                ajaxCallAsyncCallback(url, data, 'post', function(response) {
					destroyLoader();
                    if (response.status == 'error') {
                        toastr.error(response.message);
                        // $('#processNidBtn').addClass('disabled');
						$(element).prop('disabled', false).html('<i class="fas fa-cog"></i> Process NID');
                    } else {
						$("#front_nid_pic").hide();
						$("#front_nid_label").hide();
						$("#back_nid_pic").hide();
						$("#back_nid_label").hide();
						
                        $('.processed_nid').html('<div style="border-bottom: 1px solid #000; text-align:left;"><h5 class="mb-2"><strong>NID Card Information</strong></h5></div><table class="table table-bordered mt-2"><thead><tr><th>NID No</th><th>DOB</th></tr></thead><tr><td>'+response.data.nid_no+'</td><td>'+response.data.dob+'</td></tr></table>');
                        $('.processed_nid').append('<div class="col-md-8 verified_nid_info w-100 mt-4"><button  onclick="verifyNID(this)" data-nid="'+response.data.nid_no+'" data-dob="'+response.data.dob+'" type="button" class="btn btn-custom-success button-component-submit">Verify NID</button></div>');
                        // $('#processNidBtn').removeClass('disabled');
						
                        element.hide();

						$([document.documentElement, document.body]).animate({
							scrollTop: $(".processed_nid").offset().top
						}, 500);
                    }
                });
            } else {
				if (front_nid_pic.attr('data-is-dummy') != 0) {
					toastr.error('Please upload NID front image');
				} else if(back_nid_pic.attr('data-is-dummy') != 0) {
					toastr.error('Please upload NID back image');
				}
				$(element).prop('disabled', false).html('<i class="fas fa-cog"></i> Process NID');
			}
        }

        function faceCompare(element) {
            is_valid = $('#shoot_user_pic').attr('data-is-dummy', 0);
            is_nid_processed = $(element).attr('data-nid') && $(element).attr('data-dob')
            if ($('#shoot_user_image').attr('src') == '#') {
                toastr.error('Please take your photo first!');
            } else {
                if (is_valid) {
					$(element).prop('disabled', true).html('<i class="fas fa-spinner fa-pulse"></i> Verifying your face...');
                    if (is_nid_processed) {
                        url = '{{ url("/face-compare") }}';
                        data = {
                            user_photo: $('#shoot_user_image').attr('src'),
                            nid_photo: $('#nid_user_photo_or').attr('src')
                        }
						getLoader("Verifying your face, it will take about 1 minutes.");
                        ajaxCallAsyncCallback(url, data, 'post', function(response) {
							destroyLoader();
                            if (response.status == 'error') {
                                toastr.error(response.data)
                                // $('#re_shoot_user_pic').show();
								$(element).prop('disabled', false).html('<i class="fas fa-cog"></i> Verify Face');
                            } else {
                                toastr.success(response.data)
                                $('#faceCompareNextBtn').show();
                                $('#user_image_li').addClass('verified');
                                $(element).hide();
                                // $('#re_shoot_user_pic').hide();
								$(".step-title h2").html('Step 3: OTP Verification');
                            }
                        });
                    } else {
                        toastr.error('Nid Processing error!')
                    }
                } else {
                    toastr.info('Please Take Live Photo')
                }
            }
        }

        function verifyNID(element) {
            is_nid_processed = $(element).attr('data-nid') && $(element).attr('data-dob')
            $('#faceCompareButton').attr('data-nid', $(element).attr('data-nid'));
            $('#faceCompareButton').attr('data-dob', $(element).attr('data-dob'));

            if (is_nid_processed) {
				$(element).prop('disabled', true).html('<i class="fas fa-spinner fa-pulse"></i> Verifying...');
                url = "{{ url('/verify-nid') }}";
                data = {
                    user_nid: $(element).attr('data-nid'),
                    user_dob: $(element).attr('data-dob'),
                }
				getLoader("Verifying your NID info, it will take about 1 minutes.");
                ajaxCallAsyncCallback(url, data, 'post', function(response) {
					destroyLoader();
                    if (response.status == 'error') {
                        toastr.error(response.data);
						$(element).prop('disabled', false).html('Verify NID');
                    } else {
                        $('.verified_nid_info').html('<table class="table text-left" style="text-align: left !important;"><thead><tr><th colspan="3" class="text-left"><h5><strong>Personal Details</strong></h5></th></tr></thead><tbody><tr><td rowspan="5" style="width:200px;"><img id="nid_user_photo_or" class="verify-nid-img" style="max-width: 100%;" src="data:image/jpeg;base64,'+response.data.photo+'" alt=""></td><th class="border-0 text-left">ID No</th><td class="border-0 text-left">'+response.data.nationalId+'</td></tr><tr><th class="border-0 text-left">Name (Eng)</th><td class="border-0 text-left">'+response.data.nameEn+'</td></tr><tr><th class="border-0 text-left">Name (Bng)</th><td class="border-0 text-left">'+response.data.name+'</td></tr><tr><th class="border-0 text-left">Father\'s Name</th><td class="border-0 text-left">'+response.data.father+'</td></tr><tr><th class="border-0 text-left">Mother\'s Name</th><td class="border-0 text-left">'+response.data.mother+'</td></tr></tbody></table>');
                        $('#nid_image_li').addClass('verified');
                        $('#afterVerifyNextBtn').show();
						$(".step-title h2").html('Step 2: Verify Your Photo');

						$([document.documentElement, document.body]).animate({
							scrollTop: $(".verified_nid_info").offset().top
						}, 500);
                    }
                });
            } else {
                toastr.error('Nid Processing error!')
            }
        }

        function sendOTPOld(elem) {
            if ($('#phone_number_email').val() == '') {
                toastr.error('Please give phone no or email!');
            } else {
				@if(config('custom.sms_enable'))
                full_number = phone_number.getNumber(intlTelInputUtils.numberFormat.E164);
				@else
				full_number = '';
				@endif
                otp_media = $('#phone_number_email').val();
                console.log(otp_media);
                otp_media_type =  $('#phone_number_email').data('otp-media-type');
                url = '{{ url("/send-otp") }}';
                data = {
                    otp_media_type,
                    otp_media,
                    full_number,
                    'registration': true
                }
                ajaxCallAsyncCallback(url, data, 'post', function(response) {

                    if (response.status && response.status === 'error') {
                        toastr.error(response.message)
                    } else {
                        $('.phone_email_otp_submission_area').show();
                        $('.otp_media_container').hide();

                        $('.phone_email_otp_submission_area').html('');
                        $('.phone_email_otp_submission_area').html(response);
                    }
                });
            }

        }
		function sendOTP(elem, inputFieldId) {
            if ($("#"+inputFieldId).val() == '') {
                toastr.error('Please give phone no or email!');
            } else {
				@if(config('custom.sms_enable'))
                	full_number = phone_number.getNumber(intlTelInputUtils.numberFormat.E164);
				@else
					full_number = '';
				@endif
                otp_media = $("#"+inputFieldId).val();
                otp_media_type = $("#"+inputFieldId).data('otp-media-type');
                url = '{{ url("/send-otp") }}';
                data = {
                    otp_media_type,
                    otp_media,
                    full_number,
                    'registration': true
                }
                ajaxCallAsyncCallback(url, data, 'post', function(response) {

                    if (response.status && response.status === 'error') {
                        toastr.error(response.message)
                    } else {
                        $('.phone_email_otp_submission_area').show();
                        $('.otp_media_container').hide();

                        $('.phone_email_otp_submission_area').html('');
                        $('.phone_email_otp_submission_area').html(response);
                    }
                });
            }

        }

        function resendOtp(elem, otpMediaType) {
			$(".phone_email_otp_submission_area").html('<div class="p-2"><i class="fa fa-spinner fa-pulse fa-6x"></i></div>');
			$("button.send_otp_phone_btn[data-otp-media-type="+otpMediaType+"]").trigger('click');
        }

        function verifyOTPOld(elem) {
            url = '{{ url("/verify-otp") }}';
            otp_media_type = elem.attr('data-otp-media-type');
            otp_media = $('#phone_number_email').val();
            otp = elem.attr('otp-code');
            if (otp_media == '') {
                toastr.error('Please give valid OTP!');
            } else {
                data = {
                    otp_media_type,
                    otp_media,
                    otp
                }
				getLoader("Verifying your OTP, it will take about 1 minutes.");
                ajaxCallAsyncCallback(url, data, 'post', function(response) {
					destroyLoader();
                    if (response.status === 'success') {
                        $('#phone_number_email').prop('readonly', true);
                        $('#' + otp_media_type + '_for_otp_li').addClass('verified');
                        $('.otp_' + otp_media_type + '_form').remove();
                        toastr.success(response.message)
                        window.location.href = "{{ route('dashboard') }}";
                    }else{
                        toastr.error(response.message)
                    }

                });
            }
        }

        function verifyOTP(elem) {
            url = '{{ url("/verify-otp") }}';
            otp_media_type = elem.attr('data-otp-media-type');
            otp_media = $("input[data-otp-media-type="+otp_media_type+"]").val();
            otp = elem.attr('otp-code');
            if (otp_media == '') {
                toastr.error('Please give valid OTP!');
            } else {
                data = {
                    otp_media_type,
                    otp_media,
                    otp
                }
				getLoader("Verifying your OTP, it will take about 1 minutes.");
                ajaxCallAsyncCallback(url, data, 'post', function(response) {
					destroyLoader();
                    if (response.status === 'success') {
                        $("input[data-otp-media-type="+otp_media_type+"]").prop('readonly', true);
                        $('#' + otp_media_type + '_for_otp_li').addClass('verified');
                        $('.otp_' + otp_media_type + '_form').remove();
                        toastr.success(response.message)
                        window.location.href = "{{ route('thankyou') }}";
                    }else{
                        toastr.error(response.message)
                    }

                });
            }
        }
    </script>
    <script type="text/javascript" src="{{ asset('/assets/vendor/intl-tel/17.0.15/js/intlTel.js') }}"></script>
    <script type="text/javascript" src="{{ asset('/js/wizerd.js') }}"></script>
@endpush