DEV Community: David Kanekanian

Summing values with common type

David Kanekanian — Mon, 27 Jul 2020 19:24:12 +0000

Problem

The built-in "sum" function in Python is great for adding up a bunch of values.

sum([ 1, 2, 3 ])
# output: 6

But if you give it an iterable that has values of different types, it simply adds them as usual. This means if you had just one float (fractional number) in a list full of integers (whole numbers,) the result of the "sum" would be a fractional number.

sum([ 1, 2, 3.5 ])
# output: 6.5

This is probably the expected behaviour since it will give an accurate answer.

However there may be times where you need the result to match the most common data type in the inputs, such that the values before being added are first converted into that type.

Solution

To address this issue I first iterated over the inputs to get the common type, then converted the values to that common type before adding them.

def sum2(t, start=None):
    def get_common_type(t):
        d = (lambda types: {ty: types.count(ty) for ty in set(types)})(tuple(map(type, t)))
        best_count = -1
        best_ty = None
        for ty, count in d.items():
            if count > best_count:
                best_count = count
                best_ty = ty
        return best_ty

    common_type = get_common_type(t)
    start = common_type() if start is None else common_type(start)
    return sum(map(common_type, t), start)

Or even shorter:

sum2 = lambda t, start=None: (lambda common_type: sum(map(common_type, t), common_type() if start is None else common_type(start)))((lambda d: tuple(d.keys())[tuple(d.values()).index(max(d.values()))])((lambda s: {_: s.count(_) for _ in set(s)})(tuple(map(type, t)))))

Demonstration

sum2([ 1, 2, 3, 4.5 ])
# output: 10

The output this time kept the most common data type (integer) and converted the non-integer 4.5 to 4 before adding it to yield the result of 10.

Pros

Preserve the most common type for passing to other functions
Avoid accidental mistakes by typing ".0" after just one number
Works with any in-place-add-able objects

Cons

Result is less accurate (fractional parts may get truncated)
Doesn't work for infinite generators
Worse execution speed and memory usage
Common type must be default constructible and constructible from all other data types in the inputs

Note that if you give "sum2" a starting value, that value is also converted to the most common type of the inputs, but the start itself is not considered in the realisation of the common type.

If the starting value is supplied, you may want to:

Assume the type of the starting value as the common type. This would be best if a specific data type was obtained from a previously called function to be the starting value. It would save the calculation of the common type and enable the solution to work
Consider the starting value when finding the common type
Assume the caller wants to use the starting value as-is, but convert all other values to their common type

To tackle some of the cons, you could also calculate the most common type from the first N values, for instance the first five values. This wouldn't add as much execution time and memory usage as evaluating the entire input, and would work with infinite generators, but the common type may be biased towards only the first few values.

You will typically find that the standard library writers have already given thought to these usual use cases and picked the better solution. Meanwhile you only thought about your specific use case. Therefore another option would be to adapt your workflow around the standard functions. For instance you could "map" your iterable to the type you want before computing the "sum":

sum_as = lambda ty, it, start=None: sum(map(ty, it), start)
sum_as(int, [ 1, 2, 3, 4.5 ])
# output: 10

Tennis Court

David Kanekanian — Thu, 09 Jul 2020 11:24:19 +0000

Font: Cascadia Code

Source code:

===|===|===|===|===|===|===|===|===|===|===|===|===|===|===|===|
                       =<< Tennis Court >>=

                 ... ... ... ... ... ... ... ... 
               .                \O              .
              .                  |               .
             .                   \\              .
             .                                   .
            .   |- -- -- -- -- -- -- -- -- -- -| .
            .   |  -- -- -- -- -- -- -- -- --  | .
            .   |- -- -- -- -- -- -- -- -- -- -|  .
           .                                      .
           .                 .                     .
          .                                        .
         .              O /                         .
         .              |=                          .
        .              //                            .
       .                                             .
      ... ... ... ... ... ... ... ... ... ... ... ... .

===|===|===|===|===|===|===|===|===|===|===|===|===|===|===|===|

Summary and Next Steps

David Kanekanian — Wed, 15 Apr 2020 20:10:49 +0000

In this tutorial, we started at the language basics of PHP and MySQL before diving into five detailed examples that culminated in building various parts of an online shopping system. We covered lots of topics such as web interface creation, server side validation and database initialisation. I believe you are now ready to put everything together and have a go at developing something on your own!

