index.html 2.29 KB
Newer Older
Adrian's avatar
Adrian committed
1
2
3
4
5
6
7
8
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>.:: Sitio ::.</title>
  <link rel="stylesheet" href="./style.css">
  <script type="text/javascript">
Adrian's avatar
cambios    
Adrian committed
9
    var baseURL = 'http://localhost:5000';
Adrian's avatar
Adrian committed
10
    function login () {
Adrian's avatar
cambios    
Adrian committed
11
12
13
14
15
16
17
18
19
20
21
22
23
      service(baseURL + '/login', { 
        usuario: document.getElementById('user').value,
        password: document.getElementById('password').value
      })
      .then((data) => {
        if (data.finalizado) {
          window.localStorage.setItem('site_token', data.datos.token);
          document.getElementById('login').style.display = 'none';
          document.getElementById('data').style.display = 'block';
        } else {
          alert('Datos incorrectos');
        }
      });
Adrian's avatar
Adrian committed
24
    }
Adrian's avatar
cambios    
Adrian committed
25
    async function service(url = '', data = {}, method = 'POST') {
Adrian's avatar
Adrian committed
26
      const response = await fetch(url, {
Adrian's avatar
cambios    
Adrian committed
27
        method: method,
Adrian's avatar
Adrian committed
28
29
30
31
32
33
34
35
36
37
38
39
40
        mode: 'cors',
        cache: 'no-cache',
        credentials: 'same-origin',
        headers: {
          'Content-Type': 'application/json'
        },
        redirect: 'follow',
        referrerPolicy: 'no-referrer',
        body: JSON.stringify(data)
      });
      return await response.json();
    }
    function sendData () {
Adrian's avatar
cambios    
Adrian committed
41
      service(baseURL + '/send', { 
Adrian's avatar
Adrian committed
42
43
        titulo: document.querySelector('#title').value,
        text: document.querySelector('#description').value
Adrian's avatar
Adrian committed
44
45
      })
      .then((data) => {
Adrian's avatar
Adrian committed
46
        alert('Mensaje enviado');
Adrian's avatar
Adrian committed
47
48
49
50
51
52
53
54
      });
    }
  </script>
</head>
<body>
    <div class="main">
      <section id="login">
        <form action="#" onsubmit="event.preventDefault(); login();" class="login">
Adrian's avatar
Adrian committed
55
56
          <input type="text" id="user" required placeholder="Usuario">
          <input type="password" id="password" required placeholder="Contraseña">
57
          <button type="submit">INGRESAR</button>
Adrian's avatar
Adrian committed
58
59
60
61
62
63
64
65
66
67
68
69
        </form>
      </section>
      <section id="data">
          <form action="#" onsubmit="event.preventDefault(); sendData()" class="form">
            <input type="text" id="title" required placeholder="Titulo">
            <textarea name="comments" required  placeholder="Descripción" id="description" cols="30" rows="20"></textarea>
            <button type="submit">Enviar</button>
          </form>
      </section>
    </div>
</body>
</html>