Trinomio-API/crear.html at master · despedite/Trinomio-API · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<!DOCTYPE html>
<html>
<head>
	<!-- UTF-8 -->
	<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
	<meta content="utf-8" http-equiv="encoding">
	<!-- Favicon y nombre -->
	<link href="img/favicon.png" rel="icon" type="image/png">
	<!-- Si "?edit=true", entonces "Modificar persona - APIHook" -->
	<title>Agregar persona - APIHook</title>
	<!-- Iconos de Material Design -->
	<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
	<!-- Materialize -->
	<link href="css/materialize.min.css" media="screen,projection" rel="stylesheet" type="text/css">
	<script src="js/jquery-3.4.1.min.js" type="text/javascript">
	</script>
	<!-- Código para avisarle al navegador que es comp. con móviles -->
	<meta content="width=device-width, initial-scale=1.0" name="viewport">
	<!-- CSS personalizado -->
	<link href="css/style.css" media="screen,projection" rel="stylesheet" type="text/css">
	<!-- Código de Javascript -->
	<script src="js/crear.js" type="text/javascript"></script>
</head>
<body>
	<!-- Barra de Navegación -->
	<nav>
		<div class="nav-wrapper purple darken-2">
			<a class="brand-logo" href="index.html"><img src="img/logo.png" id="logo"></a>
			<ul class="right hide-on-med-and-down" id="nav-mobile">
				<li>
					<a href="https://github.com/despediteerik/Trinomio-API">Github</a>
				</li>
				<li>
					<a href="index.html">Personas</a>
				</li>
			</ul>
		</div>
	</nav>

  <!-- Formulario (aka el inicio real de la página) -->
  <div class="container">
  	<!-- El título cambia dependiendo de si "?edit=true" existe -->
	<h4 class="objpadding" id="mainTitle">Agregar una persona</h4><br>
	<div class="row">
	  <form action="./script.php" id="checkboxForm" method="get" name="dropdown">
		<div class="input-field col s12">
		  <input class="validate" id="text" name="first_name"> <label class="active" for="first_name">Nombre</label>
		</div>
		<div class="input-field col s12">
		  <input class="validate" id="surname" name="last_name"> <label class="active" for="last_name">Apellido</label>
		</div>
		<div class="input-field col s12">
		  <input class="validate" id="email" name="email"> <label class="active" for="email">Correo electrónico</label>
		</div>
		<!-- Estos placeholders de "Cargando..." se mantienen hasta que la checkbox se puebla con los valores en JSON. -->
		<!-- Probé poniendo unos preloaders al estilo de spinners, pero quedaban mal porque duraba un par de ms. la carga. -->
		<!-- Si no hay Internet, esta parte se va a mantener en su lugar, porque no le llegan las requests a la API. -->
		<div id="preloader">
		  <div class="col s4 cbox">
			<p><label><input disabled="disabled" type="checkbox"> <span>Cargando...</span></label></p>
		  </div>
		  <div class="col s4 cbox">
			<p><label><input disabled="disabled" type="checkbox"> <span>Cargando...</span></label></p>
		  </div>
		  <div class="col s4 cbox">
			<p><label><input disabled="disabled" type="checkbox"> <span>Cargando...</span></label></p>
		  </div><a class="btn disabled nicebtn objpadding">SUBIR</a>
		</div>
	  </form>
	</div>
  </div>

  <!-- Javascript para Materialize! (Aparentemente, cargarlo al final de la página lo hace más rápido.) -->
  <script src="js/materialize.min.js" type="text/javascript"></script>
</body>
</html>