Next steps

I suggest you take everything we learned and put it into practice by making your own shopping website from new. You could expand your knowledge into mobile app development, continue learning backend development (PHP and MySQL) or focus on making responsive frontend website designs. If you want some examples of what to create a project on, here are some of my suggestions that will get you thinking in terms web development in PHP and databases:

Computer store ordering system
Personalised wedding cake ordering system
Supermarket item tracking system
Worldwide springs tourist driven information sharing and rating system
Cultural exchange programme chat forum
Music album metadata cataloguing and dicussion site

The End

You've reached the end of my PHP and MySQL development tutorial. I hope you learned a lot!

Here's a song I thought sounded like saying 'you've reached the end of a tutorial, but it's also the beginning of many future web projects':

E5 - Sample Solution

David Kanekanian — Wed, 15 Apr 2020 19:40:09 +0000

The files are viewable on this page directly, or on my Github.

Files in solution:

_header.php
cart.php
db_commands.sql
edit_cart.php
index.php
on_checkout.php
order_confirm.php
style.css

Parent topic: Example 5

_header.php

<header>
<?php
function getCartCount()
{
    $cart = json_decode($_COOKIE["cart"] ?? "{}", true);
    $cartCount = 0;
    foreach ($cart as $productID => $quantity)
        $cartCount += $quantity;
    return $cartCount;
}
?>


    <a class="typography headline" href="index.php">Neat Treats</a>
    <a class="typography headline" href="index.php">Products</a>
    <a class="typography headline" href="cart.php">Cart (<?=getCartCount()?>)</a>
</header>

cart.php

<html>
    <head> <link rel="stylesheet" href="style.css"> </head>
    <body>
        <?php include("_header.php"); ?>
        <main>
            <h2 class="typography subhead">Cart Page</h2>


            <div class="list-grid cart-list-grid">
                <?php
                $cart = json_decode($_COOKIE["cart"] ?? "{}", true);


                $databaseLink = new mysqli("localhost", "root", "", "NeatTreats");
                foreach ($cart as $productID => $quantity) {
                    $result = $databaseLink->query(
                        "SELECT Name FROM Product WHERE ProductID=$productID;"
                    );
                    if (empty($databaseLink->error) && $result->num_rows > 0) {
                        $row = $result->fetch_object();
                        $productName = $row->Name;
                    } else {
                        $productName = "INVALID ID";
                    }
                    echo "<span class='typography body'>{$row->Name}</span>";
                    echo "<span class='typography body'> x$quantity</span>";
                    $editUrl = "edit_cart.php?id=$productID";
                    echo "<a class='typography body' href='$editUrl&type=add'>Add</a>";
                    echo "<a class='typography body' href='$editUrl&type=sub'>Sub</a>";
                    echo "<a class='typography body' href='$editUrl&type=rem'>Remove</a>";
                }
                $databaseLink->close();
                ?>
            </div>


            <form action="on_checkout.php" method="post">
                <div class="list-grid checkout-list-grid">
                    <label class='typography body'>Email Address:</label> <input name="email">
                    <label class='typography body'>Card Number:</label> <input name="card_num">
                    <label class='typography body'>Expiry Month:</label>
                    <select name="expiry_month">
                        <option selected disabled></option>
                        <?php
                        for ($i=1; $i < 13; $i++)
                            echo "<option value=$i>". date("F", 3600 * 24 * 28 * $i) ."</option>";
                        ?>
                    </select>
                    <label class='typography body'>Expiry Year:</label> <input name="expiry_year">
                    <div> <button>Checkout</button> </div>
                    <span class="error">
                        <?php
                        if (isset($_COOKIE["checkout_error"])) {
                            // Output and expire the checkout error cookie.
                            echo $_COOKIE["checkout_error"];
                            setcookie("checkout_error", "", time() - 3600);
                        }
                        ?>
                    </span>
                </div>
            </form>
        </main>
    </body>
</html>

db_commands.sql

DROP DATABASE NeatTreats;
CREATE DATABASE NeatTreats;
USE NeatTreats;


CREATE TABLE Cart (
    CartID INT auto_increment,
    ProductID INT,
    Quantity INT,
    PRIMARY KEY (CartID, ProductID)
);


CREATE TABLE Product (
    ProductID INT auto_increment,
    Name VARCHAR(32),
    Description VARCHAR(255),
    Price FLOAT,
    PRIMARY KEY (ProductID)
);


