<!--                                                                                                             
               ████                                                                           ████               
             ███                                                                                 ███             
           ███                                        ██                                           ███           
        ████                                          ██                                             ████        
      ████                                                                                             ████      
    ████                                                                                                 ████    
  █████████████████████     ██               ████     ██    █████████████   █████████     █████████████████████  
                 ████     ████             ██████     ██              ███                   ████                 
               ███      ████             ███   ██     ██            ███                       ████               
             ███      ████             ███     ██     ██         ████       ███████████████      ███             
          ████      ███              ████████████     ██       ████                                ███           
        ████      ███              ███         ██     ██     ████                                    ████        
      ████      ██████████████  ████           ██     ██   ██████████████   ████████████████████       ████      
                                                                                                                 
       ██ INITIATING CONNECTION ██ TARGET: SLAIZEN.COM ██ ACCESSING CODEBASE ██ CONNECTION ESTABLISHED ██        
                                         ██ WELCOME TO THE UNDER-GRID ██                                         
      21  06    2007                                                                        08  10   1992        
         19 12 1 9 26 5 14                                                           10  9  13 13  25            
            14  5 26 9 1 12 19                                                 18 9 22  1 18 4  53853            
                  16   9 18  1  20 5                                       14 9 14 10  1                         
                      08       2724483                                   636679      76883647                    
              08 27328466  08       3335                              0 5683      08  08 3668466                 
          152883 65        85 38 7  77 34 3                           17     74   79      8    95697             
        96977   81         7817  53       1                          9     9   15          8    8 38895          
                8    4Ω4    8  2   3                                     8  17     3♎︎3    1    3                
           8    58          8    8   6                                 7   4   8           8    2                
            7    18       78     2 2                                  9  3 8    82       88    8                 
              2    7888883      8    1                                 287  2      88885    39                   
                08 1916918920                                                168251993112                        
-->
<!DOCTYPE html>
<html lang="fr">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Windows Live Messenger - Sign In</title>
<meta name="description" content="Simulation Windows Live Messenger fenêtres de connexion">
<link rel="icon" type="image/png" href="general/contact_chat_icon.png">
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║                                       ██ ACCESSING: CSS CORE ██                                       ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
<link rel="stylesheet" crossorigin="" href="index.css">
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║                                      ██ ACCESSING: LOCAL PAGE ██                                      ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->

