the beginning of the idiots
This commit is contained in:
206
qwen/go/templates/index.html
Normal file
206
qwen/go/templates/index.html
Normal file
@@ -0,0 +1,206 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>MerchantsOfHope.org - Connecting Talents with Opportunities</title>
|
||||
<meta name="description" content="A multi-tenant recruiting platform for TSYS Group's various business lines">
|
||||
|
||||
<!-- Accessibility features -->
|
||||
<meta name="theme-color" content="#2c3e50">
|
||||
|
||||
<link rel="stylesheet" href="/static/css/accessibility.css">
|
||||
</head>
|
||||
<body>
|
||||
<a href="#main" class="skip-link">Skip to main content</a>
|
||||
|
||||
<header>
|
||||
<div class="container">
|
||||
<h1>MerchantsOfHope.org</h1>
|
||||
<p>Connecting talents with opportunities across TSYS Group</p>
|
||||
|
||||
<nav aria-label="Main navigation">
|
||||
<ul>
|
||||
<li><a href="/">Home</a></li>
|
||||
<li><a href="/positions">Browse Positions</a></li>
|
||||
<li><a href="/apply">Apply</a></li>
|
||||
<li><a href="/login">Login</a></li>
|
||||
<li><a href="/register">Register</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="main">
|
||||
<div class="container">
|
||||
<section class="hero">
|
||||
<div class="card">
|
||||
<h2>Welcome to MerchantsOfHope.org</h2>
|
||||
<p>Our platform connects talented professionals with opportunities across TSYS Group's diverse business lines. Whether you're looking for your next career opportunity or seeking the perfect candidate, we provide a seamless, accessible experience for all users.</p>
|
||||
|
||||
<div class="actions">
|
||||
<a href="/positions" class="btn btn-primary">Browse Job Positions</a>
|
||||
<a href="/register" class="btn">Register as Job Seeker</a>
|
||||
<a href="/register?role=provider" class="btn">Register as Job Provider</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="features">
|
||||
<h2>Platform Features</h2>
|
||||
|
||||
<div class="card">
|
||||
<h3>Multi-Tenant Architecture</h3>
|
||||
<p>Each of TSYS Group's business lines operates as an independent tenant with complete data isolation, ensuring privacy and security across all operations.</p>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<h3>Universal Access</h3>
|
||||
<p>Our platform is designed with accessibility in mind, following WCAG 2.1 AA standards to ensure everyone can participate regardless of ability.</p>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<h3>Secure Authentication</h3>
|
||||
<p>Log in using your preferred method - local credentials, OIDC, or social media accounts - with enterprise-grade security measures in place.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="positions-preview">
|
||||
<h2>Featured Positions</h2>
|
||||
<div class="card">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Title</th>
|
||||
<th>Location</th>
|
||||
<th>Type</th>
|
||||
<th>Posted</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="positions-table-body">
|
||||
<tr>
|
||||
<td colspan="5">Loading positions...</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<a href="/positions" class="btn">View All Positions</a>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© 2025 MerchantsOfHope.org - A TSYS Group Initiative</p>
|
||||
<p>Committed to accessibility, security, and excellence</p>
|
||||
<p>
|
||||
<a href="/accessibility" style="color: white; margin: 0 10px;">Accessibility Statement</a> |
|
||||
<a href="/privacy" style="color: white; margin: 0 10px;">Privacy Policy</a> |
|
||||
<a href="/terms" style="color: white; margin: 0 10px;">Terms of Service</a>
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
// Accessible JavaScript functionality
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Load featured positions
|
||||
loadFeaturedPositions();
|
||||
|
||||
// Set proper focus management
|
||||
const mainContent = document.getElementById('main');
|
||||
mainContent.setAttribute('tabindex', '-1');
|
||||
|
||||
// Focus main content when page loads
|
||||
mainContent.focus();
|
||||
|
||||
// Form validation
|
||||
const forms = document.querySelectorAll('form');
|
||||
forms.forEach(form => {
|
||||
form.addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
// Basic validation
|
||||
let isValid = true;
|
||||
const requiredFields = form.querySelectorAll('[required]');
|
||||
|
||||
requiredFields.forEach(field => {
|
||||
if (!field.value.trim()) {
|
||||
isValid = false;
|
||||
field.classList.add('error');
|
||||
|
||||
// Create error message
|
||||
const error = document.createElement('div');
|
||||
error.className = 'alert alert-error';
|
||||
error.textContent = `${field.name || 'This field'} is required`;
|
||||
error.setAttribute('role', 'alert');
|
||||
|
||||
// Add to proper location
|
||||
field.parentNode.insertBefore(error, field.nextSibling);
|
||||
} else {
|
||||
field.classList.remove('error');
|
||||
|
||||
// Remove any existing error messages
|
||||
const existingErrors = field.parentNode.querySelectorAll('.alert-error');
|
||||
existingErrors.forEach(err => err.remove());
|
||||
}
|
||||
});
|
||||
|
||||
if (isValid) {
|
||||
// In a real app, you would submit the form here
|
||||
alert('Form submitted successfully! (Demo)');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Ensure all interactive elements have proper focus management
|
||||
const interactiveElements = document.querySelectorAll('a, button, input, select, textarea');
|
||||
interactiveElements.forEach(el => {
|
||||
el.addEventListener('focus', function() {
|
||||
this.style.outline = '2px solid var(--secondary-color)';
|
||||
this.style.outlineOffset = '2px';
|
||||
});
|
||||
|
||||
el.addEventListener('blur', function() {
|
||||
this.style.outline = '';
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function loadFeaturedPositions() {
|
||||
// In a real app, this would fetch from the API
|
||||
// For demo, we'll use sample data
|
||||
const positions = [
|
||||
{ title: "Senior Software Engineer", location: "Remote", type: "Full-time", posted: "2025-01-15" },
|
||||
{ title: "DevOps Specialist", location: "Atlanta, GA", type: "Contract", posted: "2025-01-10" },
|
||||
{ title: "Product Manager", location: "Remote", type: "Full-time", posted: "2025-01-05" },
|
||||
{ title: "UX/UI Designer", location: "New York, NY", type: "Full-time", posted: "2025-01-01" }
|
||||
];
|
||||
|
||||
const tbody = document.getElementById('positions-table-body');
|
||||
tbody.innerHTML = '';
|
||||
|
||||
positions.forEach(position => {
|
||||
const row = document.createElement('tr');
|
||||
|
||||
row.innerHTML = `
|
||||
<td>${position.title}</td>
|
||||
<td>${position.location}</td>
|
||||
<td>${position.type}</td>
|
||||
<td>${position.posted}</td>
|
||||
<td>
|
||||
<button class="btn" onclick="viewPosition('${position.title}')">View Details</button>
|
||||
</td>
|
||||
`;
|
||||
|
||||
tbody.appendChild(row);
|
||||
});
|
||||
}
|
||||
|
||||
function viewPosition(title) {
|
||||
alert(`Viewing position: ${title}\n\nIn a real application, this would take you to the detailed position page.`);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
156
qwen/go/templates/login.html
Normal file
156
qwen/go/templates/login.html
Normal file
@@ -0,0 +1,156 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Login - MerchantsOfHope.org</title>
|
||||
<meta name="description" content="Login to your MerchantsOfHope.org account">
|
||||
|
||||
<link rel="stylesheet" href="/static/css/accessibility.css">
|
||||
</head>
|
||||
<body>
|
||||
<a href="#main" class="skip-link">Skip to main content</a>
|
||||
|
||||
<header>
|
||||
<div class="container">
|
||||
<h1>MerchantsOfHope.org</h1>
|
||||
<p>Login to Your Account</p>
|
||||
|
||||
<nav aria-label="Main navigation">
|
||||
<ul>
|
||||
<li><a href="/">Home</a></li>
|
||||
<li><a href="/positions">Browse Positions</a></li>
|
||||
<li><a href="/apply">Apply</a></li>
|
||||
<li><a href="/login">Login</a></li>
|
||||
<li><a href="/register">Register</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="main">
|
||||
<div class="container">
|
||||
<h1>Login</h1>
|
||||
|
||||
<form id="login-form">
|
||||
<div class="form-group">
|
||||
<label for="email">Email Address</label>
|
||||
<input type="email" id="email" name="email" required aria-describedby="email-help">
|
||||
<div id="email-help" class="form-hint">Enter your registered email address</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="password">Password</label>
|
||||
<input type="password" id="password" name="password" required aria-describedby="password-help">
|
||||
<div id="password-help" class="form-hint">Enter your password</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary">Login</button>
|
||||
</form>
|
||||
|
||||
<div class="divider">
|
||||
<span>Or continue with</span>
|
||||
</div>
|
||||
|
||||
<div class="social-login">
|
||||
<button class="social-btn" onclick="socialLogin('oidc')" aria-label="Login with enterprise SSO">
|
||||
<span>🏢</span> <span>Enterprise SSO (OIDC)</span>
|
||||
</button>
|
||||
<button class="social-btn" onclick="socialLogin('google')" aria-label="Login with Google">
|
||||
<span>🔍</span> <span>Continue with Google</span>
|
||||
</button>
|
||||
<button class="social-btn" onclick="socialLogin('github')" aria-label="Login with GitHub">
|
||||
<span>🐱</span> <span>Continue with GitHub</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="card" style="margin-top: var(--spacing-large);">
|
||||
<p>Don't have an account? <a href="/register">Register here</a></p>
|
||||
<p><a href="/forgot-password">Forgot your password?</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© 2025 MerchantsOfHope.org - A TSYS Group Initiative</p>
|
||||
<p>Committed to accessibility, security, and excellence</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Set proper focus management
|
||||
const mainContent = document.getElementById('main');
|
||||
mainContent.setAttribute('tabindex', '-1');
|
||||
mainContent.focus();
|
||||
|
||||
// Login form submission
|
||||
const loginForm = document.getElementById('login-form');
|
||||
loginForm.addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
// Get form data
|
||||
const email = document.getElementById('email').value;
|
||||
const password = document.getElementById('password').value;
|
||||
|
||||
// Basic validation
|
||||
if (!email || !password) {
|
||||
showError('Please enter both email and password');
|
||||
return;
|
||||
}
|
||||
|
||||
// In a real app, this would make an API call to authenticate the user
|
||||
alert(`Attempting to login with email: ${email}\n\nIn a real application, this would call the authentication API.`);
|
||||
|
||||
// Simulate login success
|
||||
localStorage.setItem('isLoggedIn', 'true');
|
||||
localStorage.setItem('userEmail', email);
|
||||
|
||||
// Redirect to dashboard or previous page
|
||||
window.location.href = '/';
|
||||
});
|
||||
|
||||
// Ensure all interactive elements have proper focus management
|
||||
const interactiveElements = document.querySelectorAll('a, button, input, select, textarea');
|
||||
interactiveElements.forEach(el => {
|
||||
el.addEventListener('focus', function() {
|
||||
this.style.outline = '2px solid var(--secondary-color)';
|
||||
this.style.outlineOffset = '2px';
|
||||
});
|
||||
|
||||
el.addEventListener('blur', function() {
|
||||
this.style.outline = '';
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function socialLogin(provider) {
|
||||
// In a real app, this would redirect to the appropriate OAuth provider
|
||||
alert(`Redirecting to ${provider} authentication. In a real application, this would redirect to the OAuth provider.`);
|
||||
|
||||
// Store return URL to redirect after authentication
|
||||
localStorage.setItem('returnUrl', window.location.href);
|
||||
}
|
||||
|
||||
function showError(message) {
|
||||
// Create error message element
|
||||
const errorDiv = document.createElement('div');
|
||||
errorDiv.className = 'alert alert-error';
|
||||
errorDiv.textContent = message;
|
||||
errorDiv.setAttribute('role', 'alert');
|
||||
|
||||
// Add to beginning of form
|
||||
const form = document.getElementById('login-form');
|
||||
form.insertBefore(errorDiv, form.firstChild);
|
||||
|
||||
// Auto-remove after 5 seconds
|
||||
setTimeout(() => {
|
||||
if (errorDiv.parentNode) {
|
||||
errorDiv.parentNode.removeChild(errorDiv);
|
||||
}
|
||||
}, 5000);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
222
qwen/go/templates/positions.html
Normal file
222
qwen/go/templates/positions.html
Normal file
@@ -0,0 +1,222 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Browse Positions - MerchantsOfHope.org</title>
|
||||
<meta name="description" content="Browse job positions on MerchantsOfHope.org">
|
||||
|
||||
<link rel="stylesheet" href="/static/css/accessibility.css">
|
||||
</head>
|
||||
<body>
|
||||
<a href="#main" class="skip-link">Skip to main content</a>
|
||||
|
||||
<header>
|
||||
<div class="container">
|
||||
<h1>MerchantsOfHope.org</h1>
|
||||
<p>Browse Job Positions</p>
|
||||
|
||||
<nav aria-label="Main navigation">
|
||||
<ul>
|
||||
<li><a href="/">Home</a></li>
|
||||
<li><a href="/positions">Browse Positions</a></li>
|
||||
<li><a href="/apply">Apply</a></li>
|
||||
<li><a href="/login">Login</a></li>
|
||||
<li><a href="/register">Register</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="main">
|
||||
<div class="container">
|
||||
<h1>Available Positions</h1>
|
||||
|
||||
<div class="filter-section">
|
||||
<h2>Filter Positions</h2>
|
||||
<form id="filter-form">
|
||||
<div class="form-group">
|
||||
<label for="location">Location</label>
|
||||
<input type="text" id="location" name="location" placeholder="e.g., Remote, New York, Atlanta">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="employment-type">Employment Type</label>
|
||||
<select id="employment-type" name="employment_type">
|
||||
<option value="">All Types</option>
|
||||
<option value="full_time">Full-time</option>
|
||||
<option value="part_time">Part-time</option>
|
||||
<option value="contract">Contract</option>
|
||||
<option value="internship">Internship</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="experience-level">Experience Level</label>
|
||||
<select id="experience-level" name="experience_level">
|
||||
<option value="">All Levels</option>
|
||||
<option value="entry_level">Entry Level</option>
|
||||
<option value="mid_level">Mid Level</option>
|
||||
<option value="senior_level">Senior Level</option>
|
||||
<option value="executive">Executive</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary">Apply Filters</button>
|
||||
<button type="reset" class="btn">Clear Filters</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div id="positions-container">
|
||||
<!-- Positions will be loaded here dynamically -->
|
||||
<div class="position-card">
|
||||
<div class="position-title">Senior Software Engineer</div>
|
||||
<div class="position-meta">
|
||||
<div>💰 $100,000 - $140,000</div>
|
||||
<div>📍 Remote</div>
|
||||
<div>🕒 Full-time</div>
|
||||
<div>📊 Mid Level</div>
|
||||
</div>
|
||||
<p>Join our dynamic team building cutting-edge financial solutions. We're looking for an experienced software engineer with strong Go skills to help develop our next-generation platform.</p>
|
||||
<div class="actions">
|
||||
<button class="btn btn-primary" onclick="applyForPosition('Senior Software Engineer')">Apply Now</button>
|
||||
<button class="btn" onclick="viewPositionDetails('Senior Software Engineer')">View Details</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="position-card">
|
||||
<div class="position-title">DevOps Specialist</div>
|
||||
<div class="position-meta">
|
||||
<div>💰 $90,000 - $120,000</div>
|
||||
<div>📍 Atlanta, GA</div>
|
||||
<div>🕒 Contract</div>
|
||||
<div>📊 Mid Level</div>
|
||||
</div>
|
||||
<p>Help us improve our deployment pipelines and infrastructure. We need a DevOps specialist to implement CI/CD solutions and ensure our systems are scalable and reliable.</p>
|
||||
<div class="actions">
|
||||
<button class="btn btn-primary" onclick="applyForPosition('DevOps Specialist')">Apply Now</button>
|
||||
<button class="btn" onclick="viewPositionDetails('DevOps Specialist')">View Details</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="position-card">
|
||||
<div class="position-title">Product Manager</div>
|
||||
<div class="position-meta">
|
||||
<div>💰 $95,000 - $130,000</div>
|
||||
<div>📍 Remote</div>
|
||||
<div>🕒 Full-time</div>
|
||||
<div>📊 Senior Level</div>
|
||||
</div>
|
||||
<p>Lead product strategy and development for our merchant services platform. This role requires excellent communication skills and a deep understanding of the fintech industry.</p>
|
||||
<div class="actions">
|
||||
<button class="btn btn-primary" onclick="applyForPosition('Product Manager')">Apply Now</button>
|
||||
<button class="btn" onclick="viewPositionDetails('Product Manager')">View Details</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="pagination" class="card">
|
||||
<nav aria-label="Pagination">
|
||||
<ul style="display: flex; list-style: none; gap: var(--spacing-small);">
|
||||
<li><button class="btn" onclick="changePage(1)">First</button></li>
|
||||
<li><button class="btn" onclick="changePage(currentPage - 1)" id="prev-btn">Previous</button></li>
|
||||
<li><button class="btn" onclick="changePage(1)" aria-current="page" id="page-1">1</button></li>
|
||||
<li><button class="btn" onclick="changePage(2)" id="page-2">2</button></li>
|
||||
<li><button class="btn" onclick="changePage(3)" id="page-3">3</button></li>
|
||||
<li><button class="btn" onclick="changePage(currentPage + 1)" id="next-btn">Next</button></li>
|
||||
<li><button class="btn" onclick="changePage(10)">Last</button></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© 2025 MerchantsOfHope.org - A TSYS Group Initiative</p>
|
||||
<p>Committed to accessibility, security, and excellence</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Set proper focus management
|
||||
const mainContent = document.getElementById('main');
|
||||
mainContent.setAttribute('tabindex', '-1');
|
||||
mainContent.focus();
|
||||
|
||||
// Filter form submission
|
||||
const filterForm = document.getElementById('filter-form');
|
||||
filterForm.addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
applyFilters();
|
||||
});
|
||||
|
||||
// Ensure all interactive elements have proper focus management
|
||||
const interactiveElements = document.querySelectorAll('a, button, input, select, textarea');
|
||||
interactiveElements.forEach(el => {
|
||||
el.addEventListener('focus', function() {
|
||||
this.style.outline = '2px solid var(--secondary-color)';
|
||||
this.style.outlineOffset = '2px';
|
||||
});
|
||||
|
||||
el.addEventListener('blur', function() {
|
||||
this.style.outline = '';
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
let currentPage = 1;
|
||||
|
||||
function applyFilters() {
|
||||
// In a real app, this would update the position list based on filters
|
||||
alert('Filters applied! In a real application, this would update the position listings.');
|
||||
}
|
||||
|
||||
function applyForPosition(title) {
|
||||
// Check if user is logged in
|
||||
const isLoggedIn = localStorage.getItem('isLoggedIn') === 'true';
|
||||
|
||||
if (!isLoggedIn) {
|
||||
alert('Please log in to apply for positions.');
|
||||
window.location.href = '/login';
|
||||
return;
|
||||
}
|
||||
|
||||
alert(`Applying for position: ${title}\n\nIn a real application, this would take you to the application form.`);
|
||||
}
|
||||
|
||||
function viewPositionDetails(title) {
|
||||
alert(`Viewing details for position: ${title}\n\nIn a real application, this would show comprehensive details about the position.`);
|
||||
}
|
||||
|
||||
function changePage(page) {
|
||||
if (page < 1) page = 1;
|
||||
if (page > 10) page = 10;
|
||||
|
||||
currentPage = page;
|
||||
updatePagination();
|
||||
|
||||
// In a real app, this would load the new page of positions
|
||||
alert(`Loading page ${page} of positions`);
|
||||
}
|
||||
|
||||
function updatePagination() {
|
||||
document.getElementById('prev-btn').disabled = (currentPage === 1);
|
||||
document.getElementById('next-btn').disabled = (currentPage === 10);
|
||||
|
||||
// Update page number buttons to show current page
|
||||
for (let i = 1; i <= 3; i++) {
|
||||
const pageBtn = document.getElementById(`page-${i}`);
|
||||
if (i === currentPage) {
|
||||
pageBtn.setAttribute('aria-current', 'page');
|
||||
pageBtn.style.backgroundColor = 'var(--primary-color)';
|
||||
} else {
|
||||
pageBtn.removeAttribute('aria-current');
|
||||
pageBtn.style.backgroundColor = 'var(--secondary-color)';
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user