ben
5c15b27935
Add venue taxonomies and filter /find-training to show only approved labs: - Create venue_type, venue_equipment, venue_amenities taxonomies - Filter venue markers by mq-approved-lab taxonomy term - Add equipment and amenities badges to venue modal - Add venue contact form with AJAX handler and email notification - Include POC (Point of Contact) meta for each training lab 9 approved training labs configured: - Fast Track Learning Lab, Progressive Training Lab, NAVAC Technical Training Center - Stevens Equipment Phoenix/Johnstown, San Jacinto College, Johnstone Supply - TruTech Tools Training Center (new), Auer Steel & Heating Supply (new) Note: Venues not displaying on map - to be debugged next session. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
305 lines
14 KiB
PHP
305 lines
14 KiB
PHP
<?php
|
|
/**
|
|
* Template Name: Find Training
|
|
*
|
|
* Google Maps-style full-screen layout with left sidebar panel
|
|
* for trainer directory and compact filter toolbar.
|
|
*
|
|
* @package HVAC_Community_Events
|
|
* @since 2.2.0
|
|
*/
|
|
|
|
defined('ABSPATH') || exit;
|
|
define('HVAC_IN_PAGE_TEMPLATE', true);
|
|
|
|
get_header();
|
|
|
|
// Get page handler instance
|
|
$find_training = HVAC_Find_Training_Page::get_instance();
|
|
$filter_options = $find_training->get_filter_options();
|
|
$api_key_configured = $find_training->is_api_key_configured();
|
|
?>
|
|
|
|
<div class="hvac-find-training-page">
|
|
<!-- Skip link for accessibility -->
|
|
<a href="#hvac-trainer-grid" class="hvac-skip-link">Skip to trainer results</a>
|
|
|
|
<!-- Compact Filter Bar -->
|
|
<div class="hvac-filter-bar" role="search" aria-label="Filter trainers and venues">
|
|
<div class="hvac-filter-bar-inner">
|
|
<!-- Search -->
|
|
<div class="hvac-filter-item hvac-filter-search">
|
|
<span class="dashicons dashicons-search" aria-hidden="true"></span>
|
|
<input type="text" id="hvac-training-search" placeholder="Search trainers..." aria-label="Search trainers">
|
|
</div>
|
|
|
|
<!-- Filter Dropdowns (hidden on mobile, shown in panel) -->
|
|
<div class="hvac-filter-dropdowns">
|
|
<select id="hvac-filter-state" class="hvac-filter-select" aria-label="Filter by state">
|
|
<option value="">All States</option>
|
|
<?php foreach ($filter_options['states'] as $state): ?>
|
|
<option value="<?php echo esc_attr($state); ?>"><?php echo esc_html($state); ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
|
|
<select id="hvac-filter-certification" class="hvac-filter-select" aria-label="Filter by certification">
|
|
<option value="">All Certifications</option>
|
|
<?php foreach ($filter_options['certifications'] as $cert): ?>
|
|
<option value="<?php echo esc_attr($cert); ?>"><?php echo esc_html($cert); ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
|
|
<select id="hvac-filter-format" class="hvac-filter-select" aria-label="Filter by training format">
|
|
<option value="">All Formats</option>
|
|
<?php foreach ($filter_options['training_formats'] as $format): ?>
|
|
<option value="<?php echo esc_attr($format); ?>"><?php echo esc_html($format); ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
|
|
<!-- Near Me Button -->
|
|
<button type="button" id="hvac-near-me-btn" class="hvac-near-me-btn">
|
|
<span class="dashicons dashicons-location-alt" aria-hidden="true"></span>
|
|
<span class="hvac-btn-text">Near Me</span>
|
|
</button>
|
|
|
|
<!-- Clear Filters -->
|
|
<button type="button" class="hvac-clear-filters" style="display: none;">
|
|
Clear
|
|
</button>
|
|
|
|
<!-- Mobile Filter Toggle -->
|
|
<button type="button"
|
|
class="hvac-mobile-filter-toggle"
|
|
aria-expanded="false"
|
|
aria-controls="hvac-mobile-filter-panel">
|
|
<span class="dashicons dashicons-filter" aria-hidden="true"></span>
|
|
<span class="hvac-btn-text">Filters</span>
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Active Filters Chips -->
|
|
<div class="hvac-active-filters" aria-live="polite"></div>
|
|
|
|
<!-- Mobile Filter Panel (hidden by default) -->
|
|
<div id="hvac-mobile-filter-panel" class="hvac-mobile-filter-panel" hidden>
|
|
<div class="hvac-mobile-filter-group">
|
|
<label for="hvac-filter-state-mobile">State / Province</label>
|
|
<select id="hvac-filter-state-mobile" class="hvac-filter-select" aria-label="Filter by state">
|
|
<option value="">All States</option>
|
|
<?php foreach ($filter_options['states'] as $state): ?>
|
|
<option value="<?php echo esc_attr($state); ?>"><?php echo esc_html($state); ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
<div class="hvac-mobile-filter-group">
|
|
<label for="hvac-filter-certification-mobile">Certification</label>
|
|
<select id="hvac-filter-certification-mobile" class="hvac-filter-select" aria-label="Filter by certification">
|
|
<option value="">All Certifications</option>
|
|
<?php foreach ($filter_options['certifications'] as $cert): ?>
|
|
<option value="<?php echo esc_attr($cert); ?>"><?php echo esc_html($cert); ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
<div class="hvac-mobile-filter-group">
|
|
<label for="hvac-filter-format-mobile">Training Format</label>
|
|
<select id="hvac-filter-format-mobile" class="hvac-filter-select" aria-label="Filter by training format">
|
|
<option value="">All Formats</option>
|
|
<?php foreach ($filter_options['training_formats'] as $format): ?>
|
|
<option value="<?php echo esc_attr($format); ?>"><?php echo esc_html($format); ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Main Content: Sidebar + Map -->
|
|
<div class="hvac-map-layout">
|
|
<!-- Left Sidebar -->
|
|
<aside class="hvac-sidebar" role="region" aria-label="Trainer directory">
|
|
<div class="hvac-sidebar-header">
|
|
<span class="hvac-results-summary" aria-live="polite">
|
|
<span id="hvac-trainer-count">0</span> trainers
|
|
</span>
|
|
<!-- Mobile collapse toggle -->
|
|
<button type="button"
|
|
class="hvac-sidebar-toggle"
|
|
aria-expanded="true"
|
|
aria-controls="hvac-sidebar-content"
|
|
aria-label="Toggle trainer list">
|
|
<span class="dashicons dashicons-arrow-down-alt2" aria-hidden="true"></span>
|
|
</button>
|
|
</div>
|
|
|
|
<div id="hvac-sidebar-content" class="hvac-sidebar-content">
|
|
<!-- Trainer List (scrollable) -->
|
|
<div id="hvac-trainer-grid" class="hvac-trainer-list">
|
|
<div class="hvac-grid-loading">
|
|
<span class="dashicons dashicons-update-alt hvac-spin" aria-hidden="true"></span>
|
|
Loading trainers...
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Load More Button -->
|
|
<div class="hvac-load-more-wrapper" style="display: none;">
|
|
<button type="button" id="hvac-load-more" class="hvac-btn-secondary">
|
|
Load More
|
|
</button>
|
|
</div>
|
|
|
|
<!-- CTA -->
|
|
<div class="hvac-sidebar-cta">
|
|
<p>Want to be listed in our directory?</p>
|
|
<a href="<?php echo esc_url(site_url('/trainer/registration/')); ?>" class="hvac-btn-primary hvac-btn-small">
|
|
Become A Trainer
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<!-- Map Container -->
|
|
<div class="hvac-map-container" role="region" aria-label="Training locations map">
|
|
<div id="hvac-training-map" class="hvac-google-map">
|
|
<?php if (!$api_key_configured): ?>
|
|
<div class="hvac-map-error">
|
|
<span class="dashicons dashicons-warning" aria-hidden="true"></span>
|
|
<p><strong>Map Configuration Required</strong></p>
|
|
<p>The Google Maps API key is not configured. <?php if (current_user_can('manage_options')): ?>Please configure it in <a href="<?php echo admin_url('admin.php?page=hvac-trainer-profile-settings'); ?>">Trainer Profile Settings</a>.<?php else: ?>Please contact the site administrator.<?php endif; ?></p>
|
|
</div>
|
|
<?php else: ?>
|
|
<div class="hvac-map-loading">
|
|
<span class="dashicons dashicons-location" aria-hidden="true"></span>
|
|
<p>Loading map...</p>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
<!-- Map Legend Overlay -->
|
|
<div class="hvac-map-legend">
|
|
<div class="hvac-legend-item">
|
|
<span class="hvac-legend-marker hvac-legend-trainer" aria-hidden="true"></span>
|
|
<span>Trainer</span>
|
|
</div>
|
|
<div class="hvac-legend-item">
|
|
<span class="hvac-legend-marker hvac-legend-venue" aria-hidden="true"></span>
|
|
<span>Venue</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Map Toggles Overlay -->
|
|
<div class="hvac-map-toggles">
|
|
<label class="hvac-toggle-compact">
|
|
<input type="checkbox" id="hvac-show-trainers" checked>
|
|
<span class="hvac-toggle-label">Trainers</span>
|
|
</label>
|
|
<label class="hvac-toggle-compact">
|
|
<input type="checkbox" id="hvac-show-venues" checked>
|
|
<span class="hvac-toggle-label">Venues</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Trainer Profile Modal -->
|
|
<div id="hvac-trainer-modal" class="hvac-training-modal" style="display: none;" role="dialog" aria-modal="true" aria-labelledby="trainer-modal-title">
|
|
<div class="hvac-modal-overlay"></div>
|
|
<div class="hvac-modal-content">
|
|
<div class="hvac-modal-loading">
|
|
<span class="dashicons dashicons-update-alt hvac-spin" aria-hidden="true"></span>
|
|
Loading...
|
|
</div>
|
|
<div class="hvac-modal-body"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Venue Info Modal -->
|
|
<div id="hvac-venue-modal" class="hvac-training-modal" style="display: none;" role="dialog" aria-modal="true" aria-labelledby="venue-modal-title">
|
|
<div class="hvac-modal-overlay"></div>
|
|
<div class="hvac-modal-content hvac-venue-modal-content">
|
|
<div class="hvac-venue-modal-header">
|
|
<h2 id="venue-modal-title"></h2>
|
|
<button class="hvac-modal-close" aria-label="Close modal">×</button>
|
|
</div>
|
|
<div class="hvac-venue-modal-body">
|
|
<p class="hvac-venue-address"></p>
|
|
<p class="hvac-venue-phone"></p>
|
|
<p class="hvac-venue-capacity"></p>
|
|
|
|
<div class="hvac-venue-description"></div>
|
|
|
|
<!-- Equipment Badges -->
|
|
<div class="hvac-venue-equipment" style="display: none;">
|
|
<h4>Equipment</h4>
|
|
<div class="hvac-badge-list hvac-equipment-badges"></div>
|
|
</div>
|
|
|
|
<!-- Amenities Badges -->
|
|
<div class="hvac-venue-amenities" style="display: none;">
|
|
<h4>Amenities</h4>
|
|
<div class="hvac-badge-list hvac-amenities-badges"></div>
|
|
</div>
|
|
|
|
<!-- Upcoming Events -->
|
|
<div class="hvac-venue-events">
|
|
<h4>Upcoming Events</h4>
|
|
<ul class="hvac-venue-events-list"></ul>
|
|
<p class="hvac-venue-no-events" style="display: none;">No upcoming events scheduled.</p>
|
|
</div>
|
|
|
|
<!-- Actions -->
|
|
<div class="hvac-venue-actions">
|
|
<a href="#" class="hvac-venue-directions hvac-btn-secondary" target="_blank" rel="noopener">
|
|
<span class="dashicons dashicons-location" aria-hidden="true"></span>
|
|
Get Directions
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Contact Form -->
|
|
<div class="hvac-venue-contact-section">
|
|
<h4>Contact This Training Lab</h4>
|
|
<form class="hvac-venue-contact-form" data-venue-id="">
|
|
<div class="hvac-form-row">
|
|
<div class="hvac-form-group">
|
|
<label for="venue-contact-first-name">First Name <span class="required">*</span></label>
|
|
<input type="text" id="venue-contact-first-name" name="first_name" required>
|
|
</div>
|
|
<div class="hvac-form-group">
|
|
<label for="venue-contact-last-name">Last Name <span class="required">*</span></label>
|
|
<input type="text" id="venue-contact-last-name" name="last_name" required>
|
|
</div>
|
|
</div>
|
|
<div class="hvac-form-row">
|
|
<div class="hvac-form-group">
|
|
<label for="venue-contact-email">Email <span class="required">*</span></label>
|
|
<input type="email" id="venue-contact-email" name="email" required>
|
|
</div>
|
|
<div class="hvac-form-group">
|
|
<label for="venue-contact-phone">Phone</label>
|
|
<input type="tel" id="venue-contact-phone" name="phone">
|
|
</div>
|
|
</div>
|
|
<div class="hvac-form-group">
|
|
<label for="venue-contact-company">Company</label>
|
|
<input type="text" id="venue-contact-company" name="company">
|
|
</div>
|
|
<div class="hvac-form-group">
|
|
<label for="venue-contact-message">Message</label>
|
|
<textarea id="venue-contact-message" name="message" rows="4" placeholder="Tell us about your training needs..."></textarea>
|
|
</div>
|
|
<button type="submit" class="hvac-btn-primary">Send Message</button>
|
|
</form>
|
|
<div class="hvac-form-success" style="display: none;">
|
|
<span class="dashicons dashicons-yes-alt" aria-hidden="true"></span>
|
|
<p>Your message has been sent! The training lab will be in touch soon.</p>
|
|
</div>
|
|
<div class="hvac-form-error" style="display: none;">
|
|
<span class="dashicons dashicons-warning" aria-hidden="true"></span>
|
|
<p>There was a problem sending your message. Please try again.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<?php get_footer(); ?>
|