<body>
    <div id="root">
        <div class="msn-profile-bg">
            <div class="absolute top-0 left-0 w-full bg-no-repeat msn-login-header-bg"
                style="background-image: url('scenes/default_background.jpg');"></div>
            <div class="msn-login-container win7 font-sans text-base">
                <div class="msn-avatar-group-lg">
                    <img class="msn-avatar-img-lg" src="avatars/default.png" alt="Avatar">
                    <img class="msn-avatar-frame-lg" src="general/status_frame_offline_large.png" alt="Frame">
                </div>
                <p class="msn-login-title">Sign in</p>
                <p class="msn-login-subtitle">Enter a name and a password to start chatting</p>
                <div class="msn-login-card">
                    <fieldset class="w-full">
                        <input id="login-email" class="w-full placeholder:italic" type="text"
                            placeholder="Example555@hotmail.com" required="" autocomplete="off">
                        <input id="login-pass" class="w-full mt-2 placeholder:italic" type="password"
                            placeholder="Enter your password" required="" autocomplete="new-password">
                        <div class="flex my-4">
                            <p>Sign in as:</p>
                            <div class="relative inline-block">
                                <div class="flex aerobutton cursor-pointer items-center px-1 ml-1 white-light"
                                    onclick="toggleStatusMenu(event)">
                                    <div class="flex items-center">
                                        <img src="general/online-dot.png" alt="Available" class="inline-block mt-0.5 mr-1 w-2">
                                        <p id="selected-status" class="ml-1 capitalize">(Available)</p>
                                    </div>
                                    <img src="general/arrow.png" class="inline-block mb-0.5 ml-2" alt="Toggle Dropdown">
                                </div>
                                <!-- Simple Status Menu -->
                                <div id="login-status-menu"
                                    class="hidden absolute bg-white border border-gray-300 shadow-md z-10 w-full top-full left-0">
                                    <div class="p-2 hover:bg-blue-100 cursor-pointer text-sm"
                                        onclick="setStatus('Available')">Available</div>
                                    <div class="p-2 hover:bg-blue-100 cursor-pointer text-sm"
                                        onclick="setStatus('Busy')">Busy</div>
                                    <div class="p-2 hover:bg-blue-100 cursor-pointer text-sm"
                                        onclick="setStatus('Away')">Away</div>
                                    <div class="p-2 hover:bg-blue-100 cursor-pointer text-sm"
                                        onclick="setStatus('Offline')">Appear offline</div>
                                </div>
                            </div>
                        </div>
                        <div>
                            <div class="msn-login-checkbox-group"><input type="checkbox" id="rememberme"><label
                                    for="rememberme">Remember me</label></div>
                            <div class="msn-login-checkbox-group"><input type="checkbox" id="rememberpassword"><label
                                    for="rememberpassword">Remember my password</label></div>
                            <div class="msn-login-checkbox-group"><input type="checkbox" id="signinautomatically"><label
                                    for="signinautomatically">Sign me in automatically</label></div>
                            <div class="msn-login-forgot-link"><a href="#" class="msn-login-link hover:underline">Forgot
                                    your
                                    password?</a></div>
                        </div>
                    </fieldset>
                    <div class="flex w-full gap-2 items-center mt-4 justify-center">
                        <button onclick="handleSignIn()">Sign in</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="msn-login-footer">
            <a href="#" class="msn-login-link hover:underline">Piracy statement</a>
            <span class="msn-login-link mx-1">|</span>
            <a href="#" class="msn-login-link hover:underline">Server status</a>
        </div>
    </div>
    </div>
</body>

