Files
CGW-Quote-Builder/app/templates/product_finder.html
T
Jason 29154bd651 Editor Support
Co-authored-by: Copilot <copilot@github.com>
2026-05-05 15:42:30 -05:00

110 lines
5.0 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<title>Product Finder</title>
<link rel="stylesheet" href="{{ url_for('products.serve_css', filename='styles.css') }}">
</head>
<body>
<div class="container">
<div class="header">
<h1>Product Finder</h1>
</div>
<div class="user-info-bar" id="userInfoBar">
<span id="userLocationInfo"></span>
<a href="{{ url_for('auth.logout') }}" class="logout-btn" title="Logout"
onclick="return confirm('Are you sure you want to log out?');"
style="background: none; border: none; cursor: pointer; font-size: 16px; text-decoration: none; display: inline-block; padding: 8px 12px;">🚪</a>
</div>
<div class="breadcrumb" id="breadcrumb">
Start
</div>
<!-- Search Bar Component -->
<div class="search-container" id="searchContainer" style="display: none;">
<div class="search-wrapper">
<div class="search-input-wrapper">
<input type="text"
id="searchInput"
class="search-input"
placeholder="Search for products... (e.g., Storm Window)"
autocomplete="off">
<button class="search-btn search-btn-action" id="searchGoBtn" onclick="handleSearchGo()">Search / Go</button>
<div class="search-dropdown" id="searchDropdown"></div>
</div>
</div>
</div>
<div id="content">
<!-- Content will be dynamically loaded here -->
</div>
</div>
<script>
// Base URL for API calls
const BASE_URL = '';
// Load user session info
async function loadUserInfo() {
try {
const response = await fetch('/api/session');
const data = await response.json();
if (data.status === 'success') {
const locationNames = {
'LINDS': 'Lindsborg',
'IOLA': 'Iola',
'KC': 'Kansas City',
'BMD': 'BMD'
};
const currentLoc = locationNames[data.currentLocation] || data.currentLocation;
const canChangeLocation = data.accessibleLocations && data.accessibleLocations.length > 1;
let locationDisplay;
if (canChangeLocation) {
locationDisplay = `<a href="{{ url_for('auth.select_location_page') }}" style="color: #6a4c93; text-decoration: none; font-weight: 500; cursor: pointer;"
onmouseover="this.style.textDecoration='underline'"
onmouseout="this.style.textDecoration='none'"
title="Click to change location">📍 ${currentLoc}</a>`;
} else {
locationDisplay = `📍 ${currentLoc}`;
}
let manageProductsLink = '';
if (data.permissions && data.permissions.manage_products) {
manageProductsLink = ` | <a href="{{ url_for('products.product_manager') }}" style="color: #6a4c93; text-decoration: none; font-weight: 500; cursor: pointer;"
onmouseover="this.style.textDecoration='underline'"
onmouseout="this.style.textDecoration='none'"
title="Manage Products">Manage Products</a>`;
}
document.getElementById('userLocationInfo').innerHTML =
`👤 ${data.username} | ${locationDisplay}${manageProductsLink}`;
}
} catch (error) {
console.error('Error loading user info:', error);
}
}
// Load user info when page loads
loadUserInfo();
</script>
<script>
// Pass BASE_URL to script.js by setting it as a window variable
window.APP_BASE_URL = '';
// Set data path for the quiz
window.DATA_PATH = '{{ url_for("products.serve_data", filename="") }}';
// Set initial product if provided via URL
window.INITIAL_PRODUCT = '{{ initial_product or "" }}';
</script>
<script src="{{ url_for('products.serve_js', filename='script.js') }}"></script>
</body>
</html>