<?php
// session_start();
require("../includes/db_connect.php");
require_once("includes/session_token.php");

$accountId = $_SESSION['usr_accountId'];

$page_content = "";

$address_1 = "";
$address_2 = "";
$city = "";
$postal_code = "";
$region = "";
$website = "";
$country = "";
$referrer = "";
$referral_name = "";

$sql = "SELECT * FROM users WHERE accountId = :accountId LIMIT 1";
$sth = $conn->prepare($sql, [PDO::ATTR_CURSOR => PDO::CURSOR_FWDONLY]);
$sth->execute([':accountId' => $accountId]);
$users = $sth->fetchAll();

foreach ($users as $key => $value) {
    $accountId = $value['accountId'];
    $referrer = $value['referrer'];
    $fullName = $value['fullname'];
    $email = $value['email'];
    $country = $value['country'];
    $phone_number = $value['phone_number'];
    $address_1 = $value['address_1'];
    $address_2 = $value['address_2'];
    $city = $value['city'];
    $postal_code = $value['postal_code'];
    $region = $value['region'];
    $website = $value['website'];

    if ($phone_number == "default") {
        $phone_number = "";
    }

    $_SESSION['usr_accountId'] = $accountId;
    $_SESSION['usr_fullname'] = $fullName;
    $_SESSION['usr_email'] = $email;
}

if (!is_null($referrer)) {
    $referrer_sql = "SELECT fullname FROM users WHERE accountId = :accountId LIMIT 1";
    $sth = $conn->prepare($sql, [PDO::ATTR_CURSOR => PDO::CURSOR_FWDONLY]);
    $sth->execute([':accountId' => $referrer]);
    $result = $sth->fetch();
    $referral_name = $result['fullname'];
}

?>
<!DOCTYPE html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Profile Settings</title>
    <link rel="stylesheet" href="../css/bootstrap-select-country.min.css" />
    <link rel="stylesheet" href="../build/css/intlTelInput.css">

    <?php require_once("includes/header.php"); ?>


    <div class="content ht-100v pd-0">
        <div class="content-header center">
            <img src="../img/logo-white.png" class="aside-logo" style="width: 160px;" />
        </div>
        <div class="content-body">
            <div class="container pd-x-0">
                <div class="d-sm-flex align-items-center justify-content-between mg-b-20 mg-lg-b-25 mg-xl-b-30">
                    <div>
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb breadcrumb-style1 mg-b-10">
                                <li class="breadcrumb-item"><a href="account">Dashboard</a></li>
                            </ol>
                        </nav>
                        <h4 class="mg-b-0 tx-spacing--1">Settings</h4>
                    </div>
                </div>

                <div class="row row-xs">
                    <div class="col-md-3 col-lg-3 col-sm-12">
                        <div class="card">
                            <div class="card-body">
                                <nav class="nav nav-classic tx-13">
                                    <a id="mmn-profile-settings" href="profile-settings" class="nav-link"><i
                                            data-feather="user"></i> <span>Profile</span></a>
                                    <a id="mmn-change-password" href="change-password" class="nav-link"><i
                                            data-feather="lock" style="height: 50px;"></i> <span>Change
                                            Password</span></a>
                                    <a id="mmn-delete-account" href="delete-account" class="nav-link"><i
                                            data-feather="archive"></i> <span>Delete Account</span></a>

                                </nav>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9 col-lg-9 col-sm-12">
                        <div class="card">
                            <div class="card-body row">
                                <div style="display: none;" id="feedbackPrompt"></div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label>Your referral link</label>
                                    <input type="text" class="form-control"
                                        value="https://rocketta.io/create-account?ref=<?= $_SESSION['usr_accountId']; ?>" disabled/>
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label>Account ID</label>
                                    <input type="text" class="form-control"
                                        value="<?php echo ($_SESSION['usr_accountId']); ?>" disabled/>
                                </div>
                                <?php if(!is_null($referrer)): ?>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label>Referrer</label>
                                    <input type="text" class="form-control"
                                        value="<?php echo "$referral_name ($referrer)"; ?>" disabled/>
                                </div>
                                <?php endif; ?>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label>Email</label>
                                    <input type="text" class="form-control"
                                        value="<?php echo ($_SESSION['usr_email']); ?>" disabled/>
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label for="fullname">Full Name</label>
                                    <input type="text" class="form-control" id="fullname"
                                        value="<?php echo ($_SESSION['usr_fullname']); ?>">
                                    <div class="invalid-feedback fullname_feedback">Full name cannot be empty.</div>
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label for="address_1">Address 1</label>
                                    <input type="text" class="form-control" id="address_1"
                                        value="<?php echo ($address_1); ?>">
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label for="address_2">Address 2</label>
                                    <input type="text" class="form-control" id="address_2"
                                        value="<?php echo ($address_2); ?>">
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label for="city">City</label>
                                    <input type="text" class="form-control" id="city"
                                        value="<?php echo ($city); ?>">
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label>Country</label>
                                    <input type="text" class="form-control"
                                        value="<?php echo ($country); ?>" disabled/>
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label for="phone_number">Phone Number</label><br />
                                    <input type="tel" class="form-control" id="phone_number"
                                        value="<?php echo ($phone_number); ?>">
                                    <div class="invalid-feedback phone_number_feedback">Phone number cannot be empty.
                                    </div>
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label for="postal_code">ZIP/Postal code</label>
                                    <input type="text" class="form-control" id="postal_code"
                                        value="<?php echo ($postal_code); ?>">
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label for="region">Region</label>
                                    <input type="text" class="form-control" id="region"
                                        value="<?php echo ($region); ?>">
                                </div>
                                <div class="col-md-12" style="margin-top: 20px">
                                    <label for="website">Website</label>
                                    <input type="text" class="form-control" id="website"
                                        value="<?php echo ($website); ?>">
                                </div>
                                <div class="col-md-12" style="margin-top: 20px; margin-bottom: 20px">
                                    <button id="save_details_btn" class="btn btn-xs btn-primary flex-fill"
                                        style="font-size: .8125rem; font-weight: 600;">Save Changes
                                        <span style="display: none;"
                                            class="save_profile_spinner spinner-border spinner-border-sm" role="status"
                                            aria-hidden="false"></span>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div><!-- content-body -->
    </div><!-- content -->

    <?php require_once("includes/footer.php"); ?>
    <script src="../build/js/intlTelInput.min.js"></script>
    <script src="../build/js/intlTelInput-jquery.min.js"></script>
    <script src="../js/bootstrap-select-country.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        var classes = $("#mn-settings").prop('class');
        $("#mn-settings").prop('class', classes + ' active pcoded-trigger');

        var classes = $("#mmn-profile-settings").prop('class');
        $("#mmn-profile-settings").prop('class', classes + ' active pcoded-trigger');

    });
    </script>
    <script src="../js/profile-settings.js"></script>

    </body>

</html>