INSERT INTO Product
    (ProductID, Name, Description, Price)
VALUES
    (1, 'Vanilla Cake', 'Tasty vanilla flavoured sponge cake', 12.34),
    (2, 'Chocolate Cake', 'Scrumptious chocolate flavoured sponge cake', 32.14),
    (3, 'Strawberry Cake', 'Yummy strawberry flavoured sponge cake', 42.35);


ALTER TABLE Cart ADD FOREIGN KEY (ProductID) REFERENCES Product (ProductID);

edit_cart.php

<?php 
$productID = $_GET["id"];
$editType = $_GET["type"];
$redirectUrl = $_GET["redirect_url"] ?? "cart.php";
$cart = json_decode($_COOKIE["cart"] ?? "{}", true);


switch ($editType) {
case "add":
    // Increment quantity of already added product.
    if (isset($cart[$productID])) $cart[$productID]++;
    // Otherwise put 1 quantity of product in cart.
    else $cart[$productID] = 1;
    break;
case "sub":
    if (!isset($cart[$productID])) break;
    // Decrement quantity of already added product
    $cart[$productID]--;
    if ($cart[$productID] <= 0)
        // If quantity is now 0, remove from cart.
        unset($cart[$productID]);
    break;
case "rem":
    unset($cart[$productID]);
    break;
}


setcookie("cart", json_encode($cart), time() + 3600 * 24 * 10, "/");
header("Location: $redirectUrl");


?>

index.php

<html>
    <head> <link rel="stylesheet" href="style.css"> </head>
    <body>
        <?php include("_header.php"); ?>
        <main>
            <h2 class="typography subhead">Products Page</h2>

            <div class="list-grid product-list-grid">
                <?php 
                    $databaseLink = new mysqli("localhost", "root", "", "NeatTreats");
                    $result = $databaseLink->query("SELECT * FROM Product LIMIT 200;");
                    if (empty($databaseLink->error)) {
                        while ($row = $result->fetch_object()) {
                            echo "<span class='typography body'>#{$row->ProductID}</span>";
                            echo "<img class='product-thumbnail' width='50' height='50' ";
                            echo "src='cake_images/cake_{$row->ProductID}.png' alt='cake image'>";
                            echo "<div>";
                            echo "<span class='typography body'>{$row->Name}</span>";
                            echo "<br>";
                            echo "<a class='typography body' href='edit_cart.php";
                            echo "?id={$row->ProductID}&type=add&redirect_url=index.php'>";
                            echo "Add to cart</a>";
                            echo "</div>";
                        }
                    }
                    $databaseLink->close();
                ?>
            </div>
        </main>
    </body>
</html>

on_checkout.php

<?php
// Function definitions


/** Sanitizes and validates checkout form input
 * 
 * @param array $inputArray $_POST or $_GET array. Will be sanitized in place.
 * @param mysqli $databaseLink Link to sanitize SQL injections. If null, SQL
 * injections will not be protected.
 * @return boolean Whether all input is valid.
 */
function isCheckoutInputValid(&$inputArray, mysqli $databaseLink=null): bool
{
    foreach ($inputArray as $name => $input) {
        $input = strip_tags($input);
        if ($databaseLink !== null) $input = $databaseLink->real_escape_string($input);
        // Propagate changes back into array.
        $inputArray[$name] = $input;
    }


    $email = $inputArray["email"] ?? "";
    $cardNum = $inputArray["card_num"] ?? "";
    $expiryMonth = $inputArray["expiry_month"] ?? "";
    $expiryYear = $inputArray["expiry_year"] ?? "";


    // This validation example will not save each individual error. Refer
    // to example 3 for making specific error messages.
    return (
        !empty($email) // presence check
        && filter_var($email, FILTER_VALIDATE_EMAIL) // format: x@y.z
        && !empty($cardNum) // presence
        && (int)$cardNum != null // type: int (Also fails for $cardNum = "0")
        && (int)$cardNum > 0 // range: greater than 0
        && strlen($cardNum) >= 12 // length: between 12 and 16
        && strlen($cardNum) <= 16
        && !empty($expiryMonth) // presence
        && (int)$expiryMonth != null // type: int
        && (int)$expiryMonth >= 1 // range: between 1 and 12
        && (int)$expiryMonth <= 12
        && !empty($expiryYear) // presence
        && (int)$expiryYear != null // type: int
        && (int)$expiryYear >= 2020 // range: between 2020 and 3000
        && (int)$expiryYear <= 3000
    );
}


