Programacion

<HTML>
<HEAD>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0" />
	<title>Bateria</title>
	<style>
	label {
		color: white;
		font-size: 25px;
	}
	
	#resultado{
		color: #d0f8d2;
		font-size: 32px;
	}

select, .texto { 
		width: 70px; 
		height: 35px;
		font-size: 20px;
		background: #f0d3b2; 
		border-radius: .3em;
		border: none;
		margin: 2px;
	}
	
	.btn {
	  border: none; 
	  color: white; 
	  padding: 14px 100px;
	  border-radius: 5px; 
	}

.primary {background-color: #007bff;} 
	.primary:hover {background-color: #4b7dda;}
	
	.conjunto { 
		width: 90px; 
		font-size: 20px;
		background: #f0d3b2; 
		border-radius: .3em;
		padding: 7px;
		color: black;
	}
	</style>
	<script>
	function calcular(){
		const multiplos = [0.000000001,0.000001,0.001,1,"nA","uA","mA","A"];
		var A1 = document.getElementById("A1").value;
		var A2 = document.getElementById("A2").value;
		var a = document.getElementById("uno").value;
		var b = document.getElementById("dos").value;
		var tiempo, residuo;
		
		A1=parseFloat(A1);
		A2=parseFloat(A2);
		a=parseInt(a);
		b=parseInt(b);
		
		document.getElementById("capacidad").innerHTML = A1 + multiplos[a+4] + "h";
		document.getElementById("carga").innerHTML = A2 + multiplos[b+4];
		
		A1 = A1 * multiplos[a];
		A2 = A2 * multiplos[b];
		
		tiempo = A1 / A2;
		
		if(tiempo >= 8640){
			tiempo = tiempo / 8640;
			residuo = tiempo % 1;
			tiempo = Math.floor(tiempo) + " Años y ";
			tiempo = tiempo + (residuo * 12).toFixed(0) + " meses";
			
		}else{
			if(tiempo >= 720){
				tiempo = tiempo / 720;
				residuo = tiempo % 1;
				tiempo = Math.floor(tiempo) + " Meses y ";
				tiempo = tiempo + (residuo * 30).toFixed(0) + " dias";
				
			}else{
				if(tiempo >= 24){
					tiempo = tiempo / 24;
					residuo = tiempo % 1;
					tiempo = Math.floor(tiempo) + " Dias y ";
					tiempo = tiempo + (residuo * 24).toFixed(0) + " Horas";
					
				}else{
					residuo = tiempo % 1;
					tiempo = Math.floor(tiempo) + " Horas y ";
					tiempo = tiempo + (residuo * 60).toFixed(0) + " Minutos";
				}
			}
		}
		
		document.getElementById("resultado").innerHTML = tiempo;
		document.getElementById("utilidad").innerHTML = tiempo;
		
	}
	</script>
</HEAD>
<BODY BGCOLOR="#242a3e"	ALIGN="center">
	<label><u>Tiempo de suministro de bateria</u><label>
	<br><br>
	Capacidad de la bateria = 
	<input type="text" id="A1" value="1200" class="texto">
	<span class="conjunto">
	<select id="uno">
		<option value="0">nA</option>
		<option value="1">uA</option>
		<option value="2" selected>mA</option>
		<option value="3">A</option>
	</select>/Hora
	</span>
	<br>
	Corriente de la carga = 
	<input type="text" id="A2" value="75" class="texto">
	<select id="dos">
		<option value="0">nA</option>
		<option value="1">uA</option>
		<option value="2" selected>mA</option>
		<option value="3">A</option>
	</select>
	<br><br>
	<input type="button" value="Calcular tiempo de vida de la bateria" onClick="calcular()" class="btn primary">
	<br><br>
	<div id="resultado">16 Horas y 0 Minutos</div>
	<br>
	<svg height="70mm" width="86mm" style="background-color: #fff;">
		<polyline points="50,100 50,20 220,20 220,70 240,80 200,90 240,100 200,110 240,120 200,130 220,140 220,210 50,210 50,123" style="fill:none; stroke:#000; stroke-width:1mm" />
		<line stroke="black" stroke-width="1mm" x1="5mm" y1="27mm" x2="21mm" y2="27mm" />
		<line stroke="black" stroke-width="1mm" x1="9mm" y1="32mm" x2="17mm" y2="32mm" />
		<text id="capacidad" x="15mm" y="23mm">1200mAh</text>
		<text id="carga" x="60mm" y="41mm">75mA</text>
		<text id="utilidad" x="14mm" y="65mm">16 Horas y 0 Minutos</text>
	</svg>
</BODY>
</HTML>

Descargar archivo