# Application Form Setup Instructions

## Overview
The application form sends emails to `admin@rasinkhu.co.za` using EmailJS, includes Google reCAPTCHA v2 verification, and prevents duplicate submissions per user.

## Setup Steps

### 1. EmailJS Setup (Required for Form Submission)

Email functionality requires EmailJS - a service that sends emails directly from your website without a backend server.

#### Step 1: Create EmailJS Account
1. Go to https://www.emailjs.com/
2. Click "Sign Up" and create a free account
3. Verify your email

#### Step 2: Set Up Email Service
1. In EmailJS dashboard, go to **Email Services**
2. Click **Add Service**
3. Choose your email provider:
   - **Gmail**: Requires an App Password (2FA must be enabled)
   - **Outlook**: Standard email setup
   - **Other**: Configure SMTP details
4. Follow the provider-specific setup
5. Copy your **Service ID** (e.g., `service_xxxxx`)

#### Step 3: Create Email Template
1. Go to **Email Templates** in EmailJS dashboard
2. Click **Create New Template**
3. Configure the template with these variables (template will receive these):
   - `to_email` - Admin email
   - `from_name` - Student's full name
   - `from_email` - Student's email
   - `student_name` - First name
   - `surname` - Last name
   - `contact_number` - Phone number
   - `email` - Email address
   - `certificates` - Selected certificates (comma-separated)
   - `seta` - SETA organization name
   - `submission_date` - Date and time of submission

Example template HTML:
```html
<h2>New Course Application</h2>
<p><strong>Date:</strong> {{submission_date}}</p>
<p><strong>SETA Organization:</strong> {{seta}}</p>

<h3>Student Information</h3>
<ul>
  <li><strong>Name:</strong> {{student_name}} {{surname}}</li>
  <li><strong>Email:</strong> {{email}}</li>
  <li><strong>Phone:</strong> {{contact_number}}</li>
</ul>

<h3>Certificates Applied For</h3>
<p>{{certificates}}</p>
```

4. Copy your **Template ID** (e.g., `template_xxxxx`)

#### Step 4: Get Public Key
1. Go to **Account** settings in EmailJS
2. Copy your **Public Key** (e.g., `xxxxxxxxxxxxx`)

#### Step 5: Update custom.js
1. Open `js/custom.js`
2. Find these lines (around line 430):
   ```javascript
   emailjs.init('SERVICE_ID'); // Replace with your EmailJS service ID
   ```
   Replace with:
   ```javascript
   emailjs.init('YOUR_PUBLIC_KEY');
   ```

3. Find these lines (around line 480):
   ```javascript
   emailjs.send('SERVICE_ID', 'TEMPLATE_ID', {
   ```
   Replace with:
   ```javascript
   emailjs.send('YOUR_SERVICE_ID', 'YOUR_TEMPLATE_ID', {
   ```

### 2. Google reCAPTCHA Setup (Optional but Recommended)

The form includes Google reCAPTCHA v2 (checkbox type) to prevent spam.

#### Get reCAPTCHA Keys
1. Go to https://www.google.com/recaptcha/admin
2. Sign in with your Google account
3. Click **+** to create a new site
4. Configure:
   - **Label**: Rasinkhu Course Application
   - **reCAPTCHA type**: reCAPTCHA v2 (I'm not a robot)
   - **Domains**: your-website-domain.com
5. Copy your **Site Key**

#### Update services.html
1. Open `services.html`
2. Find this line (around line 545):
   ```html
   <div class="g-recaptcha" data-sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI"></div>
   ```
3. Replace `data-sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI"` with your actual Site Key:
   ```html
   <div class="g-recaptcha" data-sitekey="YOUR_SITE_KEY"></div>
   ```

### 3. Security Notes

- **Email Verification**: Students can only submit ONE application per email address
- **Submission Storage**: Previous email addresses are stored in browser's localStorage
- **reCAPTCHA**: Protects against automated spam submissions
- **Data Not Stored Server-Side**: Form data is only sent to admin@rasinkhu.co.za email

### 4. Testing the Form

1. Open your website
2. Go to Services page
3. Click on any SETA tab (e.g., Service Seta)
4. Click the "Apply" button
5. Fill in the form with test data
6. Verify the reCAPTCHA
7. Click "Submit Application"
8. You should receive an email at admin@rasinkhu.co.za within seconds

### 5. EmailJS Pricing

- **Free Plan**: Up to 200 emails/month
- **Paid Plans**: From $15/month for more emails

For a course applications site, the free plan should be sufficient.

## Troubleshooting

### Emails Not Received
- Check spam/junk folder
- Verify Service ID and Template ID are correct in custom.js
- Check EmailJS dashboard for errors
- Ensure email address in HTML form matches your admin email

### reCAPTCHA Not Showing
- Verify your Site Key is correct
- Check browser console for errors
- Ensure Google's reCAPTCHA script is loading

### "One Submission Per User" Not Working
- This uses browser localStorage
- Users can clear browser data to reset (by design)
- To fully prevent duplicates, a backend database is needed

## Support

For EmailJS issues: https://www.emailjs.com/docs/
For reCAPTCHA issues: https://www.google.com/recaptcha/admin/

