<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Time Viewer</title>
  <script src="https://cdn.socket.io/4.0.1/socket.io.min.js"></script>
  <style>
    body {
      font-family: Arial, sans-serif;
      background-color: #2e2e2e;
      color: #ddd;
      padding: 20px;
    }
    h2 { color: #fff; }
    #username-form { margin-bottom: 30px; color: #fff; }
    input[type="text"], input[type="password"] {
      padding: 8px;
      width: 250px;
      margin: 10px 0;
      border: 1px solid #555;
      background-color: #333;
      color: #fff;
    }
    button {
      padding: 8px 15px;
      background-color: #555;
      color: #fff;
      border: none;
      cursor: pointer;
    }
    button:hover { background-color: #777; }
    #chat { display: none; margin-top: 20px; }
    #messages {
      height: 300px;
      overflow-y: auto;
      border: 1px solid #555;
      padding: 10px;
      background-color: #444;
      color: #fff;
      border-radius: 5px;
      margin-bottom: 20px;
    }
    .my-message {
      background-color: #5e5e5e;
      border-radius: 10px;
      margin-bottom: 10px;
      padding: 8px;
      max-width: 75%;
      margin-right: 0;
    }
    .other-message {
      background-color: #333;
      border-radius: 10px;
      margin-bottom: 10px;
      padding: 8px;
      max-width: 75%;
      margin-left: 0;
    }
    #input-message {
      width: 80%;
      padding: 10px;
      background-color: #444;
      color: #fff;
      border: 1px solid #555;
    }
    #send-button {
      padding: 10px 15px;
      background-color: #555;
      color: #fff;
      border: none;
      cursor: pointer;
    }
    #send-button:hover { background-color: #777; }
    .time {
      font-size: 0.75em;
      color: #bbb;
      margin-left: 5px;
    }
    #error-message {
      color: red;
      display: none;
    }
  </style>
</head>
<body>
  <h2>Bienvenido</h2>

  <div id="username-form">
    <label for="username">Elige tu nombre de usuario: </label>
    <input type="text" id="username" placeholder="Escribe tu nombre">
    <br>
    <label for="password">Contraseña: </label>
    <input type="password" id="password" placeholder="Escribe la contraseña">
    <br>
    <button onclick="joinChat()">Unirse</button>
    <p id="error-message">Contraseña incorrecta. Inténtalo de nuevo.</p>
  </div>

  <div id="chat">
    <div id="messages"></div>
    <input type="text" id="input-message" placeholder="Escribe tu mensaje">
    <button id="send-button">Enviar</button>
  </div>

  <script>
