vending.js File
/** Soda Vending Machine App - Main file
*** Created by Elizabeth Best for WEB115
REQUIRES: definition file vending_library.js for Object Contructors and Methods
HTML components to visually interact with user
NEEDS: CSS styling for visual effects and appeal
***/
//variable declarations
var vendAccount;
var coke = new Beverage ();
var diet_coke = new Beverage ();
var mtn_dew = new Beverage ();
var dr_pepper = new Beverage ();
var root_beer = new Beverage ();
var water = new Beverage ();
//variable to get HTML input elements
var $ = function(id) { return document.getElementById(id); }
//function to set initial values for defined Object propeties
var stock_machine = function () {
var money = $("deposit");
money.disabled = true;
coke.beverage_name = ( $("coke").value );
diet_coke.beverage_name = ( $("dietcoke").value );
mtn_dew.beverage_name = ( $("dew").value );
dr_pepper.beverage_name = ( $("pepper").value );
root_beer.beverage_name = ( $("rootbeer").value );
water.beverage_name = ( $("water").value );
}
//functions to add money in vending machince
var deposit_dollar = function () {
vendAccount.add_money( $("dollar").value );
update_display();
}
var deposit_quarter = function () {
vendAccount.add_money( $("quarter").value );
update_display();
}
var deposit_dime = function () {
vendAccount.add_money( $("dime").value );
update_display();
}
var deposit_nickel = function () {
vendAccount.add_money( $("nickel").value );
update_display();
}
//function to display total amount of 'money' input into machine
var update_display = function () {
$("deposit").value = vendAccount.balance.toFixed(2);
}
//function to change button appearance for after beverages are depleted
var outOfStock = function (beverage) {
beverage.setAttribute("class", "disabled");
beverage.disabled = true;
beverage.setAttribute("title", "Out of Stock");
}
/*functions to vend each type of beverage defined calling its method 'purchase_soda',
then comparing money input to cost with 'Money' object method 'make_change',
then checking if flag for out-of-stock changed to force CSS visual change and call function to send user response **/
var vend_coke = function () {
coke.purchase_soda(vendAccount.balance);
vendAccount.make_change(coke.cost);
if ( coke.out_of_stock == true ) {
var beverage = $("coke");
outOfStock(beverage);
}
create_message(coke.beverage_name);
}
var vend_dietcoke = function () {
diet_coke.purchase_soda(vendAccount.balance);
vendAccount.make_change(diet_coke.cost);
if ( diet_coke.out_of_stock == true ) {
var beverage = $("dietcoke");
outOfStock(beverage);
}
create_message(diet_coke.beverage_name);
}
var vend_dew = function () {
mtn_dew.purchase_soda(vendAccount.balance);
vendAccount.make_change(mtn_dew.cost);
if ( mtn_dew.out_of_stock == true ) {
var beverage = $("dew");
outOfStock(beverage);
}
create_message(mtn_dew.beverage_name);
}
var vend_pepper = function () {
dr_pepper.purchase_soda(vendAccount.balance);
vendAccount.make_change(dr_pepper.cost);
if ( dr_pepper.out_of_stock == true ) {
var beverage = $("pepper");
outOfStock(beverage);
}
create_message(dr_pepper.beverage_name);
}
var vend_rootbeer = function () {
root_beer.purchase_soda(vendAccount.balance);
vendAccount.make_change(root_beer.cost);
if ( root_beer.out_of_stock == true ) {
var beverage = $("rootbeer");
outOfStock(beverage);
}
create_message(root_beer.beverage_name);
}
var vend_water = function () {
water.purchase_soda(vendAccount.balance);
vendAccount.make_change(water.cost);
if ( water.out_of_stock == true ) {
var beverage = $("water");
outOfStock(beverage);
}
create_message(water.beverage_name);
}
//function to generate a message to the user based on money amount input and beverage selection
var create_message = function (beverage_name) {
var message = "";
if (vendAccount.change < 0 ) {
message = "You need an additional $" + Math.abs(vendAccount.change).toFixed(2) + " to buy " + beverage_name + ".";
} else if (vendAccount.change > 0) {
message = "Please enjoy your " + beverage_name + " and take your $" + vendAccount.change.toFixed(2) + " change.";
} else {
message = "Please enjoy your " + beverage_name + ".";
}
$("message").firstChild.nodeValue = message;
update_display();
}
//function to clear money input
var refund_money = function () {
var message = vendAccount.refund();
$("message").firstChild.nodeValue = message;
update_display();
}
//function to gather user input and call appropriate functions
window.onload = function () {
stock_machine();
vendAccount = new Money();
$("dollar").onclick = deposit_dollar;
$("quarter").onclick = deposit_quarter;
$("dime").onclick = deposit_dime;
$("nickel").onclick = deposit_nickel;
$("coke").onclick = vend_coke;
$("dietcoke").onclick = vend_dietcoke;
$("dew").onclick = vend_dew;
$("pepper").onclick = vend_pepper;
$("rootbeer").onclick = vend_rootbeer;
$("water").onclick = vend_water;
$("refund").onclick = refund_money;
}
vending_library.js File
/** Soda Vending Machine App - Object Constructors and Methods file
*** Created by Elizabeth Best for WEB115
NEEDS: vending.js file to utilize the objects and methods defined
***/
//Object Constructor for defining type 'Beverage'
var Beverage = function () {
this.beverage_name;
this.cost = 0.75;
this.num_in_stock = 2;
this.out_of_stock = false;
}
//Object Method for 'Beverage' to handle the act of its purchase, requires
Beverage.prototype.purchase_soda = function (balance) {
var balance = balance;
if ( balance >= this.cost ) {
this.num_in_stock--;
if (this.num_in_stock == 0) {
this.out_of_stock = true;
}
}
}
//Object Constructor for defining type 'Money'
var Money = function () {
this.balance = 0;
this.change = 0;
}
//Object Method for 'Money' to add value to vending machine deposit based on user input
Money.prototype.add_money = function (deposit) {
var amount = 0;
var deposit_amt = deposit;
switch (deposit_amt) {
case "Dollar":
amount = 1.00;
break;
case "Quarter":
amount = 0.25;
break;
case "Dime":
amount = 0.10;
break;
case "Nickel":
amount = 0.05;
break;
}
this.balance += parseFloat(amount);
}
//Object Method for 'Money' to calculate difference in money deposited and beverage cost
Money.prototype.make_change = function (cost) {
this.change = this.balance - cost;
if ( this.change >= 0 ) {
this.balance = 0;
}
}
//Object Method for 'Money' to clear deposited money and 'return' it upon user request
Money.prototype.refund = function () {
this.change = this.balance;
this.balance = 0;
var message = "Please take your $" + this.change.toFixed(2) + " refund.";
return message;
}