✨ Enhanced Template Selector: - Grouped templates by category with descriptions - Template preview modal with field data display - Apply template functionality with AJAX loading - Enhanced UI with preview icons and better UX ✨ Save as Template Functionality: - Complete save template dialog with validation - Template name, description, and category fields - Public/private template sharing options - AJAX integration with error handling and success feedback ✨ Progressive Disclosure: - Advanced options toggle with smooth animations - Fields marked as advanced (capacity, cost, timezone) - Local storage for user preference persistence - Staggered reveal animations for better UX ✨ Enhanced Auto-save: - Intelligent auto-save with field-type specific delays - Draft recovery with age information and user confirmation - Error handling with fallback to essential fields only - Visual feedback with status indicator and animations - Auto-save on page visibility change ✨ AJAX Infrastructure: - Template preview handler (hvac_get_template_preview) - Template loading handler (hvac_load_template_data) - Template saving handler (hvac_save_template) - Comprehensive error handling and security validation 🎨 UI/UX Enhancements: - Modern modal dialogs with backdrop overlays - Responsive design for mobile devices - Smooth animations and transitions - Status indicators with rotating save icons - Comprehensive styling for all new components 🚀 Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com>
15 KiB
AI-Assisted Event Submission Feature Specification
Executive Summary
This document specifies an AI-powered feature to reduce friction for HVAC trainers submitting events to a WordPress calendar system. The solution uses a single Anthropic Claude API call to parse unstructured event information and auto-populate form fields, dramatically simplifying the submission process for non-technical users.
Project Context
Current State
- Platform: WordPress site hosted on Cloudways
- Base Plugin: The Events Calendar (TEC) by Modern Tribe
- Custom Plugin: Existing custom plugin built on top of TEC for HVAC trainer event submissions
- User Base: HVAC trainers who are often not tech-savvy and have limited time
- Problem: High friction in manual form entry leading to incomplete or missing event submissions
Technical Constraints
- Hosting: Cloudways shared hosting environment
- Limited server-side processing capabilities
- No ability to install additional server software
- Standard PHP/MySQL stack
- HTTPS request capabilities
- Must maintain compatibility with The Events Calendar plugin data structures
- Cannot add additional WordPress plugins - solution must be implemented within existing custom plugin
Functional Requirements
Core Feature: AI-Assisted Event Form Population
User Flow
- User navigates to the create event page
- User sees an "Auto-populate with AI" button/option
- Upon clicking, a modal dialog appears with:
- Clear instructions for the user
- Single rich text input field
- Submit button
- User provides one of three input types:
- Option A: URL to a webpage containing event details
- Option B: Copy/pasted text from email/document
- Option C: Brief description with key details
- System processes input showing:
- Loading spinner
- Status messages during processing
- System populates form fields automatically
- System displays confidence/completeness matrix
- User reviews and adjusts populated fields before final submission
Input Acceptance Criteria
URL Input
- Accept any valid HTTP/HTTPS URL
- Handle various event page formats (EventBrite, custom sites, social media event pages)
- Extract information even from non-standard page structures
Pasted Text Input
- Accept unformatted text from emails, PDFs, documents
- Handle various formatting styles and structures
- Parse information regardless of order or format
Brief Description Input
- Accept natural language descriptions
- Extract partial information when complete details aren't provided
- Make intelligent assumptions about missing data
Output Requirements
Required Fields to Extract
- Event title
- Date and time
- Location/venue
- Description
- Organizer
- Cost/pricing
- Registration URL (if available)
Data Validation Requirements
- Check against existing venues to avoid duplicates
- Check against existing organizers to avoid duplicates
- Validate date/time formats
- Ensure required fields are populated
Confidence Reporting Display a matrix showing:
- Completeness: Whether each field was found (High/Medium/Low/N/A)
- Confidence: How confident the AI is in the extracted data (0.0-1.0)
Technical Architecture
Simplified Single-API Approach
Architecture Decision
Use a single Anthropic Claude API call with web search capabilities enabled, eliminating the need for:
- Separate web scraping services
- Multiple NLP processing steps
- Complex orchestration logic
- Background job processing
- Additional server infrastructure
Key Components
-
Frontend (JavaScript)
- Modal interface for input collection
- AJAX communication with WordPress backend
- Form field population logic
- Confidence matrix display
-
Backend (PHP/WordPress)
- Single AJAX endpoint for AI processing
- API key management
- Request/response handling
- Data sanitization and validation
-
External Service
- Anthropic Claude API (claude-3-5-sonnet-20241022 or latest)
- Web search/browsing capabilities enabled
Implementation Patterns
Pattern 1: Stateless Request Processing
- Do: Make each request completely self-contained
- Do: Include all context needed in single prompt
- Do: Return complete results in one response
- Don't: Maintain conversation state between requests
- Don't: Make multiple API calls for single submission
Pattern 2: Defensive Data Handling
// Always validate and sanitize
$user_input = sanitize_textarea_field($_POST['input'] ?? '');
if (empty($user_input)) {
wp_send_json_error(['message' => 'No input provided']);
wp_die();
}
Pattern 3: Structured Output Enforcement
- Do: Request JSON output explicitly in prompt
- Do: Provide exact schema in prompt
- Do: Include example of expected output
- Don't: Parse free-text responses
- Don't: Rely on consistent formatting without schema
Pattern 4: Graceful Degradation
- Do: Provide fallback for API failures
- Do: Allow manual form filling if AI fails
- Do: Cache successful extractions
- Don't: Block user progress on AI failure
- Don't: Require AI for form submission
Anti-Patterns to Avoid
Anti-Pattern 1: Client-Side API Keys
Never expose API keys in JavaScript or make direct API calls from browser
Anti-Pattern 2: Synchronous Long-Running Requests
Avoid blocking UI during API calls; always use async patterns with loading states
Anti-Pattern 3: Over-Engineering
Don't build complex parsing systems when Claude can handle it in one call
Anti-Pattern 4: Rigid Field Matching
Don't require exact field matches; use fuzzy matching for venues/organizers
Prompt Engineering Strategy
Core Prompt Structure
You are an AI assistant specialized in extracting event information from various sources.
Your task is to extract structured event data for an HVAC training calendar.
[CONTEXT]
- These are professional training events for HVAC technicians
- Events may be in-person or virtual
- Common organizers include: {list_of_existing_organizers}
- Common venues include: {list_of_existing_venues}
[INPUT]
{user_provides_one_of_these}
- URL: Please retrieve and analyze the webpage at: {url}
- Text: Parse the following event information: {pasted_text}
- Description: Extract event details from: {brief_description}
[EXTRACTION RULES]
1. Match venues/organizers to existing ones when similarity > 80%
2. Infer missing information when reasonable (mark as low confidence)
3. Handle relative dates (convert "next Tuesday" to actual date)
4. Extract all URLs found in source material
5. Standardize time to 24-hour format
6. If multiple events found, extract only the first/primary one
[OUTPUT SCHEMA]
Return ONLY a valid JSON object with this exact structure:
{json_schema_here}
[IMPORTANT]
- Return ONLY the JSON object, no explanatory text
- Use null for missing fields rather than empty strings
- Include confidence scores for each field
Prompt Optimization Techniques
1. Few-Shot Examples
Include 2-3 examples of successful extractions in the system prompt to improve consistency.
2. Role Definition
Clearly define Claude's role as an "event information extraction specialist" to improve focus.
3. Explicit Constraints
- Specify exact date format (ISO 8601)
- Define confidence score ranges (0.0-1.0)
- List acceptable values for enums
4. Context Injection
Always include:
- Current date/time for relative date resolution
- List of existing venues/organizers
- Common patterns in your specific domain
Handling Edge Cases
Edge Case 1: Multiple Events
Strategy: Extract only the first/most prominent event Prompt Addition: "If multiple events are found, extract only the primary/first event"
Edge Case 2: Ambiguous Dates
Strategy: Request current date context
Implementation: Always include Today is {current_date} in prompt
Edge Case 3: Missing Critical Information
Strategy: Return partial data with low confidence Validation: Check for minimum required fields before population
Input/Output Validation
Input Validation Strategy
Pre-Processing Validation
function validateInput(input) {
// Check for minimum length
if (input.length < 10) {
return { valid: false, error: 'Input too short' };
}
// Detect input type
const type = detectInputType(input);
// URL validation
if (type === 'url') {
try {
new URL(input);
} catch {
return { valid: false, error: 'Invalid URL format' };
}
}
// Size limits (prevent token overflow)
if (input.length > 50000) {
return { valid: false, error: 'Input too large' };
}
return { valid: true, type };
}
Input Sanitization
- Strip potentially harmful HTML/scripts
- Normalize whitespace and line breaks
- Remove non-printable characters
- Truncate to maximum acceptable length
Output Validation Strategy
Schema Validation
function validate_ai_response($response) {
$required_fields = ['title', 'date'];
$schema = [
'title' => 'string',
'date' => 'date',
'venue' => 'string|null',
'confidence' => 'array',
'completeness' => 'array'
];
// Check JSON structure
if (!is_array($response)) {
throw new ValidationException('Invalid JSON response');
}
// Validate required fields
foreach ($required_fields as $field) {
if (empty($response[$field])) {
throw new ValidationException("Missing required field: {$field}");
}
}
// Type checking and sanitization
// ... implementation details
return $sanitized_response;
}
Confidence Threshold Handling
- High Confidence (>0.8): Auto-populate without warning
- Medium Confidence (0.5-0.8): Populate with visual indicator
- Low Confidence (<0.5): Populate but highlight for review
- No Confidence (null): Leave field empty
Duplicate Detection
function check_duplicate_event($event_data) {
// Check for same date + similar title
$similar_events = get_posts([
'post_type' => 'tribe_events',
'meta_key' => '_EventStartDate',
'meta_value' => $event_data['date'],
'meta_compare' => '='
]);
foreach ($similar_events as $existing) {
$similarity = similar_text(
strtolower($existing->post_title),
strtolower($event_data['title']),
$percent
);
if ($percent > 75) {
return [
'is_duplicate' => true,
'existing_id' => $existing->ID,
'similarity' => $percent
];
}
}
return ['is_duplicate' => false];
}
Error Handling and Recovery
API Error Handling
Rate Limiting
- Implement exponential backoff
- Cache successful responses for 24 hours
- Show user-friendly message when limit reached
Network Failures
- Timeout after 30 seconds
- Provide option to retry
- Fall back to manual entry
Invalid Responses
- Log malformed responses for debugging
- Show generic error to user
- Provide option to try different input
User Communication
Status Messages
- "Analyzing your input..." (0-2 seconds)
- "Extracting event information..." (2-10 seconds)
- "Validating extracted data..." (10-15 seconds)
- "Populating form fields..." (15+ seconds)
Error Messages
- Be specific but not technical
- Provide actionable next steps
- Never expose internal errors or API keys
Security Considerations
API Key Management
- Store in wp-config.php or environment variables
- Never commit to version control
- Rotate keys periodically
- Use WordPress nonce for AJAX calls
Input Security
- Sanitize all user inputs
- Prevent SQL injection via parameterized queries
- Escape output when displaying
- Limit request frequency per user
Data Privacy
- Don't log sensitive event information
- Clear temporary data after processing
- Comply with GDPR/privacy requirements
- Allow users to opt-out of AI features
Performance Optimization
Caching Strategy
- Cache AI responses for identical inputs (24-hour TTL)
- Cache venue/organizer lists (1-hour TTL)
- Use WordPress transients for temporary data
Request Optimization
- Minimize prompt size while maintaining clarity
- Pre-process input to remove redundant information
- Batch similar requests when possible
Frontend Optimization
- Lazy-load AI modal components
- Debounce input validation
- Use optimistic UI updates
Testing Strategy
Test Scenarios
- URL Input: Test with EventBrite, Facebook Events, custom sites
- Text Input: Test with various email formats, PDF copies
- Description Input: Test with minimal and detailed descriptions
- Edge Cases: Test with non-English content, past events, recurring events
- Failure Cases: Test with invalid URLs, gibberish input, timeout scenarios
Validation Testing
- Ensure all required fields are validated
- Test confidence score accuracy
- Verify duplicate detection works correctly
- Test venue/organizer matching logic
Implementation Checklist
Phase 1: Core Infrastructure
- Set up Anthropic API integration
- Create WordPress AJAX endpoint
- Implement basic input validation
- Build JSON response parser
Phase 2: UI Implementation
- Create modal interface
- Implement form field population
- Add loading states and progress indicators
- Build confidence matrix display
Phase 3: Data Processing
- Implement venue/organizer matching
- Add duplicate detection
- Create validation pipeline
- Add error handling and recovery
Phase 4: Optimization
- Implement caching layer
- Add request rate limiting
- Optimize prompt for accuracy
- Performance testing and tuning
Phase 5: Polish and Testing
- Comprehensive error messages
- User documentation
- Edge case handling
- Security audit
Success Metrics
Technical Metrics
- API response time < 10 seconds (95th percentile)
- Extraction accuracy > 85% for standard inputs
- Zero security vulnerabilities
- 99.9% uptime for feature availability
User Metrics
- 50% reduction in time to submit events
- 75% of submissions use AI assistance
- < 5% error rate requiring manual intervention
- User satisfaction score > 4/5
Appendix: The Events Calendar Integration
Relevant Post Types
tribe_events- Main event post typetribe_venue- Venue post typetribe_organizer- Organizer post type
Key Meta Fields
_EventStartDate- Event start date/time_EventEndDate- Event end date/time_EventVenueID- Reference to venue post_EventOrganizerID- Reference to organizer post_EventCost- Event cost_EventURL- Registration/info URL
Integration Points
- Use TEC's built-in functions when available
- Respect TEC's data validation rules
- Maintain compatibility with TEC updates
- Leverage TEC's duplicate detection if available