feat: Set up SessionMiddleware and Jinja2 Template Configuration
- Add SECRET_KEY environment variable and .env file for session management - Configure SessionMiddleware with FastAPI for user session handling - Set up Jinja2 template engine with template directory configuration - Mount static files directory for CSS, JS, and image assets - Create comprehensive base.html template with Bootstrap 5 CDN - Add Bootstrap Icons and custom styling support - Include responsive navigation with user authentication state - Create placeholder CSS and JavaScript files for customization - Add aiofiles dependency for static file serving This establishes the web framework foundation with session management and templating system ready for frontend development.
This commit is contained in:
82
static/js/custom.js
Normal file
82
static/js/custom.js
Normal file
@@ -0,0 +1,82 @@
|
||||
// Custom JavaScript for Delphi Database
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Initialize tooltips if any
|
||||
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
|
||||
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
|
||||
return new bootstrap.Tooltip(tooltipTriggerEl);
|
||||
});
|
||||
|
||||
// Auto-hide alerts after 5 seconds
|
||||
var alerts = document.querySelectorAll('.alert:not(.alert-permanent)');
|
||||
alerts.forEach(function(alert) {
|
||||
setTimeout(function() {
|
||||
var bsAlert = new bootstrap.Alert(alert);
|
||||
bsAlert.close();
|
||||
}, 5000);
|
||||
});
|
||||
|
||||
// Confirm delete actions
|
||||
var deleteButtons = document.querySelectorAll('[data-confirm-delete]');
|
||||
deleteButtons.forEach(function(button) {
|
||||
button.addEventListener('click', function(e) {
|
||||
var message = this.getAttribute('data-confirm-delete') || 'Are you sure you want to delete this item?';
|
||||
if (!confirm(message)) {
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Form validation enhancement
|
||||
var forms = document.querySelectorAll('.needs-validation');
|
||||
Array.prototype.slice.call(forms).forEach(function(form) {
|
||||
form.addEventListener('submit', function(event) {
|
||||
if (!form.checkValidity()) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
form.classList.add('was-validated');
|
||||
}, false);
|
||||
});
|
||||
|
||||
// Dynamic form field enabling/disabling
|
||||
var toggleFields = document.querySelectorAll('[data-toggle-field]');
|
||||
toggleFields.forEach(function(element) {
|
||||
element.addEventListener('change', function() {
|
||||
var targetSelector = this.getAttribute('data-toggle-field');
|
||||
var targetField = document.querySelector(targetSelector);
|
||||
if (targetField) {
|
||||
targetField.disabled = !this.checked;
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Utility functions
|
||||
function formatDate(dateString) {
|
||||
if (!dateString) return '';
|
||||
var date = new Date(dateString);
|
||||
return date.toLocaleDateString();
|
||||
}
|
||||
|
||||
function formatCurrency(amount) {
|
||||
if (!amount) return '$0.00';
|
||||
return new Intl.NumberFormat('en-US', {
|
||||
style: 'currency',
|
||||
currency: 'USD'
|
||||
}).format(amount);
|
||||
}
|
||||
|
||||
function showLoading(button) {
|
||||
if (button) {
|
||||
button.disabled = true;
|
||||
button.innerHTML = '<span class="spinner-border spinner-border-sm me-2"></span>Loading...';
|
||||
}
|
||||
}
|
||||
|
||||
function hideLoading(button, originalText) {
|
||||
if (button) {
|
||||
button.disabled = false;
|
||||
button.innerHTML = originalText;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user