<?php

include 'classes/class.loader.php';
$html = new html();
$loader = new loading();
$videos = ['assets/bg.mp4', 'assets/bg_2.mp4', 'assets/bg_3.mp4', 'assets/bg_4.mp4'];
$loader->background_video_with_preloader("Playing fetch with your data...", $videos);

?>

<body>
    <!-- Login container -->
    <div class="login-container">
        <h2>FORGOT PASSWORD</h2>
        <div id="step_1">
            <h3>Please enter your email liked to this account</h3>
            <input type="text" id="email" name="email" placeholder="email" required />
            <button value="SEND" onclick="send_email()">SEND</button>
        </div>
        <div id="step_2" style="display:none;">
            <h3>Please enter OTP from email sent</h3>
            <input type="text" id="otp" name="otp" placeholder="OTP" required />
            <button value="CONFIRM" onclick="check_otp()">CONFIRM</button>

        </div>
        <div id="step_3" style="display:none;">
            <h3>Please enter new password</h3>
            <input type="text" id="password_1" name="password_1" placeholder="NEW PASSWORD" required />
            <input type="text" id="password_2" name="password_2" placeholder="AGAIN" required />
            <br>
            <br>
            <button style='width:100%;' onclick="update_pass()">DONE</button>

        </div>
    </div>

    <script>
        function send_email() {
            var email = document.getElementById('email').value;
            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'forgot_pass/send_email_forgot_password.php', true);
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            xhr.onreadystatechange = function () {
                if (xhr.readyState === XMLHttpRequest.DONE) {
                    if (xhr.status === 200) {
                        if (xhr.responseText.length > 0) {

                            document.getElementById('step_1').style.display = 'none';
                            document.getElementById('step_2').style.display = 'block';
                            console.log("forgot_pass/send_email_forgot_password.php");

                        } else {
                            alert('Email not found');
                        }
                    }
                }
            };
            xhr.send('email=' + encodeURIComponent(email));
        }
        function check_otp() {
            var otp_input = document.getElementById('otp').value;
            var email = document.getElementById('email').value;

            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'forgot_pass/check_otp.php', true);
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            xhr.onreadystatechange = function () {
                if (xhr.readyState === XMLHttpRequest.DONE) {
                    if (xhr.status === 200) {
                        console.log(xhr.responseText);
                        if (xhr.responseText == 1) {

                            document.getElementById('step_2').style.display = 'none';
                            document.getElementById('step_3').style.display = 'block';

                        } else {
                            alert('OTP Incorrect');
                        }
                    }
                }
            };
            xhr.send('otp=' + encodeURIComponent(otp_input) + "&email=" + encodeURIComponent(email));
        }
        function update_pass() {
            var password_1 = document.getElementById('password_1').value;
            var password_2 = document.getElementById('password_2').value;
            var email = document.getElementById('email').value;
            if (password_1 == password_2) {

                var xhr = new XMLHttpRequest();
                xhr.open('POST', 'forgot_pass/change_password.php', true);
                xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
                xhr.onreadystatechange = function () {
                    if (xhr.readyState === XMLHttpRequest.DONE) {
                        if (xhr.status === 200) {
                            console.log(xhr.responseText);
                            if (xhr.responseText == 1) {
                                alert('Password changed');
                                window.location.href = 'login.php';
                            } else {
                                alert('Password not changed, Please contact support or try again later.');

                            }
                        }
                    }
                };
                xhr.send('password_1=' + encodeURIComponent(password_1) + "&email=" + encodeURIComponent(email));
            }
            else {
                alert("Password don't matched");
            }
        }
    </script>
</body>

