Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dianne--keyboard #26

Open
wants to merge 9 commits into
base: master
Choose a base branch
from
22 changes: 12 additions & 10 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,47 +12,49 @@
<audio id="cAudio">
<source src="media/c_note.mp3" type="audio/mpeg"></source>
<source src="media/c_note.ogg" type="audio/ogg"></source>
<source src="media/c_note.wav" type="audio/wav"></source>
<source src="media/c_note.wav" type="audio/wav"></source>
</audio>
<audio id="dAudio">
<source src="media/d_note.mp3" type="audio/mpeg"></source>
<source src="media/d_note.ogg" type="audio/ogg"></source>
<source src="/media/d_note.wav" type="audio/wav"></source>
</audio>
<source src="/media/d_note.wav" type="audio/wav"></source>
</audio>
<audio id="eAudio">
<source src="media/e_note.mp3" type="audio/mpeg"></source>
<source src="media/e_note.ogg" type="audio/ogg"></source>
<source src="media/e_note.wav" type="audio/wav"></source>
<source src="media/e_note.wav" type="audio/wav"></source>
</audio>
<audio id="fAudio">
<source src="media/f_note.mp3" type="audio/mpeg"></source>
<source src="media/f_note.ogg" type="audio/ogg"></source>
<source src="media/f_note.wav" type="audio/wav"></source>
<source src="media/f_note.wav" type="audio/wav"></source>
</audio>
<audio id="gAudio">
<source src="media/g_note.mp3" type="audio/mpeg"></source>
<source src="media/g_note.ogg" type="audio/ogg"></source>
<source src="media/g_note.wav" type="audio/wav"></source>
<source src="media/g_note.wav" type="audio/wav"></source>
</audio>
<audio id="aAudio">
<source src="media/a_note.mp3" type="audio/mpeg"></source>
<source src="media/a_note.ogg" type="audio/ogg"></source>
<source src="media/a_note.wav" type="audio/wav"></source>
<source src="media/a_note.wav" type="audio/wav"></source>
</audio>
<audio id="bAudio">
<source src="media/b_note.mp3" type="audio/mpeg"></source>
<source src="media/b_note.ogg" type="audio/ogg"></source>
<source src="media/b_note.wav" type="audio/wav"></source>
<source src="media/b_note.wav" type="audio/wav"></source>
</audio>
</div>
<div class="instrument">
<button class="note c">c</button>
<div class="instrument">
<button class="note c">c</button>
<button class="note d">d</button>
<button class="note e">e</button>
<button class="note f">f</button>
<button class="note g">g</button>
<button class="note a">a</button>
<button class="note b">b</button>
</div>


</body>
</html>
Binary file modified media/a_note.mp3
Binary file not shown.
Binary file modified media/e_note.mp3
Binary file not shown.
Binary file added media/t_note.mp3
Binary file not shown.
2 changes: 1 addition & 1 deletion noise.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ html {
}

body {
background-color: black;
background-color: black;
}

.instrument {
Expand Down
25 changes: 23 additions & 2 deletions noise.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,24 @@
var playNote = function(note){

note.load();
note.play();
};

$(document).ready( function() {
// your code here
});
//for clicking
$('.note').on("click",function() {
var sound = $(this).html();
var note = $('#' + sound + 'Audio')[0];
// notes.load();
// notes.play();
playNote(note);
});

//for keyboard functionality
$('body').keydown(function(event) {
var noise = $('#' + event.key + 'Audio')[0];
// noise.load();
// noise.play();
playNote(noise);
});
});