Diferencia entre revisiones de «Widget:Calculator»
De Wikiexplora
(No se muestran 10 ediciones intermedias del mismo usuario) | |||
Línea 1: | Línea 1: | ||
<form action="" id="calculator" onsubmit="return false;"> | <form action="" id="calculator" onsubmit="return false;"> | ||
<div> | <div> | ||
− | <div class=" | + | <div class="calculator-boxes"> |
<fieldset> | <fieldset> | ||
<legend>Calculate the time</legend> | <legend>Calculate the time</legend> | ||
− | <label | + | <label><input type="checkbox" id="roundtrip" name="roundtrip" value="RoundTrip" />Is a round trip</label> |
<br/> | <br/> | ||
− | <label>Mean altitude of the whole route</label> | + | <label class="calculator-label">Mean altitude of the whole route:</label> |
<input type="text" id="altitude" name="altitude" value="" /> | <input type="text" id="altitude" name="altitude" value="" /> | ||
<br/> | <br/> | ||
− | <label>Distancia horizontal en metros</label> | + | <label class="calculator-label">Distancia horizontal en metros:</label> |
<input type="text" id="horizontal" name="horizontal" value="" /> | <input type="text" id="horizontal" name="horizontal" value="" /> | ||
<br/> | <br/> | ||
− | <label>Metros de ascenso</label> | + | <label class="calculator-label">Metros de ascenso:</label> |
<input type="text" id="ascenso" name="ascenso" value="" /> | <input type="text" id="ascenso" name="ascenso" value="" /> | ||
<br/> | <br/> | ||
− | <label>Metros de descenso</label> | + | <label class="calculator-label">Metros de descenso:</label> |
<input type="text" id="descenso" name="descenso" value="" /> | <input type="text" id="descenso" name="descenso" value="" /> | ||
Línea 30: | Línea 30: | ||
</form> | </form> | ||
<script> | <script> | ||
− | function calculateTotal() | + | function calculateTotal(){ |
− | { | + | |
var theForm = document.forms["calculator"]; | var theForm = document.forms["calculator"]; | ||
var altitude= parseInt(theForm.elements["altitude"].value); | var altitude= parseInt(theForm.elements["altitude"].value); | ||
Línea 38: | Línea 37: | ||
var descenso= parseInt(theForm.elements["descenso"].value); | var descenso= parseInt(theForm.elements["descenso"].value); | ||
− | var total = (horizontal | + | var total = (horizontal * 0.75 + ascenso * 7.2 + descenso * 2.4) * (4 * Math.pow(10, -12) * Math.pow(altitude , 3) - 9 * Math.pow(10 , -9) * Math.pow(altitude , 2) + 4 * Math.pow(10, -5) * altitude + 0,9999) * (1/3600); |
− | + | total = Math.round(total * 100) / 100; | |
+ | |||
//display the result | //display the result | ||
var divobj = document.getElementById('totalTime'); | var divobj = document.getElementById('totalTime'); | ||
Línea 46: | Línea 46: | ||
} | } | ||
+ | |||
+ | jQuery( document ).ready(function() { | ||
+ | $('#roundtrip').click(function(){ | ||
+ | if (this.checked) { | ||
+ | $('input#descenso').css('display', 'none') | ||
+ | } | ||
+ | }) | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
</script> | </script> | ||
+ | <style> | ||
+ | .calculator-label{ | ||
+ | display: block; | ||
+ | } | ||
+ | div#totalTime { | ||
+ | font-size: 110%; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | </style> |
Revisión del 21:43 19 ago 2017
<form action="" id="calculator" onsubmit="return false;">
<fieldset> <legend>Calculate the time</legend> <label><input type="checkbox" id="roundtrip" name="roundtrip" value="RoundTrip" />Is a round trip</label>
<label class="calculator-label">Mean altitude of the whole route:</label> <input type="text" id="altitude" name="altitude" value="" />
<label class="calculator-label">Distancia horizontal en metros:</label> <input type="text" id="horizontal" name="horizontal" value="" />
<label class="calculator-label">Metros de ascenso:</label> <input type="text" id="ascenso" name="ascenso" value="" />
<label class="calculator-label">Metros de descenso:</label> <input type="text" id="descenso" name="descenso" value="" />
</fieldset>
<input type='submit' id='submit' value='Submit' onclick="calculateTotal()" /> </div>
</form> <script> function calculateTotal(){
var theForm = document.forms["calculator"]; var altitude= parseInt(theForm.elements["altitude"].value); var horizontal= parseInt(theForm.elements["horizontal"].value); var ascenso= parseInt(theForm.elements["ascenso"].value); var descenso= parseInt(theForm.elements["descenso"].value);
var total = (horizontal * 0.75 + ascenso * 7.2 + descenso * 2.4) * (4 * Math.pow(10, -12) * Math.pow(altitude , 3) - 9 * Math.pow(10 , -9) * Math.pow(altitude , 2) + 4 * Math.pow(10, -5) * altitude + 0,9999) * (1/3600); total = Math.round(total * 100) / 100;
//display the result var divobj = document.getElementById('totalTime'); divobj.style.display='block'; divobj.innerHTML = "Total time: "+total;
}
jQuery( document ).ready(function() {
$('#roundtrip').click(function(){ if (this.checked) { $('input#descenso').css('display', 'none') }
}) });
</script> <style> .calculator-label{
display: block;
} div#totalTime {
font-size: 110%; font-weight: bold;
} </style>