// Main JavaScript for DroidDrop class DroidDropApp { constructor() { this.init(); } init() { this.setupEventListeners(); this.initializeComponents(); this.loadEmulators(); } setupEventListeners() { // Launch emulator buttons document.addEventListener('click', (e) => { if (e.target.closest('button') && e.target.closest('button').textContent.includes('Launch Emulator')) { this.handleEmulatorLaunch(e); } }); // Smooth scroll for anchor links document.addEventListener('click', (e) => { if (e.target.matches('a[href^="#"]')) { e.preventDefault(); const target = document.querySelector(e.target.getAttribute('href')); if (target) { target.scrollIntoView({ behavior: 'smooth' }); } } }); } initializeComponents() { // Initialize any third-party libraries or components console.log('DroidDrop initialized'); } async loadEmulators() { try { // In a real implementation, this would fetch from an API const emulators = await this.fetchEmulators(); this.renderEmulators(emulators); } catch (error) { console.error('Failed to load emulators:', error); } } async fetchEmulators() { // Mock data - in production, this would be an API call return [ { id: 1, name: 'Pixel 6 Pro', androidVersion: 'Android 13', resolution: '1440x3120px', ram: '4GB', image: 'http://static.photos/technology/640x360/1', popular: true }, { id: 2, name: 'Samsung Galaxy S23', androidVersion: 'Android 14', resolution: '1080x2340px', ram: '8GB', image: 'http://static.photos/technology/640x360/2', popular: false }, { id: 3, name: 'OnePlus 11', androidVersion: 'Android 12', resolution: '1440x3216px', ram: '6GB', image: 'http://static.photos/technology/640x360/3', popular: false } ]; } renderEmulators(emulators) { // This would update the emulator cards with dynamic data console.log('Emulators loaded:', emulators); } handleEmulatorLaunch(event) { const button = event.target.closest('button'); const card = button.closest('.bg-white'); const deviceName = card.querySelector('h3').textContent; // Show loading state const originalText = button.textContent; button.innerHTML = '
'; button.disabled = true; // Simulate emulator launch setTimeout(() => { button.innerHTML = originalText; button.disabled = false; // Show success message this.showNotification(`Launching ${deviceName} emulator...`, 'success'); // In a real implementation, this would redirect to the emulator page // window.location.href = `/emulator/${deviceName.toLowerCase().replace(/\s+/g, '-')}`; }, 2000); } showNotification(message, type = 'info') { // Create and show a toast notification const notification = document.createElement('div'); notification.className = `fixed top-4 right-4 p-4 rounded-lg shadow-lg z-50 transform transition-all duration-300 ${ type === 'success' ? 'bg-green-500 text-white' : type === 'error' ? 'bg-red-500 text-white' : 'bg-blue-500 text-white' }`; notification.textContent = message; document.body.appendChild(notification); // Remove after 3 seconds setTimeout(() => { notification.remove(); }, 3000); } } // Initialize the app when DOM is loaded document.addEventListener('DOMContentLoaded', () => { new DroidDropApp(); }); // Utility functions const utils = { formatDeviceName: (name) => { return name.replace(/\s+/g, '-').toLowerCase(); }, getRandomColor: () => { const colors = ['blue', 'purple', 'green', 'red', 'yellow']; return colors[Math.floor(Math.random() * colors.length)]; }, debounce: (func, wait) => { let timeout; return function executedFunction(...args) { const later = () => { clearTimeout(timeout); func(...args); }; clearTimeout(timeout); timeout = setTimeout(later, wait); }; } }; // Export for use in other modules window.DroidDropApp = DroidDropApp; window.utils = utils;