<?php $__env->startSection('content'); ?>
 <div class="account-pages py-5 pt-sm-5 light-theme">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-8 col-lg-6 col-xl-5">
                
                <div class="account-form-header m-0">
                    <div class="row">
                        <div class="col text-center">
                            <a href="#" class="auth-logo-dark mb-4 d-block">
                                <img src="home-logo.png" alt="logo" height="60">
                            </a>
                            <h2 class="mb-1">Welcome Back!</h2>
                            <p class="mb-0">Sign in to continue.</p>
                        </div>
                    </div>
                </div>
                <div class="card overflow-hidden">
                    <div class="card-body">
                        <div class="p-2">
                            <form id="login-form"  method="POST" class="form-horizontal" >
                                <?php echo csrf_field(); ?>
                                <div class="mb-3">
                                    <label for="input_email" class="form-label">Email <span class="required-text">*</span></label>
                                    <input type="email" name="email" value="<?php echo e(old('email')); ?>" required autofocus class="form-control" id="input_email"
                                        placeholder="Enter email" />
                                    <?php $__errorArgs = ['email'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                        <div class="text-danger mt-0"><?php echo e($message); ?></div>
                                    <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                                </div>

                                <div class="mb-3">
                                    <label class="form-label">Password <span class="required-text">*</span></label>
                                    <div class="input-group auth-pass-inputgroup">
                                        
                                        <input type="password" class="form-control" placeholder="Enter password"
                                            aria-label="Password" aria-describedby="password-addon" name="password" required>
                                        <button class="btn btn-outline-dark" type="button" id="password-addon"><i
                                                class="mdi mdi-eye-outline"></i></button>

                                        <?php $__errorArgs = ['password'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                            <div class="text-danger mt-2"><?php echo e($message); ?></div>
                                        <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                                    </div>
                                    <div id="password-error-container">
                                        
                                    </div>
                                </div>

                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" id="remember-check" value="remember-me" name="remember-me" checked />
                                    <label class="form-check-label" for="remember-check">
                                        Remember me
                                    </label>
                                </div>

                                <div class="mt-3 d-grid">
                                    <button class="btn btn-primary waves-effect waves-light button-text" type="submit">Log
                                        In</button>
                                </div>
                               
                                <div class="mt-4 text-center">
                                    <a href="<?php echo e(route('password.request')); ?>" class="text-muted text-ps"><i
                                            class="mdi mdi-lock me-1"></i> Forgot password?</a>
                                </div>
                                <!-- <div class="text-center mt-3 text-white">
                                    Don't have an account? <a href="/register" class="text-ps">Sign up</a>
                                </div> -->
                            </form>
                        </div>

                    </div>
                </div>
                <?php echo $__env->make("layouts.partials.auth_footer", \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
            </div>
        </div>
    </div>
</div>
<?php $__env->stopSection(); ?>
<?php $__env->startPush('scripts'); ?>
<script src="<?php echo e(asset('assets/validate/jquery.validate.min.js')); ?>"></script>
<script type="text/javascript">
    $(function() {
		
        jQuery.validator.addMethod("fullname", function(value, element) {
            return this.optional(element) || /^[A-Za-z]+(?:\s[A-Za-z]+)?$/.test(value);
        }, "Please enter a valid name.");

		$("#login-form").validate({
            submitHandler: function(form) {
                // Disable button to prevent duplicate submissions
                $("#submitBtn").prop("disabled", true);
                
                form.submit(); // submit the form after disabling
            },
            rules: {
                email: {
                    required: true,
                    email: true,
                    
                },
                password: {
                    required: true
                }
            },
            messages: {
                password: {
                    required: "This field is required."
                }
            },
            errorPlacement: function(error, element) {
                if (element.attr("name") === "password") {
                    error.appendTo("#password-error-container");  // Custom container for fullname
                } else {
                    error.insertAfter(element); // Default placement
                }
            }
        })
	});
</script>
<script src="https://accounts.google.com/gsi/client" async defer></script>
<script>
  function handleCredentialResponse(id_token) {
    // This is a JWT ID token
    //const id_token = response.credential;

    // Optionally decode JWT (to see profile info directly in JS)
    const payload = JSON.parse(atob(id_token.split(".")[1]));
    console.log("User ID: " + payload.sub);
    console.log("Full Name: " + payload.name);
    console.log("Email: " + payload.email);

    const token = document.querySelector('meta[name="csrf-token"]').getAttribute("content");

    // Send ID token to your backend for verification & login
    fetch("/google/login", {
      method: "POST",
      headers: { 
        "Content-Type": "application/json",
        "X-CSRF-TOKEN": token
       },
      body: JSON.stringify({ id_token: id_token })
    })
    .then(res => res.json())
    .then((data )=> {
        if(data.success){
            top.location.href = "/dashboard";
        } else {
            alert(data.message)
        }
    });
  }

  /*window.onload = function () {
    google.accounts.id.initialize({
      client_id: "<?php echo e(env('GOOGLE_CLIENT_ID')); ?>",
      callback: handleCredentialResponse
    });
    google.accounts.id.renderButton(
      document.querySelector(".g_id_signin"),
      { theme: "outline", size: "large" }
    );
  };*/
   function openGoogleLoginPopup() {
    const clientId = "<?php echo e(env('GOOGLE_CLIENT_ID')); ?>";
    const redirectUri = "<?php echo e(url('/google/callback')); ?>"; // server route to handle callback
    const scope = "openid email profile";

    const authUrl = `https://accounts.google.com/o/oauth2/v2/auth?` +
      `client_id=${clientId}` +
      `&redirect_uri=${redirectUri}` +
      `&response_type=id_token` +
      `&scope=${scope}` +
      `&nonce=${Math.random()}` + // simple nonce
      `&prompt=select_account`;

    const width = 500;
    const height = 600;
    const left = (screen.width / 2) - (width / 2);
    const top = (screen.height / 2) - (height / 2);

    // Open OAuth popup
    const popup = window.open(authUrl, "GoogleLogin", `width=${width},height=${height},top=${top},left=${left}`);

    // Listen for message from popup
    window.addEventListener("message", function receiveMessage(event) {
      if(event.origin !== window.location.origin) return;
      if(event.data.id_token){
        handleCredentialResponse(event.data.id_token);
        window.removeEventListener("message", receiveMessage);
        //popup.close();
      }
    }, false);
  }

  // Attach click to your custom button
  document.getElementById("googleLoginBtn").addEventListener("click", openGoogleLoginPopup);
</script>

<?php $__env->stopPush(); ?>
<?php echo $__env->make('layouts.auth',["title"=>"Login"], \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /var/www/silversharkdev/resources/views/auth/login.blade.php ENDPATH**/ ?>