/** Save the cart into the database via the given link. */
function saveCartToDatabase(array $cart, mysqli $databaseLink): bool
{
    // Can't checkout with an empty cart!
    if (count($cart) == 0) return false;


    // Get the next valid auto increment CartID
    $databaseLink->query("INSERT INTO Cart (ProductID, Quantity) VALUES (1, 0);");
    if ($databaseLink->errno != 0) return false;
    $nextCartID = $databaseLink->insert_id;
    $databaseLink->query("DELETE FROM Cart WHERE CartID=$nextCartID;");
    if ($databaseLink->errno != 0) return false;


    // Add the cart rows to the database.
    $saveCartQuery = "INSERT INTO Cart (CartID, ProductID, Quantity) VALUES ";
    $isFirst = true;
    foreach ($cart as $productID => $quantity) {
        if ($isFirst) $isFirst = false;
        else $saveCartQuery .= ", ";
        $saveCartQuery .= "($nextCartID, $productID, $quantity)";
    }
    $saveCartQuery .= ";";


    $databaseLink->query($saveCartQuery);
    if ($databaseLink->errno != 0) return false;
    return true;
}


/** Send an invoice to the customer about the specified order. */
function sendInvoice(array $cart, array $inputArray): bool
{
    // Extract inputs from input array. Should have already been validated.
    $customerEmail = $inputArray["email"];
    $cardNum = $inputArray["card_num"];
    $expiryMonth = $inputArray["expiry_month"];
    $expiryYear = $inputArray["expiry_year"];


    $emailSubject = "Invoice of your order from Neat Treats";
    $emailHeaders = (
        "From: neattreats.sender@gmail.com\r\n" .
        "Content-Type: text/html; charset=ISO-8859-1\r\n"
    );


    $productsGrid = "";
    foreach($cart as $productID => $quantity)
        $productsGrid .= "<p>Product #$productID x$quantity</p>";


    $emailBody = (
        "<html>" .
            "<body>" .
                "<h2>Order Confirmation</h2>" .
                "<p>Thanks for your order! We hope you enjoy it a lot.</p>" .

                "<h4>Products:</h4>" .
                "<div style='padding-left:10px'>" .
                    $productsGrid .
                "</div>" .

                "<h4>Payment Method:</h4>" .
                "<div style='padding-left:10px'>" .
                    "<p>Card Number: $cardNum</p>" .
                    "<p>Expires: $expiryMonth / $expiryYear</p>" .
                "</div>" .
            "</body>" .
        "</html>"
    );
    return mail($customerEmail, $emailSubject, $emailBody, $emailHeaders);
}


// Performs actual script when page is opened:
(function () {
    $cart = json_decode($_COOKIE["cart"] ?? "{}", true);
    $databaseLink = new mysqli("localhost", "root", "", "NeatTreats");


    $allSuccess = false;
    $error = "";
    if (count($cart) > 0)
        if (isCheckoutInputValid($_POST))
            if (saveCartToDatabase($cart, $databaseLink))
                if (sendInvoice($cart, $_POST))
                    $allSuccess = true;
                else $error = "Couldn't send invoice";
            else $error = "Couldn't save to database";
        else $error = "Invalid checkout input";
    else $error = "Cart is empty";


    $databaseLink->close();


    if ($allSuccess) {
        setcookie("cart", "", time() - 3600, "/");
        header("Location: order_confirm.php");
    } else {
        setcookie("checkout_error", $error, time() + 3600, "cart.php");
        header("Location: cart.php");
    }
})();
?>

order_confirm.php

<html><body>
    <h2>Order Confirmation</h2>
    <p>Thanks for your order!</p>
</body></html>

style.css

.typography { font-family: Arial, Helvetica, sans-serif; }
.typography.headline { font-size: 24; }
.typography.subhead { font-size: 20; font-weight: lighter; }
.typography.body { font-size: 14; }


header {
    display: inline-grid; grid-template-columns: 2fr 1fr 1fr;
    place-items: center;
    width: 420px;
}


header>a { text-decoration: none; }
header>a:active, header>a:visited { color: orange; }
header>a:hover { color: darkorange; }