</html>
  <div class="whatsapp-label">HELP</div>

    <!-- Floating button -->
    <a class="whatsapp-float" id="whatsappBtn" title="Message us on WhatsApp" target="_blank" rel="noopener noreferrer"
        href="#" aria-label="Open WhatsApp chat">
        <!-- WhatsApp SVG icon (official-looking) -->
        <svg viewBox="0 0 24 24" fill="none" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
            <path
                d="M20.52 3.48A11.9 11.9 0 0 0 12 0C5.373 0 .003 5.373.003 12 0 13.987.44 15.9 1.27 17.6L0 24l6.66-1.76a11.94 11.94 0 0 0 5.34 1.38h.01c6.627 0 12-5.373 12-12 0-3.19-1.24-6.18-3.48-8.04z"
                fill="#25D366" />
            <path
                d="M17.56 14.1c-.32-.16-1.9-.94-2.2-1.04-.3-.11-.52-.16-.74.16-.22.32-.86 1.04-1.06 1.25-.19.19-.39.21-.72.07-.32-.13-1.37-.51-2.61-1.62-.97-.86-1.62-1.92-1.81-2.24-.19-.32-.02-.49.14-.65.14-.14.32-.36.48-.54.16-.19.21-.32.32-.53.11-.21.05-.39-.03-.55-.08-.16-.74-1.78-1.02-2.44-.27-.64-.55-.55-.74-.56-.19-.01-.41-.01-.63-.01-.22 0-.58.08-.88.39-.3.31-1.15 1.12-1.15 2.73 0 1.6 1.18 3.14 1.34 3.36.16.22 2.32 3.66 5.62 5.12 3.3 1.46 3.3 0.97 3.9 0.91.6-.07 1.92-.78 2.19-1.53.27-.74.27-1.38.19-1.53-.08-.15-.3-.24-.62-.4z"
                fill="#fff" />
        </svg>
    </a>

    <script>
        // PHONE: user-provided local number (0645010642).
        // For reliable behaviour with wa.me we convert to international format.
        // South Africa country code = 27; remove leading zero from the local number.
        const localNumber = "0645010642";
        const intlNumber = localNumber.replace(/^0+/, ""); // removes leading zero(s)
        // If your country is South Africa, add 27 before the number:
        const countryCode = "27";
        const phoneForWA = countryCode + intlNumber; // -> "27645010642"

        // Prefilled message (exact text provided by user)
        const msg = "Good day Team, Please help with the following:";

        // Build links: prefer whatsapp:// for mobile apps, fallback to https://wa.me/ for web/mobile
        const encodedMsg = encodeURIComponent(msg);
        const waAppLink = "whatsapp://send?phone=" + phoneForWA + "&text=" + encodedMsg;
        const waWebLink = "https://wa.me/" + phoneForWA + "?text=" + encodedMsg;

        // Use web link by default (works on desktop & mobile); on some mobile browsers whatsapp:// may work.
        const anchor = document.getElementById("whatsappBtn");

        // Attempt to open app link on mobile — but final href will be web fallback.
        // We'll set href to web link so it also works in desktop browsers.
        anchor.href = waWebLink;

        // Optional: on mobile, try to open the app first then fallback to web.
        // (We do this by attempting to navigate to app scheme for short time.)
        function openWhatsAppPreferApp(e) {
            // On touch devices, try app; on desktop, just open web
            const isMobile = /Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
            if (!isMobile) return; // let default anchor behavior open new tab

            e.preventDefault();
            // Try app scheme
            const appUrl = waAppLink;
            const webUrl = waWebLink;

            // Create invisible iframe to try app URL (older technique)
            const start = Date.now();
            let didOpen = false;

            // For modern browsers, direct location change is OK.
            window.location = appUrl;

            // After short delay, navigate to web link (works as fallback)
            setTimeout(function () {
                // If still on the page, open web link
                // We guard to avoid double navigation in some environments
                if (Date.now() - start < 2000) {
                    window.location = webUrl;
                }
            }, 1500);
        }

        // Use the mobile-prefer behavior on click
        anchor.addEventListener("click", openWhatsAppPreferApp, { passive: false });
    </script>


<?php $html->html_end(); ?>