<!doctype html>

<html>
  <head>
    <link rel="stylesheet" href="lib/style.css">
    <script src="lib/script.js"></script>
    <title>Rough Engine Horsepower Calculator++</title>
  </head>

  <body>
    <h1>Engine "Rough" Horsepower Plus By Camero</h1>
    <p>This is a simple program to calculate rough horsepower of an engine, based on "mean" compression ratio. This program is extremely ballpark, don't except accurate results.</p>
    <p>However, you're free to grab some hot numbers and see what they put out.</p>
    <p>This program is inspired by <a href="http://www.bgsoflex.com/roughhp.html" target=_blank>Bowling's Rough Engine Horsepower Calculator.</a></p>
    <form name="input">
          <hr/>
          <h2 class="ft">User Input</h2>
      <p class="ft">Engine Displacement: <input name="disp" type="number" value="350.0" min="1" maxlength="5">
      <select name="unit">
        <option>C.I.</option>
        <option>Lt.</option>
        <option>C.C.</option>
      </select></p>
      <p class="ft">Mean Compression Ratio: <input name="cr" step = "0.1" type="number" value="8.5" min="2" max="29.9"></p>
      <p class="ft">Engine Peak Power RPM: <input name="rpm" type="number" value="4500" min="100" maxlength="5"></p>
      <p><input name="tr" type="checkbox" value="1.75">Turbocharged <input name="tn" type="checkbox" value="1.1">Tuned<input name="tf" type="checkbox" value="1.05">High-Octane Fuel</p><br>
      <input type="button" value="Compute" onclick=horse()>
      <button type="reset">Reset</button>
          <hr>
    </form>
    <p id="sub">Rights of this program goes to Camero. Using this program is free.</p>
    <p id="sub">camero2000@tutanota.com</p>
  </body>
</html>
/* Add your styles here */

h1{
  color:slategray;
}
h2{
  color:darkslategray;
}
a:hover{
  color:red;
}
a:focus{
  color:brown;
}
a{
  color:black;
}
body{
  background-color:#FEFDEC
}
form{
  background-color:#FEEDDC;
}
#sub
{
  font-size: small;
  font-style: italic;
}
.ft{
  padding-left: 9px;
}
button,input[type="button"]{
  margin-left: 8px;
  width:100px;
}
input[type="number"],input[type="text"]{
  position: absolute;
  left: 200px;
  border-radius:9px;
  border-bottom-color:black;
  border-right-color:black;
  width:120px;
  margin-left: 5px;
}
input[type="checkbox"]{
  margin-left: 9px;
}
select{
  border-radius: 9px;
  position: absolute;
  left: 262px;
}
function horse()
{
  var unit,turbo,tune,octane;
  if(input.unit.value == "C.I.")
    unit = 1;
  else if(input.unit.value == "Lt.")
    unit = 61.02;
  else
    unit = 0.06102;
  
  if(input.tr.checked)
    turbo = 1.75;
  else
    turbo = 1;
  
  if(input.tn.checked)
    tune = 1.15;
  else
    tune = 1;

  if(input.tf.checked)
    octane = 1.05;
  else
    octane = 1;
  var horsepower = (unit*input.disp.value*input.cr.value*input.rpm.value*turbo*tune*octane/54866).toFixed();
  alert("Computed engine HP is: " + horsepower + "HP");
}