HTML5 audio currentTime

by trustweb

HTML

<script src="http://modernizr.com/downloads/modernizr-latest.js"></script>
Press "a" or "s" to play note

JavaScript

//### Variable used to store ASCII Key to piano key ###//
var pianoKeys = {
    65: '1C',
    83: '1D'
};
//### Variable used to flag the keys ###//
var pianoKeyFlag = {
    65: true,
    83: '1D'
};
//### Audio objects
var audios = {
	'1C' : new Audio(),
    '1D' : new Audio(),
};

audios['1C'].src = Modernizr.audio.ogg ? 'http://pianosounds.pixelass.com/tones/grand-piano/1C.ogg' : 'http://pianosounds.pixelass.com/tones/grand-piano/1C.mp3';
audios['1D'].src = Modernizr.audio.ogg ? 'http://pianosounds.pixelass.com/tones/grand-piano/1D.ogg' : 'http://pianosounds.pixelass.com/tones/grand-piano/1D.mp3';

//### Function used to play sound only once ###//
function pianoKeyPressed(evt) {
    key = pianoKeys[evt.keyCode]; // name of Piano key
    if (pianoKeyFlag[evt.keyCode] === true) {
        audios[key].play(); // play the sound
        pianoKeyFlag[evt.keyCode] = false;
    }
}

//### Function used to stop sound ###//
function pianoKeyReleased(evt) {
	key = pianoKeys[evt.keyCode]; // name of Piano key
    audios[key].currentTime = 0;
    audios[key].pause(); // pause the sound
    pianoKeyFlag[evt.keyCode] = true;
    return true;
}

function piano() {

    var keyID = ''; // name of key ID
    var key = ''; // Piano key name


    $(document).keydown(function(evt) {
    	if(evt.which==65 || evt.which==83){
    		pianoKeyPressed(evt);
    	}
    });
    $(document).keyup(function(evt) {
    	if(evt.which==65 || evt.which==83){
    		pianoKeyReleased(evt);
    	}
    });
}

$(document).ready(function(){
	piano();
});