<html>
<head> 
<title>One Punch-Man</title>
<script>
function validarEmail(valor) {
      re=/^[_a-z0-9-]+(.[a-z0-9-]+)*@[a-z0-9-]+(.[a-z0-9-]+)*(.[a-z]{2,3})$/
      if (!re.exec(valor)){
          return false;
}else{
      return true;
}
}


function nif(dni) {
  numero = dni.substr(0,dni.length-1);
  let = dni.substr(dni.length-1,1);
  let = let.toUpperCase();
  numero = numero % 23;
  letra='TRWAGMYFPDXBNJZSQVHLCKET';
  letra=letra.substring(numero,numero+1);
  if (letra!=let) 
    alert('Dni erroneo');
}



function validacion() {
email = document.getElementById("email").value;
if (!validarEmail(email)) alert("Email erroneo")
dni = document.getElementById("dni").value;
nif(dni);

valor=document.getElementById("nombre").value;
if(valor == null || valor.length == 0 || /^\s+$/.test(valor) ) {
   alert("Rellena el nombre");
}
valor=document.getElementById("apellidos").value;
if(valor == null || valor.length == 0 || /^\s+$/.test(valor) ) {
   alert("Rellena apellidos");
}

valor=document.getElementById("direccion").value;
if(valor == null || valor.length == 0 || /^\s+$/.test(valor)){
   alert("Rellena direccion");
}

valor=document.getElementById("cp").value;
if(isNaN(valor) ) {
  alert("Rellena el C.P.");
}

indice = document.getElementById("localidad").selectedIndex;
if(indice == null || indice == 0 ) {
  alert("Selecciona localidad");
}


opciones = document.getElementsByName("sexo");
var seleccionado = false;
for (var i=0; i<opciones.length; i++) {
    if(opciones[i].checked) {
       seleccionado = true;
       break;
    }
}
if(!seleccionado) {
  alert("Marca sexo");
}
elemento=document.getElementById("contrato");
if(!elemento.checked){
  alert("Acepta el contrato");
}
}



</script>
</head>
<body background="maxresdefault.png"><span id="liveclock" style="position:absolute;left:0;top:0;"></span>
   <script language="JavaScript" type="text/javascript">
    function show5(){
        if (!document.layers&&!document.all&&!document.getElementById)
        return

         var Digital=new Date()
         var hours=Digital.getHours()
         var minutes=Digital.getMinutes()
         var seconds=Digital.getSeconds()

        var dn="PM"
        if (hours<12)
        dn="AM"
        if (hours>12)
        hours=hours-12
        if (hours==0)
        hours=12

         if (minutes<=9)
         minutes="0"+minutes
         if (seconds<=9)
         seconds="0"+seconds
        //change font size here to your desire
        myclock="<font color='#41FFC6' size='15' face='Arial' ><b><font size='1'>Hora actual:</font></br>"+hours+":"+minutes+":"
         +seconds+" "+dn+"</b></font>"
        if (document.layers){
        document.layers.liveclock.document.write(myclock)
        document.layers.liveclock.document.close()
        }
        else if (document.all)
        liveclock.innerHTML=myclock
        else if (document.getElementById)
        document.getElementById("liveclock").innerHTML=myclock
        setTimeout("show5()",1000)
         }


        window.onload=show5
         //-->
     </script>
<center>
<table style="border:1px solid;width:890px;height:200px">
<tr style="background-color:#BEBFC1">

<td style="border:1px solid;"><img src="One-Punch-Man-Character-Wallpaper_phixr.jpg" style="width:1150px;height:350px"></td>
</tr>
</table>
<table style="Border:1px solid;width:1150px;height:5px">
<tr style="background-color:#CB89FA"> 
<td style="border:1px solid;"><strong><i><center><a href="index.html" style="text-decoration:none">¿Qué es?</A></center></strong></i></td>
<td style="border:1px solid;"><strong><i><center><a href="Saitama.html" style="text-decoration:none">Saitama</A></center></strong></i></td>
<td style="border:1px solid;"><strong><i><center><a href="Genos.html" style="text-decoration:none">Genos</A></center></strong></i></td>
<td style="border:1px solid;"><strong><i><center><a href="King.html" style="text-decoration:none">King</A></center></strong></i></td>
<td style="border:1px solid;"><strong><i><center><a href="Bang.html" style="text-decoration:none">Bang</A></center></strong></i></td>
<td style="border:1px solid;"><strong><i><center><a href="Tornado.html" style="text-decoration:none">Tornado</A></center></strong></i></td>
<td style="border:1px solid;"><strong><i><center><a href="Blizzard.html" style="text-decoration:none">Blizzard</A></center></strong></i></td>
<td style="border:1px solid;"><strong><i><center><a href="Galeria.html" style="text-decoration:none">Galería</A></center></strong></i></td>
<td style="border:1px solid;"><strong><i><center><a href="Contacto.html" style="text-decoration:none">¿Quiéres saber más?</A></center></strong></i></td>
<script Language="JavaScript">

