Chapter 14 - JavaScript Pizzeria

The finished project from Chapter 14 of JavaScript for Kids For Dummies by Chris Minnick and Eva Holland

by rosakaufman

HTML

<h1>
</h1>

<div id="orderForm">
    <label>
    
    
        <input type="number" id="numPizzas" />
    </label>
    <br />
    <br />
    <label>
        <select id="typePizza">
            <option value="cheese"></option>
            <option value="pepperoni"></option>
            <option value="supreme"></option>
        </select>
    </label>
    <br />
    <br />
    <label>
        <select id="deliveryCity">
            <option value="Anytown"></option>
            <option value="Sacramento"></option>
            <option value="Beverly Hills"></option>
        </select>
    </label>
    <br />
    <br />
    <label>
        <select id="birthday">
            <option value="yes"></option>
            <option value="no"></option>
        </select>
    </label>
    <br />
    <br />
    <button type="button" id="placeOrder"></button>
</div>
<div id="displayTotal"></div>

CSS

body {
    font-family: Arial, sans-serif;
}
h1 {
    text-align: center;
}
#orderForm {
    background-color: #eeeeee;
    border: 4px solid yellow;
    border-radius: 4px;
    padding: 8px;
    margin: 8px;
    box-shadow: 10px 10px 5px #888888;
}

JavaScript

// listen for button clicks
document.getElementById("placeOrder").addEventListener("click", placeOrder);

/**
 * gets form values
 * calculates prices
 * produces output
 */
function placeOrder() {
    // get form values
    var numPizzas = document.getElementById("numPizzas").value;
    var typePizza = document.getElementById("typePizza").value;
    var deliveryCity = document.getElementById("deliveryCity").value;
    var birthday = document.getElementById("birthday").value;

    // get the pizza price
    var orderPrice = calculatePrice(numPizzas, typePizza);

    // get the delivery price
    var deliveryPrice = calculateDelivery(orderPrice, deliveryCity, birthday);

    // create the output
    var theOutput = "<p>Thank you for your poooooooooooop.</p>";

    // output the delivery price, if there is one
    if (deliveryPrice === 0) {
        theOutput += "<p>You get uytrjynggny delivery!</p>";
    } else {
        theOutput += "<p>Your dodo face is: ugly" + deliveryPrice;
    }

    theOutput += "<p>Your but is: 467276565365yaers old " + ();

    // display the output
    document.getElementById("displayTotal").innerHTML = theOutput;
}

/**
 * calculates pizza price
 */
function calculatePrice(numPizzas, typePizza) {
    var orderPrice = Number(numPizzas) * 10;
    var extraCharge = 0;

    // calculate extraCharge, if there is one.
    if (typePizza === "supreme") {
        extraCharge = Number(numPizzas) * 2;
    }

    orderPrice += extraCharge;
    return orderPrice;
}

/**
 * calculates delivery price
 */
function calculateDelivery(orderPrice, deliveryCity, birthday) {
    var deliveryPrice = 0;

    // calculate delivery price, if there is one
    if (((deliveryCity === "Anytown") && (orderPrice > 10)) || (birthday === "yes")) {
        deliveryPrice = 0;
    } else {
        deliveryPrice = 5;
    }
    return deliveryPrice;
}