Create script.js

script.js

@@ -0,0 +1,188 @@
+const audioContext = new (window.AudioContext || window.webkitAudioContext)();
+const oscillator = audioContext.createOscillator();
+const gainNode = audioContext.createGain();
+
+oscillator.connect(gainNode);
+gainNode.connect(audioContext.destination);
+oscillator.start();
+
+function playNote(note) {
+    const noteFrequency = getNoteFrequency(note);
+    oscillator.frequency.setValueAtTime(noteFrequency, audioContext.currentTime);
+    gainNode.gain.setValueAtTime(1, audioContext.currentTime);
+    gainNode.gain.exponentialRampToValueAtTime(0.001, audioContext.currentTime + 1);
+}
+
+function getNoteFrequency(note) {
+    const noteFrequencies = {
+        'C4': 261.63,
+        'C#4': 277.18,
+        'D4': 293.66,
+        'D#4': 311.13,
+        'E4': 329.63,
+        'F4': 349.23,
+        'F#4': 369.99,
+        'G4': 392.00,
+        'G#4': 415.30,
+        'A4': 440.00,
+        'A#4': 466.16,
+        'B4': 493.88
+    };
+    return noteFrequencies[note];
+}
+
+const pianoKeys = document.querySelectorAll('.key');
+pianoKeys.forEach(key => {
+    key.addEventListener('click', () => {
+        const note = key.getAttribute('data-note');
+        playNote(note);
+    });
+});
+
+const drumButtons = document.querySelectorAll('.drum-button');
+drumButtons.forEach(button => {
+    button.addEventListener('click', () => {
+        const sound = button.getAttribute('data-sound');
+        playSound(`sounds/drums/${sound}.mp3`);
+    });
+});
+
+const pluckButtons = document.querySelectorAll('.pluck-button');
+pluckButtons.forEach(button => {
+    button.addEventListener('click', () => {
+        const sound = button.getAttribute('data-sound');
+        playSound(`sounds/pluck/${sound}.mp3`);
+    });
+});
+
+const voiceButtons = document.querySelectorAll('.voice-button');
+voiceButtons.forEach(button => {
+    button.addEventListener('click', () => {
+        const sound = button.getAttribute('data-sound');
+        playSound(`sounds/voice/${sound}.mp3`);
+    });
+});
+
+const guitarButtons = document.querySelectorAll('.guitar-button');
+guitarButtons.forEach(button => {
+    button.addEventListener('click', () => {
+        const sound = button.getAttribute('data-sound');
+        playSound(`sounds/guitar/${sound}.mp3`);
+    });
+});
+
+const saxophoneButtons = document.querySelectorAll('.saxophone-button');
+saxophoneButtons.forEach(button => {
+    button.addEventListener('click', () => {
+        const sound = button.getAttribute('data-sound');
+        playSound(`sounds/saxophone/${sound}.mp3`);
+    });
+});
+
+const bit8Buttons = document.querySelectorAll('.8bit-button');
+bit8Buttons.forEach(button => {
+    button.addEventListener('click', () => {
+        const sound = button.getAttribute('data-sound');
+        playSound(`sounds/8bit/${sound}.mp3`);
+    });
+});
+
+const bit16Buttons = document.querySelectorAll('.16bit-button');
+bit16Buttons.forEach(button => {
+    button.addEventListener('click', () => {
+        const sound = button.getAttribute('data-sound');
+        playSound(`sounds/16bit/${sound}.mp3`);
+    });
+});
+
+const genreButtons = document.querySelectorAll('.genre-button');
+genreButtons.forEach(button => {
+    button.addEventListener('click', () => {
+        const genre = button.getAttribute('data-genre');
+        applyGenre(genre);
+    });
+});
+
+const loopButtons = document.querySelectorAll('.loop-button');
+loopButtons.forEach(button => {
+    button.addEventListener('click', () => {
+        const loop = button.getAttribute('data-loop');
+        playLoop(`sounds/loops/${loop}.mp3`);
+    });
+});
+
+const fxButtons = document.querySelectorAll('.fx-button');
+fxButtons.forEach(button => {
+    button.addEventListener('click', () => {
+        const fx = button.getAttribute('data-fx');
+        applyFX(`sounds/fx/${fx}.mp3`);
+    });
+});
+
+function playSound(soundFile) {
+    const audio = new Audio(soundFile);
+    audio.play();
+}
+
+function playLoop(loopFile) {
+    const audio = new Audio(loopFile);
+    audio.loop = true;
+    audio.play();
+}
+
+function applyFX(fxFile) {
+    const audio = new Audio(fxFile);
+    audio.play();
+}
+
+function applyGenre(genre) {
+    // Apply genre effects (e.g., change tempo, pitch, etc.)
+    console.log(`Applying ${genre} genre effects...`);
+}
+
+let isRecording = false;
+let recordedNotes = [];
+
+document.getElementById('record-button').addEventListener('click', () => {
+    isRecording = true;
+    recordedNotes = [];
+    document.getElementById('record-button').disabled = true;
+    document.getElementById('stop-button').disabled = false;
+});
+
+document.getElementById('stop-button').addEventListener('click', () => {
+    isRecording = false;
+    document.getElementById('record-button').disabled = false;
+    document.getElementById('stop-button').disabled = true;
+    document.getElementById('play-button').disabled = false;
+});
+
+document.getElementById('play-button').addEventListener('click', () => {
+    recordedNotes.forEach((note, index) => {
+        setTimeout(() => playNote(note), index * 500);
+    });
+});
+
+pianoKeys.forEach(key => {
+    key.addEventListener('click', () => {
+        const note = key.getAttribute('data-note');
+        if (isRecording) {
+            recordedNotes.push(note);
+        }
+    });
+});
+
+document.getElementById('audio-file').addEventListener('change', (event) => {
+    const file = event.target.files[0];
+    if (file) {
+        document.getElementById('play-file-button').disabled = false;
+    }
+});
+
+document.getElementById('play-file-button').addEventListener('click', () => {
+    const file = document.getElementById('audio-file').files[0];
+    if (file) {
+        const audio = new Audio(URL.createObjectURL(file));
+        audio.play();
+    }
+});