@extends('layouts.master')

@section('title', 'Email Verification')

@section('style-libraries')

@stop

@section('styles')
    
@stop

@section('content')
<div id="content">
	<section id="loginPage" style="min-height: 400px;">
		<div class="w3-container">
			@if(session('success'))
				<div id="auth" class="w3-modal">
					<div class="w3-modal-content">
					<div class="w3-containe w3-center">
						<h3>{{ __('website.notify') }}</h3>
						<p>We have sent a verification link to your email: <b>{{ \Auth::user()->email }}</b>.</p>
					</div>
					</div>
				</div>
			@endif
			<h2 style="text-align: center;">Email Verification - One More Step</h2>
			<div style="max-width: 600px; margin: 20px auto; padding: 15px; line-height: 25px; text-align: justify;">
			    <p>Thank you for registering at <b>{{ url('/') }}</b>!</p>
			    <p>We have sent a verification link to your email: <b>{{ \Auth::user()->email }}</b>. Please follow the steps below to activate your account:</p>
			    <ol>
			        <li><strong>Check Your Inbox:</strong> Look for an email from <b>noreply@itvmax.org</b> with the subject "Verify Your Account".</li>
			        <li><strong>Check Spam/Junk:</strong> If you don't see it in your inbox, check your Spam or Junk folder.</li>
			        <li><strong>Click the Link:</strong> Open the email and click the verification link.</li>
			        <li><strong>Resend Email:</strong> If you can't find the email, request a new email.</li>
			    </ol>
			    <p>Need help? Contact us at <b>cs@itvmax.org</b>.</p>
			    <p>Sincerely, The <b>{{ url('/') }}</b> Team</p>

			    <p  style="text-align: center;" class="mt-20 mb-20">
			    	<!-- <i class="fa fa-circle-o-notch fa-spin"></i> -->
			    	<a class="btn" id="resend" href="{{ route('profile.email_not_active') }}">  <b>Resend Email</b></a>
			    </p>
			</div>
		</div>
	</section>
</div>
{{ session()->forget('success') }}
@endsection
@section('styles')
	
@stop
@section('scripts')
	<script type="text/javascript">
		var curentTimeSendEmail = parseInt('{{$time_send_email_active}}');
		var now = parseInt('{{$now}}');
		var remainingTime = 30 - (now - curentTimeSendEmail);
		if( remainingTime <= 30 && remainingTime != 0 ){
			$('#resend').text('Resend Email ('+remainingTime+'s)');
			$('#resend').addClass('disabled');
			var countdownInterval = setInterval(updateCountdown, 1000);
       		updateCountdown();
		}

		function updateCountdown() {
			remainingTime--;

            if (remainingTime > 0) {
                $('#resend').text('Resend Email ('+remainingTime+'s)');
            } else {
                $('#resend').removeClass('disabled');
                $('#resend').text('Resend Email');
                clearInterval(countdownInterval);
            }
        }

        $('#resend').click(function(e) {
        	if( $(this).hasClass('disabled') ){
        		e.preventDefault();
        		return;
        	} 

        	var url = '{{ route("profile.resend_email_active") }}';
        	$('#resend').html('Resend Email  <i class="fa fa-circle-o-notch fa-spin"></i>');
        	$('#resend').addClass('disabled');
	    	$.post(url, { _token: _token },function(result) {
				location.reload();
			});
			e.preventDefault();
        });

        var modal = document.getElementById('auth');
		if(modal){
			var timeout = 3000;
			setTimeout(function() {
				modal.style.display = 'none';
			}, timeout);

			window.addEventListener('click', function(event) {
				if (event.target !== modal) {
					modal.style.display = 'none';
				}
	    	});
		}

	</script>
@stop