const _0x761f63=_0x1ef9;(function(_0x262006,_0x5d4085){const _0x42b5e0=_0x1ef9,_0x3246e7=_0x262006();while(!![]){try{const _0x384517=parseInt(_0x42b5e0(0x125))/0x1*(parseInt(_0x42b5e0(0x139))/0x2)+-parseInt(_0x42b5e0(0x148))/0x3+parseInt(_0x42b5e0(0x13e))/0x4*(-parseInt(_0x42b5e0(0x13b))/0x5)+-parseInt(_0x42b5e0(0x11e))/0x6+-parseInt(_0x42b5e0(0x138))/0x7*(parseInt(_0x42b5e0(0x143))/0x8)+-parseInt(_0x42b5e0(0x14b))/0x9*(parseInt(_0x42b5e0(0x126))/0xa)+parseInt(_0x42b5e0(0x120))/0xb;if(_0x384517===_0x5d4085)break;else _0x3246e7['push'](_0x3246e7['shift']());}catch(_0x539e32){_0x3246e7['push'](_0x3246e7['shift']());}}}(_0x5cf9,0xf1552));const socket=io(_0x761f63(0x144));function _0x1ef9(_0x557177,_0x40f7f2){const _0x5cf96c=_0x5cf9();return _0x1ef9=function(_0x1ef97b,_0x32fb6a){_0x1ef97b=_0x1ef97b-0x11b;let _0x5728c9=_0x5cf96c[_0x1ef97b];return _0x5728c9;},_0x1ef9(_0x557177,_0x40f7f2);}function _0x5cf9(){const _0x438b47=['createElement','7031232hgcJlx','click','42536813ABpyLr','send-button','addEventListener','innerHTML','div','1566976TsGbTm','3315040SPrQSG','appendChild','Herramientas\x20de\x20desarrollo\x20deshabilitadas.','shiftKey','trim','ctrlKey','emit','password','getElementById','F12','key','chat','fromCharCode','length','charCodeAt','none','<br/>','chatMessage','4333uqVmBd','2pmAPMN','messages','1388430ODiAqR','join','style','8vxenHh','contextmenu','keydown','display','input-message','2528sitHxi','http://localhost:80','includes','preventDefault','block','2595279oetaks','username-form','error','45axCZqy','loginSuccess','message','value'];_0x5cf9=function(){return _0x438b47;};return _0x5cf9();}let username='';const secretKey=atob('WVtqe0RkJFJTXXRJWEIjdDQ5dDkzLl56QEwtRnA9TnpLXTdhXkREJV9DUktpZTgzOw==');function xorEncryptDecrypt(_0x2f1e91,_0x313920){const _0x2996db=_0x761f63;let _0x160c39='';for(let _0xd28038=0x0;_0xd28038<_0x2f1e91['length'];_0xd28038++){_0x160c39+=String[_0x2996db(0x132)](_0x2f1e91[_0x2996db(0x134)](_0xd28038)^_0x313920[_0x2996db(0x134)](_0xd28038%_0x313920[_0x2996db(0x133)]));}return _0x160c39;}document['addEventListener'](_0x761f63(0x140),_0x401347=>{const _0x49218e=_0x761f63;(_0x401347[_0x49218e(0x130)]===_0x49218e(0x12f)||_0x401347[_0x49218e(0x12b)]&&_0x401347[_0x49218e(0x129)]&&['I','J','C'][_0x49218e(0x145)](_0x401347[_0x49218e(0x130)]))&&(_0x401347[_0x49218e(0x146)](),alert(_0x49218e(0x128)));}),document[_0x761f63(0x122)](_0x761f63(0x13f),_0x4cfffd=>_0x4cfffd[_0x761f63(0x146)]());function joinChat(){const _0x3e0abb=_0x761f63;username=document[_0x3e0abb(0x12e)]('username')[_0x3e0abb(0x11c)];const _0x1d687d=document[_0x3e0abb(0x12e)](_0x3e0abb(0x12d))[_0x3e0abb(0x11c)];socket[_0x3e0abb(0x12c)](_0x3e0abb(0x13c),username,_0x1d687d);}socket['on'](_0x761f63(0x11b),function(_0x7123ef){const _0x1f0244=_0x761f63,[_0x305f29,_0x35ddb7]=_0x7123ef['split'](_0x1f0244(0x136)),_0x44e94d=xorEncryptDecrypt(_0x35ddb7,secretKey),_0x5efaef=document[_0x1f0244(0x11d)](_0x1f0244(0x124));_0x5efaef[_0x1f0244(0x123)]=_0x305f29+_0x1f0244(0x136)+_0x44e94d,document['getElementById'](_0x1f0244(0x13a))[_0x1f0244(0x127)](_0x5efaef);}),socket['on'](_0x761f63(0x14a),function(_0x311d74){const _0x32b593=_0x761f63;document[_0x32b593(0x12e)]('error-message')[_0x32b593(0x13d)][_0x32b593(0x141)]='block';}),socket['on'](_0x761f63(0x14c),function(){const _0x2cd651=_0x761f63;document['getElementById'](_0x2cd651(0x149))['style']['display']=_0x2cd651(0x135),document[_0x2cd651(0x12e)](_0x2cd651(0x131))['style'][_0x2cd651(0x141)]=_0x2cd651(0x147);});function sendMessage(){const _0x5e5751=_0x761f63,_0x4be7d9=document[_0x5e5751(0x12e)](_0x5e5751(0x142))['value'];_0x4be7d9[_0x5e5751(0x12a)]()!==''&&(socket[_0x5e5751(0x12c)](_0x5e5751(0x137),_0x4be7d9),document[_0x5e5751(0x12e)](_0x5e5751(0x142))['value']='');}document[_0x761f63(0x12e)](_0x761f63(0x121))[_0x761f63(0x122)](_0x761f63(0x11f),sendMessage),document[_0x761f63(0x12e)](_0x761f63(0x142))[_0x761f63(0x122)](_0x761f63(0x140),function(_0x31b256){const _0x4c1bdd=_0x761f63;_0x31b256[_0x4c1bdd(0x130)]==='Enter'&&(sendMessage(),_0x31b256[_0x4c1bdd(0x146)]());});
  </script>
</body>
</html>
