542d80802e
- Set up ESLint and Prettier for code quality - Split large script.js into modular architecture (DOM, animations, effects, easter-eggs, sound, interactions) - Organize assets into proper directory structure (assets/css, assets/js/modules, assets/images) - Add semantic HTML5 landmarks (header, main, nav, footer) - Implement ARIA labels and keyboard navigation for accessibility - Set up Vite build system with minification and optimization - Add CSS custom properties for design tokens - Create sitemap.xml and robots.txt for SEO - Add MIT LICENSE - Expand README with comprehensive documentation - Set up GitHub Actions CI/CD workflow - Optimize build output: ~59KB total (30KB image + 13KB CSS + 16KB JS gzipped) Co-authored-by: ZaneThePython <102631678+ZaneThePython@users.noreply.github.com>
55 lines
1.8 KiB
JavaScript
55 lines
1.8 KiB
JavaScript
// Sound effects
|
|
import { DOM } from './dom.js';
|
|
|
|
// Play sound effect
|
|
export function playSound(type) {
|
|
const audioContext = new (window.AudioContext || window.webkitAudioContext)();
|
|
|
|
if (type === 'click') {
|
|
const oscillator = audioContext.createOscillator();
|
|
const gainNode = audioContext.createGain();
|
|
|
|
oscillator.connect(gainNode);
|
|
gainNode.connect(audioContext.destination);
|
|
|
|
oscillator.frequency.setValueAtTime(800, audioContext.currentTime);
|
|
oscillator.frequency.exponentialRampToValueAtTime(400, audioContext.currentTime + 0.1);
|
|
|
|
gainNode.gain.setValueAtTime(0.1, audioContext.currentTime);
|
|
gainNode.gain.exponentialRampToValueAtTime(0.01, audioContext.currentTime + 0.1);
|
|
|
|
oscillator.start(audioContext.currentTime);
|
|
oscillator.stop(audioContext.currentTime + 0.1);
|
|
} else if (type === 'hover') {
|
|
const oscillator = audioContext.createOscillator();
|
|
const gainNode = audioContext.createGain();
|
|
|
|
oscillator.connect(gainNode);
|
|
gainNode.connect(audioContext.destination);
|
|
|
|
oscillator.frequency.setValueAtTime(600, audioContext.currentTime);
|
|
oscillator.frequency.exponentialRampToValueAtTime(800, audioContext.currentTime + 0.05);
|
|
|
|
gainNode.gain.setValueAtTime(0.05, audioContext.currentTime);
|
|
gainNode.gain.exponentialRampToValueAtTime(0.01, audioContext.currentTime + 0.05);
|
|
|
|
oscillator.start(audioContext.currentTime);
|
|
oscillator.stop(audioContext.currentTime + 0.05);
|
|
}
|
|
}
|
|
|
|
// Add sound effects to buttons
|
|
export function addSoundEffects() {
|
|
const buttons = DOM.getAll('.nav-button');
|
|
|
|
buttons.forEach((button) => {
|
|
button.addEventListener('click', function () {
|
|
playSound('click');
|
|
});
|
|
|
|
button.addEventListener('mouseenter', function () {
|
|
playSound('hover');
|
|
});
|
|
});
|
|
}
|