PPDCampPortal/public/parts/signup.php

<?php
/*
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/.
 */

if (empty($IN_SITE)) {
    die("Access denied.");
}

$campers = [];
$adults = [];
$youth = [];

if (isset($_SESSION['familyid']) && $database->has('families', ['familyid' => $_SESSION['familyid']])) {
    $campers = $database->select("people", 'personid', ['AND' => ['familyid' => $_SESSION['familyid'], 'camperid[!]' => null]]);
    $adults = $database->select("people", 'personid', ['AND' => ['familyid' => $_SESSION['familyid'], 'adultid[!]' => null]]);
    $youth = $database->select("people", 'personid', ['AND' => ['familyid' => $_SESSION['familyid'], 'youthid[!]' => null]]);
}
?>
<div class="container mt-4">
    <form action="actions/submit.php" method="post" id="registrationform">
        <?php
        // Add a hidden form element, to detect if the renewal session
        // expired before we submitted the thing
        if (isset($_SESSION['familyid'])) {
            ?>
            <input type="hidden" name="editing" value="1" />
            <?php
        }
        ?>
        <div class="card mb-4 bg-green text-light">
            <div class="card-body">

                <div class="d-flex flex-wrap justify-content-around">
                    <div class="ml-auto mr-auto pl-4 align-self-center text-center">
                        <h1>Day Camp Registration</h1>
                    </div>
                </div>
            </div>
        </div>

        <?php
        if (!empty($_GET['error'])) {
            ?>
            <div class="card mb-4 bg-danger text-white">
                <div class="card-body">
                    <?php echo htmlspecialchars($_GET['error']); ?>
                </div>
            </div>
            <?php
        }
        ?>


        <!-- Campers -->
        <div class="card mb-4">
            <div class="card-header bg-green text-light">
                <h3><i class="fas fa-campground fa-fw"></i> Campers</h3>
            </div>
            <div class="list-group list-group-flush" id="camper_list">
                <?php
                $persontype = "camper";
                if (count($campers) > 0) {
                    foreach ($campers as $personid) {
                        include __DIR__ . "/template_person.php";
                    }
                } else {
                    include __DIR__ . "/template_person.php";
                }
                ?>
            </div>

            <div class="card-body">
                <div class="btn btn-sm btn-teal mt-1" id="add_camper">
                    <i class="fas fa-plus"></i> Add another
                </div>
            </div>
        </div>


        <!-- Adults -->
        <div class="card mb-4">
            <div class="card-header bg-green text-light">
                <h3><i class="fas fa-hiking fa-fw"></i> Adult Volunteers</h3>
            </div>
            <div class="list-group list-group-flush" id="adult_list">
                <?php
                $persontype = "adult";
                if (count($adults) > 0) {
                    foreach ($adults as $personid) {
                        include __DIR__ . "/template_person.php";
                    }
                } else {
                    include __DIR__ . "/template_person.php";
                }
                ?>
            </div>

            <div class="card-body">
                <div class="btn btn-sm btn-teal mt-1" id="add_adult">
                    <i class="fas fa-plus"></i> Add another
                </div>
            </div>
        </div>


        <!-- Youth Volunteers -->
        <div class="card mb-4">
            <div class="card-header bg-green text-light">
                <h3><i class="fas fa-walking fa-fw"></i> Youth Volunteers</h3>
            </div>
            <div class="list-group list-group-flush" id="youth_list">
                <?php
                $persontype = "youth";
                if (count($youth) > 0) {
                    foreach ($youth as $personid) {
                        include __DIR__ . "/template_person.php";
                    }
                } else {
                    include __DIR__ . "/template_person.php";
                }
                ?>
            </div>

            <div class="card-body">
                <div class="btn btn-sm btn-teal mt-1" id="add_youth">
                    <i class="fas fa-plus"></i> Add another
                </div>
            </div>
        </div>


        <!-- Payment -->
        <div class="card mb-4">
            <div class="card-header bg-green text-light">
                <h3><i class="fas fa-dollar-sign fa-fw"></i> Pay and Submit</h3>
            </div>
            <div class="card-body">
                <h4>Total: $<span id="total">0</span></h4>
                <noscript>
                    <div class="card-text text-danger mb-1">
                        <i class="fas fa-code"></i> JavaScript is required to complete your payment.
                    </div>
                </noscript>
                <div class="card-text text-success mb-1">
                    <i class="fas fa-lock"></i> We can't see your card info; it's sent directly and securely from your computer to our payment processor.
                </div>
                <label for="card-element">
                    Credit or debit card
                </label>
                <div id="card-element" class="form-control">

                </div>
                <div id="card-errors" class="alert alert-danger d-none"></div>
                <input type="hidden" name="stripeToken" id="stripe-token" required />
            </div>
            <div class="card-footer">
                <button type="submit" class="btn btn-teal" id="savebutton">
                    <span id="savebutton-text">
                        <i class="fas fa-arrow-right"></i> Submit<span class="d-none d-sm-inline"> Registration and Payment</span>
                    </span>
                    <span id="savebutton-wait" class="d-none">
                        <i class="fas fa-spinner fa-spin"></i> Working...
                    </span>
                </button>
            </div>
        </div>
    </form>
</div>

<script src="https://js.stripe.com/v3/"></script>
<script>
    var stripe_pubkey = '<?php echo $SETTINGS["stripe"]["pubkey"]; ?>';
</script>
<script src="static/signup.js"></script>