| 1 |
<?php |
| 2 |
/** |
| 3 |
* Login Shortcode Template |
| 4 |
* |
| 5 |
* @package Yatra |
| 6 |
* @var array $atts Shortcode attributes |
| 7 |
* @var string $redirect_url Redirect URL after login |
| 8 |
*/ |
| 9 |
|
| 10 |
// Prevent direct access |
| 11 |
if (!defined('ABSPATH')) { |
| 12 |
exit; |
| 13 |
} |
| 14 |
|
| 15 |
// Get and validate variables |
| 16 |
$atts = get_query_var('yatra_login_atts', []); |
| 17 |
$redirect_url = get_query_var('yatra_redirect_url', home_url('/' . \Yatra\Services\SettingsService::getAccountBase())); |
| 18 |
|
| 19 |
// Generate unique form ID for this instance |
| 20 |
$form_id = 'yatra-login-form-' . uniqid(); |
| 21 |
|
| 22 |
// Security nonce |
| 23 |
$login_nonce = wp_create_nonce('yatra_login_nonce'); |
| 24 |
|
| 25 |
// Account CREATION is gated by Yatra's own setting — the same one the backend |
| 26 |
// enforces (AuthController::register rejects registration when it is off). This |
| 27 |
// deliberately does NOT use WordPress core's get_option('users_can_register'): |
| 28 |
// Yatra registers customers via wp_create_user() directly, so the core toggle |
| 29 |
// (off by default) is irrelevant and was previously hiding the register option |
| 30 |
// entirely. |
| 31 |
$registration_enabled = \Yatra\Services\SettingsService::isEnabled('customer_registration'); |
| 32 |
|
| 33 |
// Nonce reused by the inline register (REST) and forgot-password (AJAX) forms. |
| 34 |
$auth_action_nonce = wp_create_nonce('yatra_login_action'); |
| 35 |
?> |
| 36 |
|
| 37 |
<div class="yatra-login-shortcode" data-form-id="<?php echo esc_attr($form_id); ?>"> |
| 38 |
<div class="yatra-login-container"> |
| 39 |
<div class="yatra-login-header"> |
| 40 |
<?php // Title + subtitle are kept in sync with the active panel by JS |
| 41 |
// (each .yatra-auth-panel carries data-header-* copy). Rendered |
| 42 |
// here with the login-state copy so there is no flash on load. ?> |
| 43 |
<h2 class="yatra-login-title"><?php echo esc_html($atts['title']); ?></h2> |
| 44 |
<p class="yatra-login-subtitle"<?php echo empty($atts['subtitle']) ? ' style="display:none;"' : ''; ?>><?php echo esc_html($atts['subtitle'] ?? ''); ?></p> |
| 45 |
</div> |
| 46 |
|
| 47 |
<div class="yatra-login-form-container"> |
| 48 |
<?php if ($atts['show_register'] === 'yes' && $registration_enabled): ?> |
| 49 |
<div class="yatra-login-tabs" role="tablist" aria-label="<?php esc_attr_e('Login or create an account', 'yatra'); ?>"> |
| 50 |
<button type="button" class="yatra-login-tab is-active" data-target="login" id="<?php echo esc_attr($form_id); ?>-tab-login" role="tab" aria-selected="true" aria-controls="<?php echo esc_attr($form_id); ?>-panel-login" tabindex="0"> |
| 51 |
<?php esc_html_e('Login', 'yatra'); ?> |
| 52 |
</button> |
| 53 |
<button type="button" class="yatra-login-tab" data-target="register" id="<?php echo esc_attr($form_id); ?>-tab-register" role="tab" aria-selected="false" aria-controls="<?php echo esc_attr($form_id); ?>-panel-register" tabindex="-1"> |
| 54 |
<?php esc_html_e('Sign Up', 'yatra'); ?> |
| 55 |
</button> |
| 56 |
</div> |
| 57 |
<?php endif; ?> |
| 58 |
|
| 59 |
<div class="yatra-auth-panel yatra-auth-panel-login" data-panel="login" |
| 60 |
data-header-title="<?php echo esc_attr($atts['title']); ?>" |
| 61 |
data-header-subtitle="<?php echo esc_attr($atts['subtitle'] ?? ''); ?>" |
| 62 |
data-footer-text="<?php echo esc_attr__('Your login information is secure and encrypted.', 'yatra'); ?>"<?php if ($atts['show_register'] === 'yes' && $registration_enabled): ?> id="<?php echo esc_attr($form_id); ?>-panel-login" role="tabpanel" aria-labelledby="<?php echo esc_attr($form_id); ?>-tab-login" tabindex="0"<?php endif; ?>> |
| 63 |
<form class="yatra-login-form" id="<?php echo esc_attr($form_id); ?>" method="post" action="" data-ajax="true"> |
| 64 |
<?php wp_nonce_field('yatra_login_action', 'yatra_login_nonce', true, true); ?> |
| 65 |
<div class="yatra-form-group"> |
| 66 |
<label for="<?php echo esc_attr($form_id); ?>-username" class="yatra-form-label"> |
| 67 |
<?php esc_html_e('Email or Username', 'yatra'); ?> |
| 68 |
</label> |
| 69 |
<input |
| 70 |
type="text" |
| 71 |
id="<?php echo esc_attr($form_id); ?>-username" |
| 72 |
name="log" |
| 73 |
class="yatra-form-input" |
| 74 |
placeholder="<?php esc_attr_e('Enter your email or username', 'yatra'); ?>" |
| 75 |
required |
| 76 |
autocomplete="username" |
| 77 |
maxlength="60" |
| 78 |
pattern="([a-zA-Z0-9._%+\\-]+@[a-zA-Z0-9.\\-]+\\.[a-zA-Z]{2,})|([a-zA-Z0-9._\\-]{3,20})" |
| 79 |
title="<?php esc_attr_e('Enter a valid email address or username', 'yatra'); ?>" |
| 80 |
> |
| 81 |
</div> |
| 82 |
|
| 83 |
<div class="yatra-form-group"> |
| 84 |
<label for="<?php echo esc_attr($form_id); ?>-password" class="yatra-form-label"> |
| 85 |
<?php esc_html_e('Password', 'yatra'); ?> |
| 86 |
</label> |
| 87 |
<div class="yatra-password-input-group"> |
| 88 |
<input |
| 89 |
type="password" |
| 90 |
id="<?php echo esc_attr($form_id); ?>-password" |
| 91 |
name="pwd" |
| 92 |
class="yatra-form-input" |
| 93 |
placeholder="<?php esc_attr_e('Enter your password', 'yatra'); ?>" |
| 94 |
required |
| 95 |
autocomplete="current-password" |
| 96 |
maxlength="72" |
| 97 |
title="<?php esc_attr_e('Enter your password', 'yatra'); ?>" |
| 98 |
> |
| 99 |
<button type="button" class="yatra-password-toggle" aria-label="<?php esc_attr_e('Toggle password visibility', 'yatra'); ?>" data-target="<?php echo esc_attr($form_id); ?>-password"> |
| 100 |
<?php echo yatra_svg_icon('eye', 'yatra-eye-icon'); ?> |
| 101 |
<?php echo yatra_svg_icon('eye-off', 'yatra-eye-off-icon'); ?> |
| 102 |
</button> |
| 103 |
</div> |
| 104 |
</div> |
| 105 |
|
| 106 |
<?php if ($atts['remember_me'] === 'yes'): ?> |
| 107 |
<div class="yatra-form-group yatra-form-checkbox"> |
| 108 |
<div class="yatra-checkbox-wrapper"> |
| 109 |
<label class="yatra-checkbox-label" for="<?php echo esc_attr($form_id); ?>-remember"> |
| 110 |
<input type="checkbox" name="rememberme" id="<?php echo esc_attr($form_id); ?>-remember" value="forever"> |
| 111 |
<span class="yatra-checkbox-custom"> |
| 112 |
<svg class="yatra-check-icon" width="16" height="16" viewBox="0 0 24 24" fill="none" aria-hidden="true"> |
| 113 |
<path d="M20 6L9 17L4 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> |
| 114 |
</svg> |
| 115 |
</span> |
| 116 |
<span class="yatra-checkbox-text"><?php esc_html_e('Remember me', 'yatra'); ?></span> |
| 117 |
</label> |
| 118 |
</div> |
| 119 |
</div> |
| 120 |
<?php endif; ?> |
| 121 |
|
| 122 |
<div class="yatra-form-actions"> |
| 123 |
<button type="submit" class="yatra-btn yatra-btn-primary yatra-btn-full" id="<?php echo esc_attr($form_id); ?>-submit"> |
| 124 |
<span class="yatra-btn-text"><?php esc_html_e('Login', 'yatra'); ?></span> |
| 125 |
<span class="yatra-btn-loading" style="display: none;"> |
| 126 |
<?php esc_html_e('Logging in...', 'yatra'); ?> |
| 127 |
</span> |
| 128 |
</button> |
| 129 |
</div> |
| 130 |
|
| 131 |
<input type="hidden" name="redirect_to" value="<?php echo esc_url($redirect_url); ?>"> |
| 132 |
<input type="hidden" name="form_id" value="<?php echo esc_attr($form_id); ?>"> |
| 133 |
</form> |
| 134 |
|
| 135 |
<?php if ($atts['show_forgot_password'] === 'yes'): ?> |
| 136 |
<div class="yatra-forgot-password"> |
| 137 |
<?php // href kept as a no-JS fallback; JS intercepts to open the inline reset panel. ?> |
| 138 |
<a href="<?php echo esc_url(wp_lostpassword_url()); ?>" class="yatra-link yatra-auth-switch" data-target="forgot"> |
| 139 |
<?php esc_html_e('Forgot your password?', 'yatra'); ?> |
| 140 |
</a> |
| 141 |
</div> |
| 142 |
<?php endif; ?> |
| 143 |
|
| 144 |
<?php if ($atts['show_register'] === 'yes' && $registration_enabled): ?> |
| 145 |
<div class="yatra-register-prompt"> |
| 146 |
<p> |
| 147 |
<?php esc_html_e("Don't have an account?", 'yatra'); ?> |
| 148 |
<?php // href kept as a no-JS fallback; JS intercepts to switch to the register tab. ?> |
| 149 |
<a href="<?php echo esc_url(wp_registration_url()); ?>" class="yatra-link yatra-link-bold yatra-auth-switch" data-target="register"> |
| 150 |
<?php esc_html_e('Sign up', 'yatra'); ?> |
| 151 |
</a> |
| 152 |
</p> |
| 153 |
</div> |
| 154 |
<?php endif; ?> |
| 155 |
|
| 156 |
</div><?php // .yatra-auth-panel-login ?> |
| 157 |
|
| 158 |
<?php if ($atts['show_register'] === 'yes' && $registration_enabled): ?> |
| 159 |
<div class="yatra-auth-panel yatra-auth-panel-register" data-panel="register" |
| 160 |
data-header-title="<?php echo esc_attr__('Create Account', 'yatra'); ?>" |
| 161 |
data-header-subtitle="<?php echo esc_attr__('Create an account to manage your bookings and travel updates.', 'yatra'); ?>" |
| 162 |
data-footer-text="<?php echo esc_attr__('Your details are secure and encrypted.', 'yatra'); ?>" |
| 163 |
id="<?php echo esc_attr($form_id); ?>-panel-register" role="tabpanel" aria-labelledby="<?php echo esc_attr($form_id); ?>-tab-register" tabindex="0" style="display: none;" aria-hidden="true"> |
| 164 |
<form class="yatra-register-form" id="<?php echo esc_attr($form_id); ?>-register" method="post" action="" data-ajax="true" novalidate> |
| 165 |
<input type="hidden" name="yatra_login_nonce" value="<?php echo esc_attr($auth_action_nonce); ?>"> |
| 166 |
<div class="yatra-form-row" style="display: flex; gap: 12px;"> |
| 167 |
<div class="yatra-form-group" style="flex: 1;"> |
| 168 |
<label for="<?php echo esc_attr($form_id); ?>-reg-first-name" class="yatra-form-label"> |
| 169 |
<?php esc_html_e('First Name', 'yatra'); ?> |
| 170 |
</label> |
| 171 |
<input type="text" id="<?php echo esc_attr($form_id); ?>-reg-first-name" name="first_name" class="yatra-form-input" required maxlength="60" autocomplete="given-name" placeholder="<?php esc_attr_e('Enter your first name', 'yatra'); ?>"> |
| 172 |
</div> |
| 173 |
<div class="yatra-form-group" style="flex: 1;"> |
| 174 |
<label for="<?php echo esc_attr($form_id); ?>-reg-last-name" class="yatra-form-label"> |
| 175 |
<?php esc_html_e('Last Name', 'yatra'); ?> |
| 176 |
</label> |
| 177 |
<input type="text" id="<?php echo esc_attr($form_id); ?>-reg-last-name" name="last_name" class="yatra-form-input" required maxlength="60" autocomplete="family-name" placeholder="<?php esc_attr_e('Enter your last name', 'yatra'); ?>"> |
| 178 |
</div> |
| 179 |
</div> |
| 180 |
<div class="yatra-form-group"> |
| 181 |
<label for="<?php echo esc_attr($form_id); ?>-reg-email" class="yatra-form-label"> |
| 182 |
<?php esc_html_e('Email', 'yatra'); ?> |
| 183 |
</label> |
| 184 |
<input type="email" id="<?php echo esc_attr($form_id); ?>-reg-email" name="email" class="yatra-form-input" required maxlength="100" autocomplete="email" placeholder="<?php esc_attr_e('you@example.com', 'yatra'); ?>"> |
| 185 |
</div> |
| 186 |
<div class="yatra-form-group"> |
| 187 |
<label for="<?php echo esc_attr($form_id); ?>-reg-phone" class="yatra-form-label"> |
| 188 |
<?php esc_html_e('Phone', 'yatra'); ?> <span style="color:#9ca3af; font-weight:400;">(<?php esc_html_e('optional', 'yatra'); ?>)</span> |
| 189 |
</label> |
| 190 |
<input type="tel" id="<?php echo esc_attr($form_id); ?>-reg-phone" name="phone" class="yatra-form-input" maxlength="30" autocomplete="tel" placeholder="<?php esc_attr_e('Enter your phone number', 'yatra'); ?>"> |
| 191 |
</div> |
| 192 |
<div class="yatra-form-group"> |
| 193 |
<label for="<?php echo esc_attr($form_id); ?>-reg-password" class="yatra-form-label"> |
| 194 |
<?php esc_html_e('Password', 'yatra'); ?> |
| 195 |
</label> |
| 196 |
<div class="yatra-password-input-group"> |
| 197 |
<input type="password" id="<?php echo esc_attr($form_id); ?>-reg-password" name="password" class="yatra-form-input" required minlength="8" autocomplete="new-password" placeholder="<?php esc_attr_e('Minimum 8 characters', 'yatra'); ?>"> |
| 198 |
<button type="button" class="yatra-password-toggle" aria-label="<?php esc_attr_e('Toggle password visibility', 'yatra'); ?>" data-target="<?php echo esc_attr($form_id); ?>-reg-password"> |
| 199 |
<?php echo yatra_svg_icon('eye', 'yatra-eye-icon'); ?> |
| 200 |
<?php echo yatra_svg_icon('eye-off', 'yatra-eye-off-icon'); ?> |
| 201 |
</button> |
| 202 |
</div> |
| 203 |
</div> |
| 204 |
<div class="yatra-form-group"> |
| 205 |
<label for="<?php echo esc_attr($form_id); ?>-reg-confirm-password" class="yatra-form-label"> |
| 206 |
<?php esc_html_e('Confirm Password', 'yatra'); ?> |
| 207 |
</label> |
| 208 |
<div class="yatra-password-input-group"> |
| 209 |
<input type="password" id="<?php echo esc_attr($form_id); ?>-reg-confirm-password" name="confirm_password" class="yatra-form-input" required minlength="8" autocomplete="new-password" placeholder="<?php esc_attr_e('Re-enter password', 'yatra'); ?>"> |
| 210 |
<button type="button" class="yatra-password-toggle" aria-label="<?php esc_attr_e('Toggle password visibility', 'yatra'); ?>" data-target="<?php echo esc_attr($form_id); ?>-reg-confirm-password"> |
| 211 |
<?php echo yatra_svg_icon('eye', 'yatra-eye-icon'); ?> |
| 212 |
<?php echo yatra_svg_icon('eye-off', 'yatra-eye-off-icon'); ?> |
| 213 |
</button> |
| 214 |
</div> |
| 215 |
</div> |
| 216 |
<div class="yatra-form-actions"> |
| 217 |
<button type="submit" class="yatra-btn yatra-btn-primary yatra-btn-full"> |
| 218 |
<span class="yatra-btn-text"><?php esc_html_e('Create Account', 'yatra'); ?></span> |
| 219 |
<span class="yatra-btn-loading" style="display: none;"><?php esc_html_e('Creating account...', 'yatra'); ?></span> |
| 220 |
</button> |
| 221 |
</div> |
| 222 |
</form> |
| 223 |
<div class="yatra-register-prompt"> |
| 224 |
<p> |
| 225 |
<?php esc_html_e('Already have an account?', 'yatra'); ?> |
| 226 |
<a href="#" class="yatra-link yatra-link-bold yatra-auth-switch" data-target="login"> |
| 227 |
<?php esc_html_e('Log in', 'yatra'); ?> |
| 228 |
</a> |
| 229 |
</p> |
| 230 |
</div> |
| 231 |
</div><?php // .yatra-auth-panel-register ?> |
| 232 |
<?php endif; ?> |
| 233 |
|
| 234 |
<?php if ($atts['show_forgot_password'] === 'yes'): ?> |
| 235 |
<div class="yatra-auth-panel yatra-auth-panel-forgot" data-panel="forgot" |
| 236 |
data-header-title="<?php echo esc_attr__('Reset Password', 'yatra'); ?>" |
| 237 |
data-header-subtitle="<?php echo esc_attr__("Enter your email and we'll send you a link to reset your password.", 'yatra'); ?>" |
| 238 |
data-footer-text="<?php echo esc_attr__('Your request is secure and encrypted.', 'yatra'); ?>" |
| 239 |
role="region" aria-label="<?php esc_attr_e('Reset password', 'yatra'); ?>" style="display: none;" aria-hidden="true"> |
| 240 |
<form class="yatra-forgot-form" id="<?php echo esc_attr($form_id); ?>-forgot" method="post" action="" data-ajax="true" novalidate> |
| 241 |
<input type="hidden" name="yatra_login_nonce" value="<?php echo esc_attr($auth_action_nonce); ?>"> |
| 242 |
<div class="yatra-form-group"> |
| 243 |
<label for="<?php echo esc_attr($form_id); ?>-forgot-login" class="yatra-form-label"> |
| 244 |
<?php esc_html_e('Email or Username', 'yatra'); ?> |
| 245 |
</label> |
| 246 |
<input type="text" id="<?php echo esc_attr($form_id); ?>-forgot-login" name="user_login" class="yatra-form-input" required maxlength="100" autocomplete="username" placeholder="<?php esc_attr_e('Enter your email or username', 'yatra'); ?>"> |
| 247 |
</div> |
| 248 |
<div class="yatra-form-actions"> |
| 249 |
<button type="submit" class="yatra-btn yatra-btn-primary yatra-btn-full"> |
| 250 |
<span class="yatra-btn-text"><?php esc_html_e('Send Reset Link', 'yatra'); ?></span> |
| 251 |
<span class="yatra-btn-loading" style="display: none;"><?php esc_html_e('Sending...', 'yatra'); ?></span> |
| 252 |
</button> |
| 253 |
</div> |
| 254 |
</form> |
| 255 |
<div class="yatra-register-prompt"> |
| 256 |
<p> |
| 257 |
<a href="#" class="yatra-link yatra-auth-switch" data-target="login"> |
| 258 |
<?php esc_html_e('Back to login', 'yatra'); ?> |
| 259 |
</a> |
| 260 |
</p> |
| 261 |
</div> |
| 262 |
</div><?php // .yatra-auth-panel-forgot ?> |
| 263 |
<?php endif; ?> |
| 264 |
</div> |
| 265 |
|
| 266 |
<div class="yatra-login-footer"> |
| 267 |
<div class="yatra-login-security"> |
| 268 |
<div class="yatra-security-icon"> |
| 269 |
<?php echo yatra_svg_icon('shield', 'yatra-security-icon-svg'); ?> |
| 270 |
</div> |
| 271 |
<p class="yatra-security-text"> |
| 272 |
<?php esc_html_e('Your login information is secure and encrypted.', 'yatra'); ?> |
| 273 |
</p> |
| 274 |
</div> |
| 275 |
</div> |
| 276 |
</div> |
| 277 |
</div> |
| 278 |
|
