HTML5

HTML5 Class – Ben Vivante

Join Ben Vivante for HTML 5 Classes.  HTML5 is a core technology markup language of the Internet used for structuring and presenting content for the World Wide Web. As of October 2014 this is the final and complete fifth revision of the HTML standard of the World Wide Web Consortium (W3C). The previous version, HTML 4, was standardised in 1997. Class 1 – Declaring HTML5, some basic html, simple menu, bookmarks, header. index.html Class 2 – Adding a style sheet, tag and class based types. index1.html styles.css Class 3 – Adding images, videos, pdf’s. Zip with all files      
<head>
<!–PCI CALCULATOR–>
<!– Copyright 2010, Ben Vivante, Town of Brookline, MA –>
<!– This part can go in the HEAD of the html file –>
<script languPCI=”JavaScript” type=”text/javascript”>
<!–
function get_pci() {
 if (document.calc.Length.value.length == 0) {
      alert(‘Length field is empty!’); return false; }
 if (document.calc.Width.value.length == 0) {
      alert(‘Width field is empty!’); return false; }
 if (document.calc.PCI.value.length == 0) {
      alert(‘PCI field is empty!’); return false; }
 if (document.calc.typeoption.value.length == 0) {
      alert(‘Please Choose Type!’); return false; }
//Asphalt Road – Open    75 + ((45 * ((L * W)/9) * PCI)/5)
if (document.calc.typeoption[1].selected) {
    //document.calc.result_pci.value = 75+((45*(document.calc.Length.value))*((((document.calc.Width.value))/9))*(document.calc.PCI.value)/5);
document.calc.result_pci.value = 75+((45*(document.calc.Length.value))*((((document.calc.Width.value))/9))*(document.calc.PCI.value)/5);
}
//Asphalt Walk – Open      75 + ((27 * ((L * W)/9) * PCI)/5)
 if (document.calc.typeoption[2].selected) {
document.calc.result_pci.value = 75+(27*(document.calc.Length.value))*(((document.calc.Width.value)/9)*(document.calc.PCI.value)/5); }
//Asphalt Walk with Asphalt Road – Open    75+((27*((L*W)/9)*PCI)/5)+((45*((L*W)/9)*PCI)/5)
if (document.calc.typeoption[3].selected) {
document.calc.result_pci.value = 75+(27*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5)+(45*(document.calc.Length1.value))*((((document.calc.Width1.value))/9)*(document.calc.PCI.value)/5);
}
//Brick Walk – Open        75 + ((75 * ((L * W)/9) * PCI)/5)
if (document.calc.typeoption[4].selected) {
document.calc.result_pci.value = 75+(75*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5);
}
//Brick Walk with Asphalt Road – Open        75+((75*((L*W)/9)*PCI)/5)+((45*((L*W)/9)*PCI)/5)
if (document.calc.typeoption[5].selected) {
document.calc.result_pci.value = 75+(75*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5)+(45*(document.calc.Length1.value))*((((document.calc.Width1.value))/9)*(document.calc.PCI.value)/5);
}
//Brick Walk with Concrete Road – Open    75+((75*((L*W)/9)*PCI)/5)+((60*((L*W)/9)*PCI)/5)
if (document.calc.typeoption[6].selected) {
document.calc.result_pci.value = 75+(75*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5)+(60*
(document.calc.Length1.value))*((((document.calc.Width1.value))/9)*(document.calc.PCI.value)/5);
}
//Concrete Road – Open 75 + ((60 * ((L * W)/9) * PCI)/5)
if (document.calc.typeoption[7].selected) {
document.calc.result_pci.value = 75+(60*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5);
}
//Concrete Walk – Open   75 + ((36 * ((L * W)/9) * PCI)/5)
if (document.calc.typeoption[8].selected) {
document.calc.result_pci.value = 75+(36*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5);
}
//Concrete Walk with Asphalt Road – Open  75+((36*((L*W)/9)*PCI)/5)+((45*((L*W)/9)*PCI)/5)
if (document.calc.typeoption[9].selected) {
document.calc.result_pci.value = 75+(36*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5)+(45*
(document.calc.Length1.value))*((((document.calc.Width1.value))/9)*(document.calc.PCI.value)/5);
}
//Concrete Walk with Concrete Road – Open   75+((36*((L*W)/9)*PCI)/5)+((60*((L*W)/9)*PCI)/5)
if (document.calc.typeoption[10].selected) {
document.calc.result_pci.value = 75+(36*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5)+(60*
(document.calc.Length1.value))*((((document.calc.Width1.value))/9)*(document.calc.PCI.value)/5);
}
//Generates Error Message
if (document.calc.typeoption[11].selected) {
document.calc.result_pci.value = 75+(36*(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5)+(60*
(document.calc.Length.value))*((((document.calc.Width.value))/9)*(document.calc.PCI.value)/5);
}
//num1 = Math.pow(10, 2);
}
//–>
</script>
</head>
<body>
<script language=”JavaScript”>
<!–
// This will resize the window when it is opened or
// refresh/reload is clicked to a width and height of 500 x 500
// with is placed first, height is placed second
window.resizeTo(500,500)
–>
</script>
<!– This goes into the BODY of the file –><title>PCI Calculator</title>
<form name=”calc”>
<table border=”0″ align=”center” cellspacing=”3″ cellpadding=”0″ width=”300″ bgcolor=”#c0c0c0″>
 <tr>
  <td colspan=”2″ align=”center”>
    <label>
      <select name=”typeoption” id=”typeoption”>
<option>Choose Type</option>
<option value=”1″>Asphalt Road Open</option>
<option value=”2″>Asphalt Walk Open</option>
<option value=”3″>Asphalt Walk with Asphalt Road Open</option>
<option value=”4″>Brick Walk Open</option>
<option value=”5″>Brick Walk with Asphalt Road – Open</option>
<option value=”6″>Brick Walk with Concrete Road Open</option>
<option value=”7″>Concrete Road Open</option>
<option value=”8″>Concrete Walk Open</option>
<option value=”9″>Concrete Walk with Asphalt Road Open</option>
<option value=”10″>Concrete Walk with Concrete Road Open</option>
      </select>
    </label></td>
 </tr>
 <tr>
  <td align=”right”>
    <b>Length:</b>&nbsp;
  </td>
  <td>
    <input type=”text” name=”Length” size=”5″ />
    &nbsp;
    <input type=”text” name=”Length1″ size=”5″ id=”Length1″ /></td>
 </tr>
 <tr>
  <td align=”right”>
    <b>Width:</b>&nbsp;
  </td>
  <td>
    <input type=”text” name=”Width” size=”5″ />
    &nbsp;
    <input type=”text” name=”Width1″ size=”5″ id=”Width1″ /></td>
 </tr>
 <tr>
  <td align=”right”>
    <b>PCI:</b>&nbsp;
  </td>
  <td>
    <input type=”text” name=”PCI” size=”5″ />
    &nbsp;
  </td>
 </tr>
 <tr>
  <td align=”center” colspan=”2″>
  <input type=”button” value=”Get Fees” onClick=”get_pci();num=this.form.result_pci.value; this.form.result_pci.value=(parseFloat(num)).toFixed(this.form.txtPlaces.value);” />
    <input type=”reset” value=”Reset” />
    <input type=”hidden” name=”txtPlaces” size=”2″ value=”2″ />
  </td>
 </tr>
 <tr>
  <td align=”right”>
    <b>Fees:</b>&nbsp;
  </td>
  <td>
    <input type=”text” name=”result_pci” size=”20″ />
  </td>
 </tr>
</table>
</form>
</body>

Leave a comment