ananbhsal648aa's picture
ليش الواجهات ما يتغلين ممكن تتطوره
df6b307 verified
Raw
History Blame Contribute Delete
4.67 kB
// Main application script
document.addEventListener('DOMContentLoaded', function() {
// Initialize feather icons with error handling
if (typeof feather !== 'undefined') {
feather.replace();
}
// Smooth scrolling for anchor links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
document.querySelector(this.getAttribute('href')).scrollIntoView({
behavior: 'smooth'
});
});
});
// Mobile menu toggle for web components
document.addEventListener('click', function(e) {
// Handle mobile menu toggle within shadow DOM
if (e.target && e.target.closest) {
const mobileButton = e.target.closest('#mobile-menu-button');
if (mobileButton) {
const header = mobileButton.closest('custom-header');
if (header) {
// The toggle is handled within the component
return;
}
}
}
});
// Initialize mobile menu for non-web-component menus
const mobileMenuButton = document.getElementById('mobile-menu-button');
const mobileMenu = document.getElementById('mobile-menu');
if (mobileMenuButton && mobileMenu) {
mobileMenuButton.addEventListener('click', () => {
mobileMenu.classList.toggle('hidden');
});
}
// Form validation example
const forms = document.querySelectorAll('form');
forms.forEach(form => {
form.addEventListener('submit', function(e) {
e.preventDefault();
// Add your form validation logic here
console.log('Form submitted');
});
});
// Theme toggle (if implemented)
const themeToggle = document.getElementById('theme-toggle');
if (themeToggle) {
themeToggle.addEventListener('click', function() {
document.documentElement.classList.toggle('dark');
// Save preference to localStorage
const isDark = document.documentElement.classList.contains('dark');
localStorage.setItem('theme', isDark ? 'dark' : 'light');
});
}
// Initialize any charts or data visualizations
initializeCharts();
// Set up any event listeners for dynamic content
setupEventListeners();
});
// Function to initialize charts
function initializeCharts() {
// Example chart initialization
// In a real application, you would use a library like Chart.js
console.log('Initializing charts...');
}
// Function to set up event listeners
function setupEventListeners() {
// Example event listener setup
console.log('Setting up event listeners...');
}
// Notification system
function showNotification(message, type = 'info') {
const notification = document.createElement('div');
notification.className = `notification bg-${type === 'error' ? 'red' : type === 'success' ? 'green' : 'blue'}-500 text-white`;
notification.textContent = message;
document.body.appendChild(notification);
// Remove notification after 3 seconds
setTimeout(() => {
notification.remove();
}, 3000);
}
// Helper function to format currency
function formatCurrency(amount) {
return new Intl.NumberFormat('ar-YE', {
style: 'currency',
currency: 'YER'
}).format(amount);
}
// Helper function to format date
function formatDate(dateString) {
const options = { year: 'numeric', month: 'long', day: 'numeric' };
return new Date(dateString).toLocaleDateString('ar-YE', options);
}
// API call example
async function fetchData(endpoint) {
try {
const response = await fetch(`/api/${endpoint}`);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
return await response.json();
} catch (error) {
console.error('Error fetching data:', error);
showNotification('حدث خطأ أثناء جلب البيانات', 'error');
}
}
// Debounce function for search inputs
function debounce(func, wait) {
let timeout;
return function executedFunction(...args) {
const later = () => {
clearTimeout(timeout);
func(...args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
};
}
// Export functionality
function exportToExcel(data, filename) {
// This would typically use a library like SheetJS
console.log('Exporting to Excel:', filename);
showNotification('تم تصدير البيانات إلى Excel', 'success');
}
// Print functionality
function printPage() {
window.print();
}