</html>
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║                                       ██ AI JAVASCRIPT OUTPUT ██                                      ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
<script src="index.js"></script>
<script>
    window.onload = function () {
        const savedEmail = localStorage.getItem('loginEmail');
        const savedPass = localStorage.getItem('loginPass');
        const rememberMe = localStorage.getItem('rememberMe') === 'true';
        const rememberPass = localStorage.getItem('rememberPass') === 'true';
        const autoSignIn = localStorage.getItem('autoSignIn') === 'true';

        if (savedEmail) {
            document.getElementById('login-email').value = savedEmail;
            document.getElementById('rememberme').checked = rememberMe;
        }
        if (savedPass && rememberPass) {
            document.getElementById('login-pass').value = savedPass;
            document.getElementById('rememberpassword').checked = rememberPass;
        }
        if (autoSignIn) {
            document.getElementById('signinautomatically').checked = autoSignIn;
            if (savedEmail && savedPass) handleSignIn();
        }

        // Sync: if Remember Pass is checked, check Remember Me
        document.getElementById('rememberpassword').onchange = (e) => {
            if (e.target.checked) {
                document.getElementById('rememberme').checked = true;
            } else {
                localStorage.removeItem('loginPass');
                localStorage.removeItem('rememberPass');
                document.getElementById('login-pass').value = '';
                // Also clear auto sign in since it depends on password
                document.getElementById('signinautomatically').checked = false;
                localStorage.removeItem('autoSignIn');
            }
        };
        document.getElementById('rememberme').onchange = (e) => {
            if (!e.target.checked) {
                document.getElementById('rememberpassword').checked = false;
                document.getElementById('signinautomatically').checked = false;
                localStorage.removeItem('loginEmail');
                localStorage.removeItem('rememberMe');
                localStorage.removeItem('loginPass');
                localStorage.removeItem('rememberPass');
                localStorage.removeItem('autoSignIn');
                document.getElementById('login-pass').value = '';
            }
        };
        document.getElementById('signinautomatically').onchange = (e) => {
            if (e.target.checked) {
                document.getElementById('rememberme').checked = true;
                document.getElementById('rememberpassword').checked = true;
            } else {
                localStorage.removeItem('autoSignIn');
            }
        };
    };

    function handleSignIn() {
        const email = document.getElementById('login-email').value;
        const pass = document.getElementById('login-pass').value;
        const rememberMe = document.getElementById('rememberme').checked;
        const rememberPass = document.getElementById('rememberpassword').checked;
        const autoSignIn = document.getElementById('signinautomatically').checked;

        if (!email) {
            showModal('Please enter a name or email address');
            return;
        }

        if (!pass) {
            showModal('Please enter your password');
            return;
        }

        // Persistence
        if (rememberMe || rememberPass || autoSignIn) {
            localStorage.setItem('loginEmail', email);
            localStorage.setItem('rememberMe', rememberMe);
        } else {
            localStorage.removeItem('loginEmail');
            localStorage.removeItem('rememberMe');
        }

        if (rememberPass || autoSignIn) {
            localStorage.setItem('loginPass', pass);
            localStorage.setItem('rememberPass', rememberPass);
        } else {
            localStorage.removeItem('loginPass');
            localStorage.removeItem('rememberPass');
        }

        localStorage.setItem('autoSignIn', autoSignIn);
        localStorage.setItem('userEmail', email);
        window.top.location.href = 'contacts.html';
    }

    function showModal(msg) {
        if (window.parent && window.parent.showErrorModal) {
            window.parent.showErrorModal(msg);
        } else {
            alert(msg);
        }
    }

    function toggleStatusMenu(e) {
        const menu = document.getElementById('login-status-menu');
        if (menu) menu.classList.toggle('hidden');
        e.stopPropagation();
    }

    window.onclick = function () {
        const menu = document.getElementById('login-status-menu');
        if (menu) menu.classList.add('hidden');
    }

    function setStatus(status) {
        const selectedStatus = document.getElementById('selected-status');
        if (selectedStatus) selectedStatus.innerText = '(' + status + ')';
    }
</script>
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║                      ██ FIRST CREATED: 2026-03-27 ██ LAST UPDATED: 2025-03-31 ██                      ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║ ██ INTRUSION DETECTED ██                                                                              ║    
    ║ ██ UNAUTHORIZED ACCESS ATTEMPT LOGGED ██                                                              ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝-->
<!--╔═══════════════════════════════════════════════════════════════════════════════════════════════════════╗    
    ║ ██ TERMINATING CONNECTION ██                                                                          ║    
    ║ ██ DISCONNECTING FROM SLAIZEN.COM ██                                                                  ║    
    ║ ██ CONNECTION CLOSED ██                                                                               ║    
    ║                                                                                                       ║    
    ║ ██ YOU ARE NOW LEAVING THE UNDER-GRID ██                                                              ║    
    ╚═══════════════════════════════════════════════════════════════════════════════════════════════════════╝    
  ███████ ██       █████  ██ ███████ ███████ ███    ██     ██    ███ ███████ ███████ ██  █████       ██ ███████  
  ██      ██      ██   ██ ██    ███  ██      ████   ██     ██   ████      ██  ███    ██ ██   ██      ██      ██  
  ███████ ██      ███████ ██   ███   █████   ██ ██  ██     ██  ██ ██   █████   ███   ██ ███████      ██ ███████  
       ██ ██      ██   ██ ██  ███    ██      ██  ██ ██     ██ ██  ██      ██    ███  ██ ██   ██      ██ ██       
  ███████ ███████ ██   ██ ██ ███████ ███████ ██   ████     ████   ██ ███████ ███████ ██ ██   ██ ███████ ███████  
-->