<!-- Helpers for JSI page...

// Navigation - Start

function goback(){

alert("Good Bye!");

history.go(-1);

}

function gettheDate() {

Todays = new Date();

TheDate = "" + (Todays.getMonth()+ 1) +" / "+ Todays.getDate() + " / " + (Todays.getYear() + 1900) 

document.clock.thedate.value = TheDate;

}

// Navigation - Stop

// Netscapes Clock - Start

// this code was taken from Netscapes JavaScript documentation at

// www.netscape.com on Jan.25.96



var timerID = null;

var timerRunning = false;

function stopclock (){

	if(timerRunning)

		clearTimeout(timerID);

	timerRunning = false;

}



function startclock () {

	// Make sure the clock is stopped

	stopclock();

	gettheDate()

	showtime();

}



function showtime () {

	var now = new Date();

	var hours = now.getHours();

	var minutes = now.getMinutes();

	var seconds = now.getSeconds()

	var timeValue = "" + ((hours >12) ? hours -12 :hours)

	timeValue += ((minutes < 10) ? ":0" : ":") + minutes

	timeValue += ((seconds < 10) ? ":0" : ":") + seconds

	timeValue += (hours >= 12) ? " P.M." : " A.M."

	document.clock.face.value = timeValue;

	// you could replace the above with this

	// and have a clock on the status bar:

	// window.status = timeValue;

	timerID = setTimeout("showtime()",1000);

	timerRunning = true;

}

// Netscapes Clock - Stop



// end Helpers -->

</script>

<table style="Border:0px solid;width:750px;height:100px">
<td><br><FONT face="Fantasía" SIZE=4 COLOR=#C902FA ><br><big><b>CONTACTO</big></b>
<form action="ver.php" method=post>
<table>
<br><tr><td><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>Nombre:</big>
       <input type=text size=10 id=nombre name=nombre></td>
 

</tr><tr>
<td><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>Apellidos:</big><input type=text size=10 id=apellidos name=apellidos></td>

</tr><tr>
<td><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>Direccion</big><input type=text size=10 id=direccion name=direccion></td>
</tr><tr>

<td><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>C.P:</big><input type=text size=10 id=cp name=cp value="Lucena"></td>
</tr><tr>
    <td><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>Localidad:</big>
    <select name=localidad id=localidad>
    <option value=0>Elige Localidad</option>
    <option value="Lucena">Lucena</option>
    <option value="Benameji">Benameji</option>
    <option value="Cabra">Cabra</option>
    </select>
</td>
</tr><tr>    <td><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>Sexo:</big><Font face="Fantasía" Size=4 Color=#41FFC6 >
       <big>Hombre:</big><input type=radio id=sexo name=sexo value="hombre">
<Font face="Fantasía" Size=4 Color=#41FFC6 > <big>Mujer:</big><input type=radio name=sexo value="mujer">
</td>
</tr>
<tr>
<td><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>Email:</big><input type="text" size=10 id=email name=email></td>

</tr>
<tr><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>DNI:</big><input type="text" size=10 id=dni name=dni></td>
 <tr/>

<td><br><br><Font face="Fantasía" Size=4 Color=#41FFC6 ><big>Acepto los términos del contrato:</big></td>
<td><br><br>
<input type=checkbox id=contrato name=contrato value="acepto">
</td>
</tr>
<tr>    <td><br><br></td>
       <td><br><br>
       <input type=button value="ENVIAR" onclick="validacion()">

</form>
</td>
</tr>

</table>
</body>
</html>