File: /var/www/html/video-rental/wp-content/themes/video-rental-olds/page-profile.php
<?php /* Template Name: Profile Page */
get_header();
$current_user = wp_get_current_user();
?>
<style>
.pagination-wrap {
margin-top: 20px;
text-align: center;
}
.pagination-link {
margin: 0 5px;
padding: 5px 10px;
border: 1px solid #ccc;
text-decoration: none;
color: white;
}
.pagination-link.active {
font-weight: bold;
background: rgb(163, 167, 170);
color: #fff;
}
.trailer-wrap {
cursor: pointer;
}
</style>
<div class="my-profile-head-wrap">
<div class="container custom-container">
<h2 class="profile-title">
My <span>Profile</span>
</h2>
<div class="content-wrap">
<!-- <div class="img-wrap">
<img src="<?php echo get_template_directory_uri(); ?>/img/man.png" alt="">
</div> -->
<!-- <div class="img-wrap">
<img src="<?php echo get_template_directory_uri(); ?>/img/man.png" alt="" class="img">
<button class="edit-btn"><img src="<?php echo get_template_directory_uri(); ?>/img/upload.svg" alt=""></button>
</div> -->
<div class="img-wrap">
<img class="img" id="profile-picture" src="<?php
$profile_pic = get_user_meta(get_current_user_id(), 'profile_picture', true);
echo $profile_pic ? esc_url($profile_pic) : get_stylesheet_directory_uri() . '/img/user.png';
?>" alt="">
<form id="uploadProfileImageForm" enctype="multipart/form-data">
<label for="img" class="edit-btn" style="cursor: pointer;">
<img src="<?php echo get_template_directory_uri(); ?>/img/upload.svg" alt="Upload Icon">
<input type="file" id="img" name="profile_image" accept="image/*" class="inp-file"
style="display: none;">
</label>
</form>
</div>
<div class="name"><?php echo esc_html($current_user->display_name); ?></div>
<ul class="contact">
<li><img src="<?php echo get_template_directory_uri(); ?>/img/phone.svg"
alt=""><span><?php echo esc_html($current_user->phone_country_code); ?>
<?php echo esc_html($current_user->phone); ?></span></li>
<li><img src="<?php echo get_template_directory_uri(); ?>/img/mail.svg" alt=""><span><a
href="<?php echo esc_html($current_user->user_email); ?>"><?php echo esc_html($current_user->user_email); ?></a></span>
</li>
</ul>
<ul class="action">
<li class="cursor">
<a data-bs-toggle="modal" data-bs-target="#editProfileModal"><img
src="<?php echo get_template_directory_uri(); ?>/img/edit.svg" alt="">
<span>Edit</span></a>
</li>
<li>
<a href="#" data-bs-toggle="modal" data-bs-target="#changepassword" class="link"><img
src="<?php echo get_template_directory_uri(); ?>/img/ch-pass.svg" alt="">
<span>Change Password</span></a>
</li>
<li>
<a href="#" data-bs-toggle="modal" data-bs-target="#logoutModal" class="link"><img
src="<?php echo get_template_directory_uri(); ?>/img/log-out.svg" alt="">
<span>Log Out</span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="rental-tab-wrap">
<div class="container custom-container">
<ul class="nav nav-tabs" id="profiledata" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="myrental-tab" data-bs-toggle="tab" data-bs-target="#myrental"
type="button" role="tab">
My Rentals
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="transaction-tab" data-bs-toggle="tab" data-bs-target="#transaction"
type="button" role="tab">
My Transactions
</button>
</li>
</ul>
<div class="tab-content" id="profiledataContent">
<?php
$current_user_id = get_current_user_id();
global $wpdb;
$items_per_page = 10; // Customize as needed
$current_page = isset($_GET['rental_page']) ? max(1, intval($_GET['rental_page'])) : 1;
$offset = ($current_page - 1) * $items_per_page;
// Count total records
$total_items = $wpdb->get_var(
$wpdb->prepare("SELECT COUNT(*) FROM wp_video_rentals WHERE user_id = %d", $current_user_id)
);
// Fetch paginated data
$rentals = $wpdb->get_results(
$wpdb->prepare(
"SELECT * FROM wp_video_rentals WHERE user_id = %d ORDER BY rented_at DESC LIMIT %d OFFSET %d",
$current_user_id,
$items_per_page,
$offset
)
);
function format_duration($start_date, $end_date)
{
$diff = date_diff(date_create($start_date), date_create($end_date));
return $diff->format('%dd %hh %im');
}
?>
<div class="tab-pane fade show active" id="myrental" role="tabpanel">
<div class="content-wrap">
<div class="table-title">
My Rentals
<?php
if ($total_items > 0) { ?>
<div class="num"><?php echo $total_items ?></div>
<?php } ?>
</div>
<div class="table-wrap myrental-table-wrap">
<table width="100%" cellpadding="0" cellspacing="0" class="table">
<tr>
<th class="space"></th>
<th class="th-col-1">Video title</th>
<th class="th-col-2">License</th>
<th class="th-col-3">Rented From</th>
<th class="th-col-4">Rented To</th>
<th class="th-col-5">Rented Duration</th>
</tr>
<?php
if (!empty($rentals)) {
foreach ($rentals as $rental) {
$post = get_post($rental->video_id);
$title = $post ? $post->post_title : 'Untitled';
$vm_main_video_url = get_post_meta($rental->video_id, 'vm_main_video_url', true);
// Extract the path
$path = parse_url($vm_main_video_url, PHP_URL_PATH);
// Match the video ID using regex
preg_match('#/([a-f0-9]{32})/#', $path, $matches);
// Get the video ID
$video_id = $matches[1] ?? null;
// Get thumbnail URL
// $thumbnail_id = get_post_meta($rental->video_id, 'vm_video_thumbnail', true);
$thumbnail_url = get_post_meta($rental->video_id, 'vm_video_thumbnail', true);
// Fallback if empty
if (empty($thumbnail_url)) {
$thumbnail_url = get_template_directory_uri() . '/img/trailer.png';
}
// Format dates
$start = new DateTime($rental->rented_at);
$end = clone $start;
$end->modify("+{$rental->rental_duration} days");
$duration = format_duration($start->format('Y-m-d H:i:s'), $end->format('Y-m-d H:i:s'));
?>
<tr>
<td class="space"></td>
<td class="td-col-1">
<div class="trailer-wrap" data-bs-toggle="modal" data-bs-target="#videoModal"
data-video-id="<?php echo esc_attr($video_id); ?>">
<!-- Cloudflare Stream video ID -->
<img src="<?php echo esc_url($thumbnail_url); ?>" alt="" class="img">
<span><?php echo esc_html($title); ?></span>
</div>
</td>
<td class="td-col-2"><?php echo esc_html($rental->license_type); ?></td>
<td class="td-col-3"><?php echo esc_html($start->format('M d, Y h:i a')); ?></td>
<td class="td-col-4"><?php echo esc_html($end->format('M d, Y h:i a')); ?></td>
<td class="td-col-5"><?php echo esc_html($duration); ?></td>
</tr>
<?php }
} else {
?>
<tr>
<td colspan="6" style="text-align: center; padding: 20px; font-style: italic;">
No rentals found.
</td>
</tr>
<?php
}
?>
</table>
<?php
$total_pages = ceil($total_items / $items_per_page);
if ($total_pages > 1) {
echo '<div class="pagination-wrap">';
for ($i = 1; $i <= $total_pages; $i++) {
echo '<a class="pagination-link ' . ($i === $current_page ? 'active' : '') . '" href="?rental_page=' . $i . '#myrental">' . $i . '</a>';
}
echo '</div>';
}
?>
</div>
</div>
</div>
<!-- Signup Tab -->
<div class="tab-pane fade" id="transaction" role="tabpanel">
<div class="content-wrap">
<?php
$current_user_id = get_current_user_id();
global $wpdb;
$items_per_page = 10;
$current_page = isset($_GET['txn_page']) ? max(1, intval($_GET['txn_page'])) : 1;
$offset = ($current_page - 1) * $items_per_page;
// Count total transactions for this user via rentals
$total_transactions = $wpdb->get_var(
$wpdb->prepare(
"SELECT COUNT(*) FROM wp_video_transactions t
JOIN wp_video_rentals r ON t.rental_id = r.id
WHERE r.user_id = %d",
$current_user_id
)
);
// Fetch paginated transactions
$transactions = $wpdb->get_results(
$wpdb->prepare(
"SELECT t.*,r.* FROM wp_video_transactions t
JOIN wp_video_rentals r ON t.rental_id = r.id
WHERE r.user_id = %d
LIMIT %d OFFSET %d",
$current_user_id,
$items_per_page,
$offset
)
);
?>
<div class="table-title">
My Transactions
<?php
if ($total_transactions > 0) { ?>
<div class="num"><?php echo $total_transactions ?></div>
<?php } ?>
</div>
<div class="table-wrap trans-table-wrap">
<table width="100%" cellpadding="0" cellspacing="0" class="table">
<tr>
<th class="space"></th>
<th class="th-col-1">Transaction ID</th>
<th class="th-col-2">Purchase title</th>
<th class="th-col-3">Transaction date and time</th>
<th class="th-col-4">Rented till date and time</th>
<th class="th-col-5">License</th>
<th class="th-col-6">Amount</th>
<th class="th-col-7 txt-center">Download invoice</th>
</tr>
<!-- <tr>
<td class="space"></td>
<td class="td-col-1">12334556644</td>
<td class="td-col-2">Lorem Ipsum is simply dummy </td>
<td class="td-col-3">Apr 22, 2025 8:31 am</td>
<td class="td-col-4">Apr 22, 2025 8:31 am</td>
<td class="td-col-5">Single</td>
<td class="td-col-6">$ 150</td>
<td class="td-col-7"><img src="<?php echo get_template_directory_uri(); ?>/img/invoice.svg" alt="" class="invoice"></td>
</tr> -->
<?php
if (!empty($transactions)) {
foreach ($transactions as $txn) {
$post = get_post($txn->video_id);
$title = $post ? $post->post_title : 'Untitled';
$rented_from = new DateTime($txn->rented_at);
$rented_to = clone $rented_from;
// Sanitize before using in modify()
$days = intval($txn->duration_days);
if ($days > 0) {
$rented_to->modify("+{$days} days");
} else {
// Fallback: treat as same day rental or set to null
$rented_to = clone $rented_from;
}
$invoice_icon = get_template_directory_uri() . '/img/invoice.svg';
?>
<tr>
<td class="space"></td>
<td class="td-col-1"><?php echo esc_html($txn->transaction_id); ?></td>
<td class="td-col-2"><?php echo esc_html($title); ?></td>
<td class="td-col-3">
<?php echo esc_html(date('M d, Y h:i a', strtotime($txn->rented_at))); ?>
</td>
<td class="td-col-4"><?php echo esc_html($rented_to->format('M d, Y h:i a')); ?></td>
<td class="td-col-5"><?php echo esc_html($txn->license_type ?? 'Single'); ?></td>
<td class="td-col-6">$ <?php echo esc_html(number_format($txn->amount, 2)); ?></td>
<td class="td-col-7 txt-center">
<a href="javascript:void(0);" class="download-trans-invoice-btn"
data-tid="<?= $txn->id ?>">
<img src="<?php echo get_template_directory_uri(); ?>/img/invoice.svg" alt=""
class="invoice">
</a>
<!-- data-transid="<?= $txn->id ?>" -->
</td>
</tr>
<?php
}
} else {
?>
<tr>
<td colspan="8" style="text-align:center; padding: 20px; font-style: italic;">
No transactions found.
</td>
</tr>
<?php } ?>
</table>
<?php
$total_pages = ceil($total_transactions / $items_per_page);
if ($total_pages > 1) {
echo '<div class="pagination-wrap">';
for ($i = 1; $i <= $total_pages; $i++) {
echo '<a class="pagination-link ' . ($i === $current_page ? 'active' : '') . '" href="?txn_page=' . $i . '#transaction">' . $i . '</a>';
}
echo '</div>';
}
?>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modal Edit Profile -->
<?php
$current_user = wp_get_current_user();
$first_name = esc_attr($current_user->first_name);
$last_name = esc_attr($current_user->last_name);
$email = esc_attr($current_user->user_email);
?>
<!--Edit profile Modal -->
<div class="modal fade chage-pswd-modal edit-profile-modal custom-modal" id="editProfileModal" tabindex="-1"
aria-labelledby="forgotModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered">
<div class="modal-content">
<div class="modal-header border-0">
<button type="button" class="close-btn" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="icon-bx modal-title">
<span class="icon"><img src="<?php echo get_template_directory_uri(); ?>/img/icon1.svg"></span>
<span>Edit<span class="light">Profile</span></span>
</div>
<div class="modal-form-block">
<form class="edit-form" id="edit-profile-form" data-parsley-validate>
<div class="row">
<div class="col-md-6">
<div class="custom-inp-cover">
<label for="" class="form-label">First Name</label>
<div class="input-group-custom">
<input class="form-control custom-inp" type="text" autocomplete="off"
maxlength="50" name="first_name" value="<?php echo $first_name; ?>"
data-parsley-pattern="^[A-Za-z][A-Za-z '’-]*$" required
data-parsley-trigger="change"
data-parsley-required-message="First name is required."
data-parsley-pattern-message="Only alphabets, spaces, hyphens, and apostrophes are allowed."
oninput="validateName(this)" placeholder="Enter your first name">
</div>
</div>
</div>
<div class="col-md-6">
<div class="custom-inp-cover">
<label for="" class="form-label">Last Name</label>
<div class="input-group-custom">
<input class="form-control custom-inp" type="text" autocomplete="off"
maxlength="50" name="last_name" value="<?php echo $last_name; ?>"
data-parsley-pattern="^[A-Za-z][A-Za-z '’-]*$" required
data-parsley-trigger="change"
data-parsley-required-message="Last name is required."
data-parsley-pattern-message="Only alphabets, spaces, hyphens, and apostrophes are allowed."
oninput="validateName(this)" placeholder="Enter your last name">
</div>
</div>
</div>
<?php
$country_code = get_user_meta($current_user->ID, 'phone_country_code', true);
$phone = get_user_meta($current_user->ID, 'phone', true);
?>
<div class="col-md-6">
<div class="custom-inp-cover">
<label for="" class="form-label">Phone Number</label>
<div class="d-flex custom-phone-wrapper">
<select class="form-select custom-select-code">
<?php foreach ($country_codes as $code => $label): ?>
<option value="<?php echo esc_attr($code); ?>" <?php selected($code, '+1'); ?>>
<?php echo esc_html($code); ?>
</option>
<?php endforeach; ?>
</select>
<input class="form-control custom-phone-input" type="text" maxlength="10"
autocomplete="off" name="phone" value="<?php echo esc_attr($phone); ?>"
required data-parsley-pattern="^[0-9]{10}$" data-parsley-trigger="change"
data-parsley-required-message="Phone number is required."
data-parsley-pattern-message="Enter a valid 10-digit phone number."
onkeypress="return event.charCode >= 48 && event.charCode <= 57"
inputmode="numeric" placeholder="Enter your phone number">
</div>
</div>
</div>
<div class="col-md-6">
<div class="custom-inp-cover">
<label for="" class="form-label">Email</label>
<div class="input-group-custom">
<input class="form-control custom-inp email-inp" readonly type="email"
autocomplete="off" name="email" id="email" value="<?php echo $email; ?>"
required data-parsley-type="email" maxlength="50"
data-parsley-trigger="change"
data-parsley-required-message="Email is required."
data-parsley-pattern-message="Invalid email format. Use a valid email address."
placeholder="Enter your email">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer d-flex justify-content-end">
<button class="btn back-btn verify-btn">Back to Home</button>
<button type="submit" class="btn verify-btn" id="profile-btn">Submit</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="modal fade otp-modal setpassword custom-modal" id="changepassword" tabindex="-1"
aria-labelledby="changepasswordLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header border-0">
<button type="button" class="close-btn" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="icon-bx modal-title">
<span class="icon"><img src="<?php echo get_template_directory_uri(); ?>/img/icon1.svg"></span>
<span>Change <span class="light">Password</span></span>
</div>
<form class="edit-form" id="password-form" data-parsley-validate>
<div class="form-group position-relative">
<label class="form-label">Current Password</label>
<input type="password" name="current_password" class="form-control"
placeholder="Enter your current password" required
data-parsley-required-message="Current password is required."
data-parsley-length-message="Password must be between 8 and 20 characters long.">
<span class="toggle-password eye-ico">
<img src="<?php echo get_template_directory_uri(); ?>/img/eye-ico.svg" alt="eye-ico"
class="show">
</span>
</div>
<div class="form-group position-relative">
<label class="form-label">New Password</label>
<input type="password" name="new_password" class="form-control"
placeholder="Enter your new password" required data-parsley-minlength="6"
data-parsley-required-message="New password is required."
data-parsley-length-message="Password must be between 8 and 20 characters long."
data-parsley-minlength-message="New password must be at least 6 characters long.">
<span class="toggle-password eye-ico">
<img src="<?php echo get_template_directory_uri(); ?>/img/eye-ico.svg" alt="eye-ico"
class="show">
</span>
</div>
<div class="form-group position-relative">
<label class="form-label">Confirm New Password</label>
<input type="password" name="confirm_password" class="form-control"
placeholder="Confirm your new password" required
data-parsley-equalto="[name='new_password']"
data-parsley-required-message="Confirm your new password."
data-parsley-length-message="Password must be between 8 and 20 characters long."
data-parsley-equalto-message="Passwords do not match.">
<span class="toggle-password eye-ico">
<img src="<?php echo get_template_directory_uri(); ?>/img/eye-ico.svg" alt="eye-ico"
class="show">
</span>
</div>
<div class="modal-footer">
<button type="button" class="btn back-btn" data-bs-dismiss="modal">Back to Home</button>
<button type="submit" class="btn submit-btn">Submit</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="modal fade video-full-screen" id="videoModal" tabindex="-1" aria-labelledby="videoModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content bg-black">
<div class="modal-header border-0">
<button type="button" class="btn-close btn-close-white ms-auto" data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="modal-body p-0" id="videoModalBody">
<!-- Player will be injected here -->
</div>
</div>
</div>
</div>
<?php get_footer(); ?>
<script>
document.addEventListener('DOMContentLoaded', function () {
const trailerWraps = document.querySelectorAll('.trailer-wrap');
const modalBody = document.getElementById('videoModalBody');
trailerWraps.forEach(function (wrap) {
wrap.addEventListener('click', function () {
const videoId = this.getAttribute('data-video-id');
modalBody.innerHTML = `
<stream src="${videoId}" controls></stream>
`;
// Create script element dynamically to avoid parsing issues
const script = document.createElement('script');
script.setAttribute('data-cfasync', 'false');
script.setAttribute('defer', '');
script.type = 'text/javascript';
script.src = `https://embed.cloudflarestream.com/embed/r4xu.fla9.latest.js?video=${videoId}`;
modalBody.appendChild(script);
});
});
// Cleanup player on modal close
document.getElementById('videoModal').addEventListener('hidden.bs.modal', function () {
modalBody.innerHTML = '';
});
});
jQuery(document).ready(function ($) {
$('.download-trans-invoice-btn').on('click', function () {
let transid = $(this).data('tid');
let invoiceTransUrl = "<?php echo get_template_directory_uri(); ?>/invoices/transaction_user.php?transid=" + transid;
window.open(invoiceTransUrl, '_blank');
});
});
</script>