main { margin: 30px 10px; }


.list-grid {
    display: inline-grid; row-gap: 5px; column-gap: 5px;
    margin-left: 10px; border-left: 1px solid grey; padding-left: 3px;
}
.product-list-grid { grid-template-columns: auto auto auto; }
.cart-list-grid { grid-template-columns: auto auto auto auto auto; margin-bottom: 20px; }
.checkout-list-grid { grid-template-columns: auto auto; }


.product-thumbnail { border-radius: 4px; border: 1px solid lightgrey; }
.error { color: #e22828; }

Parent topic: Example 5

E5 - Extra Steps

David Kanekanian — Wed, 15 Apr 2020 19:30:31 +0000

Here I have provided some additional steps for you to try based on what we learned from Example 5. My next post will be a sample solution of these steps, although you will gain the most by creating a solution for yourself.

Add a CSS stylesheet and link it to the other pages.
Make the edit_cart.php script redirect back to the index page when add to cart is clicked from the index page, but redirect to the cart page otherwise. Add a link on the index page to go to the cart page, without adding a product.
Add a page header with links to the products and cart pages. Put it in a separate file and use PHP include() function to add it to the product and cart pages.
Make the header show the total number of items in the cart on any page.
Add a Product table to your database to store additional product details such as description and price. (See Example 1 - Getting data from database)
Make the Cart table ProductID field a foreign key to reference the primary key in the Product table.
Output the product details of all products in the database on the products page (index.php).
Add images of each product on the products page. You can either save them in the database or store image files with filenames of each associated product ID.
Add payment input fields (eg card number, expiry date) to the checkout page and show them in the invoice.
Validate the payment input to cancel the order if it is invalid. Send an error message in this case.
Extract the email related code in the on_checkout.php file to a function and the same for the database saving code.
In the on_checkout.php script, if the cart is empty, invalidate the purchase and return to the cart page.
Change the invoice email to use an HTML content type. This will require additional email headers to be added.

Parent topic: Example 5

E5 - Email the Receipt

David Kanekanian — Wed, 15 Apr 2020 19:24:37 +0000

Once an order is confirmed, online shops commonly send an email receipt. First you must have email setup on your XAMPP installation, if not refer to Setting up email dispatch from a local server. If you haven't already, check out the previous tutorial stage where we saved orders in a database.

Open the file cart.php for editing in the following steps:

1. Replace your checkout link with a form element. Set the action to "on_checkout.php" and the method to post.

<form action="on_checkout.php" method="post"> </form>

2. Add label and input elements inside the form for an email address field.

<div> <label>Email Address:</label> <input name="email"> </div>

3. Add a button to ‘checkout’ or submit the form.

<button>Checkout</button>

4. Test the new cart page by submitting an order. The result of the form is no different to the link from before, as nothing is being done with the customer’s email yet.

Open on_checkout.php for editing in the following steps:

5. Assign the submitted email address to a variable, underneath the database querying and above where the cart cookie is made to expire.

$emailAddress = $_POST["email"];

6. Create variables for the email subject and headers. The subject will be the content sent as the subject and the headers will just have the email address you are sending from.

$emailSubject = "Invoice of your order from Neat Treats";
$emailHeaders = "From: neattreats.sender@gmail.com\r\n";

7. Create a variable for the email body.

$emailBody = "Thanks for your order! We hope you enjoy it a lot.\n";

8. Add a list of the products that were ordered to the email body using a foreach loop on the cart variable that was already created in this script when it was being saved into the database.

$emailBody .= "Products:\n";
foreach($cart as $productID => $quantity)
    $emailBody .= "Product #$productID x$quantity\n";

9. Use the mail() function to send the invoice email to the customer.

mail($emailAddress, $emailSubject, $emailBody, $emailHeaders);

10. Test out the updated checkout script by entering your personal email address. It will send you an email with the products you just ordered.

Parent topic: Example 5

E5 - Save Order in Database

David Kanekanian — Wed, 15 Apr 2020 19:16:52 +0000

Once the cart is confirmed, it must be saved in the database. First we must create a table to house the confirmed carts.

To get the most out of this tutorial, you should have already completed the previous stage where we created a temporary shopping cart.

Open phpMyAdmin and enter these commands:

1. (optional) Delete the database from previous examples and make a new one.

DROP DATABASE NeatTreats;
CREATE DATABASE NeatTreats;

2. Use the NeatTreats database for further manipulation.

USE NeatTreats;

3. Create a table called Cart with 3 INT fields: CartID, ProductID and Quantity. There will be no Product table at this stage.

CREATE TABLE Cart (
    CartID INT auto_increment,
    ProductID INT,
    Quantity INT,

4. Make a compound primary key with the CartID and ProductID. This means several rows can have the same CartID but they must have different ProductIDs.

    PRIMARY KEY (CartID, ProductID)
);

Edit cart.php from the previous stage in the following steps:

5. Add a link to checkout the temporary cart. Set the href attribute to "on_checkout.php".

<a href="on_checkout.php">Checkout</a>

Create a file called on_checkout.php for editing in the following steps:

6. Add PHP tags to the file.

<?php ?>

7. Create a database link object for querying the database with.

$databaseLink = new mysqli("localhost", "root", "", "NeatTreats");

8. Each time we checkout, we want all the products to share a CartID. The CartID field in the Cart table is set to auto increment, so it automatically picks the next valid CartID when you try to insert something. But when you insert multiple rows, they each get a different ID. Therefore, add a temporary row to obtain the next valid CartID, then delete the temporary row.

$databaseLink->query("INSERT INTO Cart (ProductID, Quantity) VALUES (0, 0);");
$nextCartID = $databaseLink->insert_id;
$databaseLink->query("DELETE FROM Cart WHERE CartID=$nextCartID;");

9. Create a variable to store the actual query of saving the cart in the database. The values will be added from a loop on the actual cart items.

$saveCartQuery = "INSERT INTO Cart (CartID, ProductID, Quantity) VALUES ";

10. Assign the cart cookie to a variable.

$cart = json_decode($_COOKIE["cart"] ?? "{}", true);

11. Use a foreach loop to add each row’s values from the cart cookie. Rows need to be separated with a comma, but without a comma before the first row or after the last row. For visualisation purposes, the final query should hopefully look something like this: INSERT INTO Cart (CartID, ProductID, Quantity) VALUES (123, 1, 5), (123, 2, 4), ... ;

$isFirst = true;
foreach ($cart as $productID => $quantity) {
    if ($isFirst) $isFirst = false;
    else $saveCartQuery .= ", ";
    $saveCartQuery .= "($nextCartID, $productID, $quantity)";
}

12. Execute this query and close the database link.

$databaseLink->query($saveCartQuery);
$databaseLink->close();

13. Expire the cart cookie after you checkout because this is a typical online shop feature.

setcookie("cart", "", time() - 3600, "/");

14. Redirect the user to an order_confirm.php page.

header("Location: order_confirm.php");

15. Place an order in the database and then open phpMyAdmin to check on the database.

16. The final code:

<?php
$databaseLink = new mysqli("localhost", "root", "", "NeatTreats");
$databaseLink->query("INSERT INTO Cart (ProductID, Quantity) VALUES (0, 0);");
$nextCartID = $databaseLink->insert_id;
$databaseLink->query("DELETE FROM Cart WHERE CartID=$nextCartID;");


$saveCartQuery = "INSERT INTO Cart (CartID, ProductID, Quantity) VALUES ";
$cart = json_decode($_COOKIE["cart"] ?? "{}", true);
$isFirst = true;
foreach ($cart as $productID => $quantity) {
    if ($isFirst) $isFirst = false;
    else $saveCartQuery .= ", ";
    $saveCartQuery .= "($nextCartID, $productID, $quantity)";
}
$saveCartQuery .= ";";
$databaseLink->query($saveCartQuery);
$databaseLink->close();

setcookie("cart", "", time() - 3600, "/");
?>

Bonus Stage

Create a file called order_confirm.php and open it for editing in the following steps:

17. Add some basic HTML with a headline and paragraph thanking the customer for their order.

<html><body> <h2>Order Confirmation</h2> <p>Thanks for your order!</p> </body></html>

18. Add a header redirection to the above file on_checkout.php on the line above where we set the cookie to clear the cart.

header("Location: order_confirm.php");

Parent topic: Example 5

E5 - Temporary Shopping Cart

David Kanekanian — Wed, 15 Apr 2020 19:09:17 +0000

The cart is a tricky process requiring many steps.
Jump to section:

Explanation of Shopping Cart
Add to Cart
View Cart
Edit Cart More

Explanation of Shopping Cart

The cart is a temporary collection of items where the user can add/edit/remove items before they confirm their order. It should be specific to each user, so it should be stored in the cookie or the session data. I recommend cookies because it stays each time after you restart your computer and you can also update it via Javascript from the client if need be.

We will store the cart as an associate array so each product ID has an associated quantity. For example, the cart array may look like:

["eggs" => 2, "flour" => 3, /* etc */ ]

You may have noticed when sending data server-client or vice versa, everything is sent as a string. JSON is commonly used for encoding and decoding arrays at either end.

Add to Cart

Open the file index.php from the previous stage for editing in the following steps.

1. Add href attributes to the links above to link to edit_cart.php?id=# where # is the product ID.

    <div> <span>Product #1</span> <a href="edit_cart.php?id=1">Add to cart</a> </div>
    <div> <span>Product #2</span> <a href="edit_cart.php?id=2">Add to cart</a> </div>
    <div> <span>Product #3</span> <a href="edit_cart.php?id=3">Add to cart</a> </div>

Create a file called edit_cart.php. Edit this file in the following steps.

2. Add PHP tags.

<?php ?>

3. Notice that the links send the product ID via the GET protocol. Assign this value to a variable.

$productID = $_GET["id"];

4. Get the cart out of the cookie and decode it from a JSON string into an array. If the cart cookie is empty, create an empty array.

$cart = json_decode($_COOKIE["cart"] ?? "{}", true);

5. Create a new pair for the product ID with one quantity. If the product is already in the cart, don’t change the cart.

if (!isset($cart[$productID])) $cart[$productID] = 1;

6. Encode the array back into a JSON string and save it in the cookie for ten days. Your site’s cookies are stored separate to other sites, so there won’t be conflict from a generic name like "cart". The last parameter "/" means the cookie is accessible by all (sub)pages of your site.

setcookie("cart", json_encode($cart), time() + 3600 * 24 * 10, "/");

7. Redirect the user to the cart viewing page which we will call cart.php.

header("Location: cart.php");

8. The final code:

<?php 
$productID = $_GET["id"];
$cart = json_decode($_COOKIE["cart"] ?? "{}", true);
if (!isset($cart[$productID])) $cart[$productID] = 1;
setcookie("cart", json_encode($cart), time() + 3600 * 24 * 10, "/");
header("Location: cart.php");
?>

View Cart

Create a file called cart.php to edit in the following steps.

9. Add html, body and PHP elements.

<html><body><?php ?></body></html>

10. Decode the cart cookie into an array and use a foreach loop to iterate over the elements.

$cart = json_decode($_COOKIE["cart"] ?? "{}", true);
foreach ($cart as $productID => $quantity) {

11. Output the details with links to add, subtract and remove each item.

    echo "<div>";
    echo "<span>Product #$productID x$quantity</span>";
    echo "<a>Add</a> <a>Sub</a> <a>Remove</a>";
    echo "</div>";
}

12. Add href attributes to add, subtract and remove items. We will adapt the add_to_cart.php file so it can do other cart manipulations. Send another GET attribute for the edit type.

    $editUrl = "edit_cart.php?id=$productID";
    echo "<a href='$editUrl&type=add'>Add</a>";
    echo "<a href='$editUrl&type=sub'>Sub</a>";
    echo "<a href='$editUrl&type=rem'>Remove</a>";

Edit Cart More

Now open edit_cart.php for editing in the following steps:

13. Assign a variable for the edit type from step 13 under the $productID.

$editType = $_GET["type"];

14. Use a switch statement on the edit type with 3 cases: "add", "sub" and "rem", after the cart variable is assigned and before the cart cookie is set, replacing the line if (!isset($cart...

switch ($editType) {
case "add":
    break;
case "sub":
    break;
case "rem":
    break;
}

15. For the "add" case, increment the quantity if the product is already in the cart. Otherwise add a new key with a quantity of 1.

if (isset($cart[$productID])) $cart[$productID]++;
else $cart[$productID] = 1;

16. For the "sub" case, decrement the quantity only if the product is already in the cart. Then, check if the quantity is invalid (zero or less) to remove the key from the cart array.

if (!isset($cart[$productID])) break;
$cart[$productID]--;
if ($cart[$productID] <= 0) unset($cart[$productID]);
break;

17. For the "rem" case, remove the key from the cart array.

unset($cart[$productID]);

18. Add two different products to your cart from the index page and then try adding, subtracting and removing from the cart page. The quantities should be updated accordingly.

19. The final code:

<?php 
$productID = $_GET["id"];
$editType = $_GET["type"];
$cart = json_decode($_COOKIE["cart"] ?? "{}", true);


switch ($editType) {
case "add":
    // Increment quantity of already added product.
    if (isset($cart[$productID])) $cart[$productID]++;
    // Otherwise put 1 quantity of product in cart.
    else $cart[$productID] = 1;
    break;
case "sub":
    if (!isset($cart[$productID])) break;
    // Decrement quantity of already added product
    $cart[$productID]--;
    if ($cart[$productID] <= 0)
        // If quantity is now 0, remove from cart.
        unset($cart[$productID]);
    break;
case "rem":
    unset($cart[$productID]);
    break;
}


setcookie("cart", json_encode($cart), time() + 3600 * 24 * 10, "/");
header("Location: cart.php");
?>

Parent topic: Example 5

E5 - Create Products Page

David Kanekanian — Wed, 15 Apr 2020 18:49:34 +0000

The products page shows customers the available products. For simplicity I will only list products by name.

1. Create an index.php page with html and body tags.

<html><body></body></html>

2. Add a heading saying ‘Product Page’.

<h2>Product Page</h2>

3. Add three products with a title and link to add it to the cart. The links won’t go anywhere yet.

<div> <span>Product #1</span> <a>Add to cart</a> </div>

The final code:

<html><body>
    <h2>Product Page</h2>
    <div> <span>Product #1</span> <a>Add to cart</a> </div>
    <div> <span>Product #2</span> <a>Add to cart</a> </div>
    <div> <span>Product #3</span> <a>Add to cart</a> </div>
</body></html>

Parent topic: Example 5

Exercise 5 - Shopping Facility

David Kanekanian — Wed, 15 Apr 2020 18:46:04 +0000

In this example, you will create a working online shop by combining the knowledge built up from the previous examples.

TODO: Add links below

Jump to section:

E4 - Extra Steps

David Kanekanian — Tue, 14 Apr 2020 19:23:19 +0000

Now that you know how to use some debugging features, try it out a few more times to build up your confidence. Here are some suggestions on what to try out:

Put a breakpoint on the form processing script from example 2 and step through the execution flow. Check it is doing what you expected.
Add a watch on an expression combining several variables, so that you can see observe changes to the whole expression. (Eg, $x + $y - 10)
Try opening the webpage on a computer in your network other than your development computer (localhost). You may need to check your computer's IP address.

Parent topic: Example 4

E4 - Using PHP Debugging Tools in Visual Studio Code

David Kanekanian — Tue, 14 Apr 2020 19:11:41 +0000

If you have not already setup XDebug in Visual Studio Code, please refer to the earlier stage, Setting up PHP debugging in Visual Studio Code. This post assumes you have XDebug installed and the launch configuration is created.

1. Copy this code into a file index.php as a starting point.

<?php
function makeMessage($name, $age)
{
    // Make the name have a capital first letter
    $first = strtoupper($name[0]);
    // Make the rest have small letters.
    $end = strtolower(substr($name, 1));
    // Save the two parts in the name variable.
    $name = $first . $end;


    // Ensure the age is in the valid range.
    assert(0 < $age && $age < 1000, "age must be between 1 and 999");


    // Return the final message.
    return "$name is $age years old!";
}


$message = makeMessage("david", 99);
echo $message;

?>

2. Click on line 18 where $message is set and add a breakpoint from Run > Toggle Breakpoint (hotkey F9). A red circle will appear on the left side of it.

3. Start debugging on the Run tab by clicking Run (hotkey F5) in Listen for XDebug mode.

4. Open this page in your browser (make sure Apache is started.) You should see the browser will not show anything and the Visual Studio Code window will gain focus.

5. Use the step into button to investigate inside the makeMessage() function.

6. Use the step over button for a few lines. You will see the state of local variables in the Run tab when they are assigned values.

7. Enter a debug command in the Debug tab (View > Debug Console) to check the first letter in $name. You can enter any valid expression here.

8. Press Continue to let the execution return to normal speed.

9. When you return to the browser, you will see that the output is ‘David is 99 years old!’

Parent topic: Example 4