Upcoming SlideShare
×

# Web Scripting Project JavaScripts and HTML WebPage

755 views

Published on

0 Likes
Statistics
Notes
• Full Name
Comment goes here.

Are you sure you want to Yes No
• Be the first to comment

• Be the first to like this

Views
Total views
755
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
1
0
Likes
0
Embeds 0
No embeds

No notes for slide

### Web Scripting Project JavaScripts and HTML WebPage

1. 1. Web Scripts ProjectJavaScript and HTML Webpage DemoBySunny Okoro
2. 2. Table of ContentsINTRODUCTION.............................................................................................................................................2ORDER SYSTEM .............................................................................................................................................3ORDER SYSTEM CODES .................................................................................................................................8PAYROLL CALCULATIONS ............................................................................................................................10PAYROLL CALCULATION CODES ..................................................................................................................13RESTAURANT SYSTEM.................................................................................................................................15RESTAURANT SYSTEM CODES.....................................................................................................................18SPORTS SYSTEM ..........................................................................................................................................25SPORTS SYSTEM CODES ..............................................................................................................................32
3. 3. INTRODUCTIONThis document contains different web scripting small programs created in Java Scripts and HTML.
4. 4. ORDER SYSTEMOrder.Html
5. 5. SystemOrder.Html
6. 6. ORDER SYSTEM CODESJava Scripts & HTML Codes****************metric.js file***************************************// convert pounds into kilograms//var Pounds = parseFloat(prompt ("Enter the number of pounds to beconverted into killograms. n", " "));varkillograms = Pounds * 0.4536;//I added the lb symbol for pounds display enterd by the user.document.writeln("Pounds enterned is: " + Pounds + "lb" );//I added the kg symbol for killograms result.document.writeln("<p>killograms is: " + killograms + "Kg" );*********order.js file***************************************************// Get the input from the user//var price = parseFloat(prompt ("What is the price of your order? No dollarsign. n", " "));var tax =parseFloat(prompt ("What is the percenntage of the sales tax ofyour order? No percentage sign. n", " "));//calculate the total price and total prince for the order entervarFinaltax = tax /100;varSalestax = price * Finaltax;varFinalprice = price + Salestax ;// Display the results back to the customerdocument.write("<p> Order price entered: \$ ");document.writeln(price);document.write("<p> Percentage of sales tax entered: ");document.write( + tax + "%" );document.write("<p> Calculated sales tax to : \$");document.write(Salestax);document.write("<p> Total price calculated with tax: \$");document.write(Finalprice);******************order.html**********************************
7. 7. <?xml version = "1.0" encoding = "utf-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns = "http://www.w3.org/1999/xhtml"><head><title> order java systems</title></head><body><script type = "text/javascript" src="order.js"></script></body></html>******************************systemorder.html************<?xml version = "1.0" encoding = "utf-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns = "http://www.w3.org/1999/xhtml"><head><title> order java systems</title></head><body><h1> Calculate book price</h1><script type = "text/javascript" src = "order.js"></script><br/><h1> Metric Calculator </h1><script type = "text/javascript" src = "Metric.js"></script><br/></body></html>****************************************************************************
8. 8. PAYROLL CALCULATIONS
9. 9. PAYROLL CALCULATION CODES*****payrollcalculation.js file**************************************varnetPay = 0;var gross = 0;vartotalNet = 0;vartotalGross = 0;varnumEmp;varhourlyRate = 0;var rate;var deduction = 0;var MAX_HOURS = 80;var FULL_HOURS = 40;// get number of eployees from the usernumEmp = parseInt(prompt("Enter the number of employes? n", " "));// calculate the hours worked.for (varemp = 1; emp<= numEmp; emp++){
10. 10. var hours = 0;// Get the hours worked from the user.hours = parseFloat(prompt ("Enter number of hours worked byemployee #" + emp + "n", " "));while(hours < 0 || hours > MAX_HOURS){hours = parseFloat(prompt ("Enter your hours worked.nhours must be between 0 and "+ MAX_HOURS + "hours", " "));}if (hours < FULL_HOURS)rate = .15;elserate = .30;// Get the hourly rate from the user.varhourlyRate = 0;hourlyRate = parseFloat(prompt ("Enter employee #" + emp + "hourly raten", " "));// Validate the input by the user.while (hourlyRate< 7.50 || hourlyRate> 15.00 ){hourlyRate = parseFloat(prompt ("Enter your hourly ratenMust be between 7.50 & 15.00", " "));}gross = hours * hourlyRate;deduction = rate * gross;netPay = gross - deduction;totalNet += netPay;totalGross += gross;// print the resultsdocument.write("<p>Employee #" + emp + " worked " + hours +" hours at \$" + hourlyRate + " per hour for gross pay of \$" + gross+ " and net pay of \$" + netPay + " based on a tax rate of " + rate * 100 +"%." );}document.write("<p> Total grosspay is \$" + totalGross);document.write("<p> Total netpay is \$" + totalNet );************************payrollcalculation.html***************************<?xml version = "1.0" encoding = "utf-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns = "http://www.w3.org/1999/xhtml"><head><title>Payroll Caclculator</title>
11. 11. </head><body><h2>Payroll Calculations</h2><script type = "text/javascript" src ="payrollcalculations.js"></script></body></html>RESTAURANT SYSTEM
12. 12. RESTAURANT SYSTEM CODESJava Scripts & Html Codes<?xml version = "1.0" encoding = "utf-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns = "http://www.w3.org/1999/xhtml"><!-- IST 350 LAB 16 --><head><title> ROSEHILL STAR RESTAURANT </title><script type = "text/javascript" src = "lab.js" ></script>
13. 13. </head><body><p><h1>ROSEHILL STAR RESTAURANT ORDER SYSTEM</h1></p><form name = "orderForm" action = " "><p><input type= "button" id = "submit" name = "submit" value= "Submit Order" /><input type = "reset" id = "Reset" value = "Clear Order"/></p><p> Please enter your initials </p><input type =" text" id = "name" name ="name" size="3" maxlength="3" /><p> Please enter the discount rate without % sign </p><input type =" text" id = "discount" name ="discount" size="5"maxlength="5" /><p><h2>MENU</h2></p>
14. 14. <p><h4>Main dish </h4></p><input type= "radio" name = "mainDish" id ="fchicken"value=" FriedChicken" checked ="checked" /> Fried Chicken <br/><input type = "radio" name ="mainDish" id = "chicken"value="BakedChicken" /> Baked Chicken<br /><input type = "radio" name ="mainDish" id ="Burger"value= "Burger" onclick="handlemainDishBurgerclick();" />Burger <br /><p><h4>Side dish</h4></p><input type= "checkbox" name = "SideDish" id ="fries"value=" fries" checked ="checked" /> French fries<br /><input type = "checkbox" name ="SideDish" id ="cake"value="cake" /> Triple fudge cake <br /><input type = "checkbox" name ="SideDish" id = "cream"value= "cream" /> International Ice Cream <br/>
15. 15. <hr /><p>Customer Special Request</p><hr/><textarea name = "customer request" rows ="3" cols= "40">(ANY SPECIAL REQUEST) </textarea></form><script type = "text/javascript" src = "lab2.js" ></script></body></html>*******************JS FILE1*******************************************// Event handler for the formfunctiongiveInitsFocus (){// Give focus to the textboxdocument.orderForm.name.focus();}// text input functionfunctionisInitialsTextValid(){varpos;var name = document.getElementById("name").value;varpos = name.search (/^([A-Z]|[a-z]){2,3}\$/);
16. 16. if (pos != 0 ){alert ("Error in initials entered is not in correct form. n" +"Must be first letters of first and last names" );return false;} elsereturn true;}// tax functionfunctionisDiscountValid(){var discount = document.getElementById("discount").value;var position = discount.search (/^d{1,2}\$/);if (position != 0 ){alert ("Error in the discount rate entered. n" + " Must bein x formate one or two digits. No % sign.");return false;} elsereturn true;}// SIDE DISHvar FRIES_COST = 9.50;var CAKE_COST = 12.50;var ICE_COST = 7.50;functionhandlefriesclick(){if (document.orderForm.SideDish[0].checked == true){alert ("The cost of large basket of fries is \$" + FRIES_COST);}}functionhandlecakeclick(){if (document.orderForm.SideDish[1].checked == true){alert ("The cost of large tripple fudge cake is \$" + CAKE_COST);}}functionhandlecreamclick(){if (document.orderForm.SideDish[2].checked == true){alert ("The cost of international ice cream is \$" + ICE_COST);}}// MAIN DISH
17. 17. var BCHICKEN_COST = 6.50;var FCHICKEN_COST = 5.50;var BURGER_COST = 4.50;functionhandlemainDishfchickenclick(){alert("The cost of 10 piece fried chicken is \$" +FCHICKEN_COST);}functionhandlemainDishbchickenclick(){alert("The cost of 10 piece baked chicken is \$" + BCHICKEN_COST);}functionhandlemainDishBurgerclick(){alert ("The cost of regular burger is \$" + BURGER_COST);}functionhandleSubmitClick(){var Total = 0;// statements for sidedishif (document.orderForm.SideDish[0].checked == true){Total += FRIES_COST;}else if (document.orderForm.SideDish[1].checked == true){Total += CAKE_COST;}else if (document.orderForm.SideDish[2].checked == true){Total += ICE_COST;}// statements for the main dishif (document.orderForm.mainDish[0].checked == true){Total += FCHICKEN_COST;}if(document.orderForm.mainDish[1].checked == true){Total += BCHICKEN_COST;}if (document.orderForm.mainDish[2].checked == true){Total += BURGER_COST;}
18. 18. // caculate the discount pricevar rate;varcostFinal;rate = parseFloat (document.getElementById("discount").value / 100 * Total);costFinal = ( Total - rate );alert("The total cost of the meal is \$ " + Total + " and thediscount rate is \$" + rate.toFixed(2) );recipt = confirm("The total cost of the meal with discount is\$ "+ costFinal.toFixed(2) + ".n" +"Do you want to place this order or cancel it");}// test the text inputfunctioncheckInitials(){nameCalc = isInitialsTextValid();if (nameCalc == false){document.orderForm.discount.focus();document.orderForm.discount.select();}else{handleSubmitClick();}}// check the discountfunction checkDiscount(){rateCalc = isDiscountValid();if (rateCalc == false){document.orderForm.discount.focus();document.orderForm.discount.select();}else{handleSubmitClick();
19. 19. }}// check the reciptif (recipt == false ){document.orderForm.Reset.click();}****************JS FILE2.********************// focusonload = giveInitsFocus;// submitdocument.orderForm.submit.onclick = checkDiscount;// side dishdocument.orderForm.SideDish[0].onclick = handlefriesclick;document.orderForm.SideDish[1].onclick = handlecakeclick;document.orderForm.SideDish[2].onclick = handlecreamclick;// main dish.document.orderForm.mainDish[0].onclick = handlemainDishfchickenclick;document.orderForm.mainDish[1].onclick = handlemainDishbchickenclick;document.orderForm.mainDish[2].onclick = handlemainDishBurgerclick;SPORTS SYSTEM
20. 20. SPORTS SYSTEM CODES***********HTML FILE***********************************************<?xml version = "1.0" encoding = "utf-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns = "http://www.w3.org/1999/xhtml"><head><title>SPORTS SYSTEM</title></head><body><h2>Student Athlete </h2><script type = "text/javascript" src = "student.js"></script></body></html>*************** Java Scripts file 1*****************// Event handler for the formfunctiongiveInitsFocus (){// Give focus to the textboxdocument.orderForm.name.focus();}// text input functionfunctionisInitialsTextValid(){varpos;var name = document.getElementById("name").value;
21. 21. varpos = name.search (/^([A-Z]|[a-z]){2,3}\$/);if (pos != 0 ){alert ("Error in initials entered is not in correct form. n" +"Must be first letters of first and last names" );return false;} elsereturn true;}// tax functionfunctionisDiscountValid(){var discount = document.getElementById("discount").value;var position = discount.search (/^d{1,2}\$/);if (position != 0 ){alert ("Error in the discount rate entered. n" + " Must bein x formate one or two digits. No % sign.");return false;} elsereturn true;}// SIDE DISHvar FRIES_COST = 9.50;var CAKE_COST = 12.50;var ICE_COST = 7.50;functionhandlefriesclick(){if (document.orderForm.SideDish[0].checked == true){alert ("The cost of large basket of fries is \$" + FRIES_COST);}}functionhandlecakeclick(){if (document.orderForm.SideDish[1].checked == true){alert ("The cost of large tripple fudge cake is \$" + CAKE_COST);}}functionhandlecreamclick(){if (document.orderForm.SideDish[2].checked == true){alert ("The cost of international ice cream is \$" + ICE_COST);}
22. 22. }// MAIN DISHvar BCHICKEN_COST = 6.50;var FCHICKEN_COST = 5.50;var BURGER_COST = 4.50;functionhandlemainDishfchickenclick(){alert("The cost of 10 piece fried chicken is \$" +FCHICKEN_COST);}functionhandlemainDishbchickenclick(){alert("The cost of 10 piece baked chicken is \$" + BCHICKEN_COST);}functionhandlemainDishBurgerclick(){alert ("The cost of regular burger is \$" + BURGER_COST);}functionhandleSubmitClick(){var Total = 0;// statements for sidedishif (document.orderForm.SideDish[0].checked == true){Total += FRIES_COST;}else if (document.orderForm.SideDish[1].checked == true){Total += CAKE_COST;}else if (document.orderForm.SideDish[2].checked == true){Total += ICE_COST;}// statements for the main dishif (document.orderForm.mainDish[0].checked == true){Total += FCHICKEN_COST;}if(document.orderForm.mainDish[1].checked == true){Total += BCHICKEN_COST;}if (document.orderForm.mainDish[2].checked == true){Total += BURGER_COST;}
23. 23. // caculate the discount pricevar rate;varcostFinal;rate = parseFloat (document.getElementById("discount").value / 100 * Total);costFinal = ( Total - rate );alert("The total cost of the meal is \$ " + Total + " and thediscount rate is \$" + rate.toFixed(2) );recipt = confirm("The total cost of the meal with discount is\$ "+ costFinal.toFixed(2) + ".n" +"Do you want to place this order or cancel it");}// test the text inputfunctioncheckInitials(){nameCalc = isInitialsTextValid();if (nameCalc == false){document.orderForm.discount.focus();document.orderForm.discount.select();}else{handleSubmitClick();}}// check the discountfunction checkDiscount(){rateCalc = isDiscountValid();if (rateCalc == false){document.orderForm.discount.focus();document.orderForm.discount.select();}else
24. 24. {handleSubmitClick();}}// check the reciptif (recipt == false ){document.orderForm.Reset.click();}*******************Java Scripts File2*******************// focusonload = giveInitsFocus;// submitdocument.orderForm.submit.onclick = checkDiscount;// side dishdocument.orderForm.SideDish[0].onclick = handlefriesclick;document.orderForm.SideDish[1].onclick = handlecakeclick;document.orderForm.SideDish[2].onclick = handlecreamclick;// main dish.document.orderForm.mainDish[0].onclick = handlemainDishfchickenclick;document.orderForm.mainDish[1].onclick = handlemainDishbchickenclick;document.orderForm.mainDish[2].onclick = handlemainDishBurgerclick;