GeorgeWL/audioLib.js

## audioLib.js
function audioLoader(fileDirectory) {
    var soundObj = {};
    soundObj.fileDirectory = fileDirectory; //my guess is it's here the issue

    var getSound = new XMLHttpRequest();
    getSound.open("GET", soundObj.fileDirectory, true);
    // library object
    getSound.responseType = "arraybuffer";
    // a buffer stores data temporarily in the browser, for low-latency, prevents having to wait for load to play sound
    getSound.onload = function() {
        audioContext.decodeAudioData(getSound.response, function(buffer) //takes the xhtmlrequest, which is stored in getSound, and creates the buffer
            {
                soundObj.soundToPlay = buffer;
                //calls the folder of sounds and stored in soundObj and puts into buffer of page
            });

    }
    getSound.send();

    soundObj.play = function() {
        var playSound = audioContext.createBufferSource();
        playSound.buffer = soundObj.soundToPlay; //assign soundObj to playSound
        var volume = audioContext.createGain();
        volume.gain.value = volumeVal; //control the gain in a variable
        playSound.connect(volume);
        volume.connect(audioContext.destination); //connect to output
        playSound.start(audioContext.currentTime);
    }
    return soundObj;
};

var pianoC3 = audioLoader("audio/pianoC3.mp3");

function keyPressed(){
    pianoC3.play(1);
}
window.addEventListener("keydown", pianoC3.play, false); //adds keydown event to browser to activate the sound.

## musictest.js
"use strict"
// Code which checks browser compatibility, and if compatible but needs a different object name, changes object name
function audioContextBrowser() {
    if (typeof AudioContext !== "undefined") {
        return new AudioContext();
    } else if (typeof webkitAudioContext !== "undefined") {
        return new webkitAudioContext();
    } else if (typeof mozAudioContext !== "undefined") {
        return new mozAudioContext();
    } else {
        throw new Error('AudioContext not Supported');
        throw new console.error('AudioContext not Supported');
    }
}
var audioContext = new audioContextBrowser();
var audioBuffer;
var getSound = new XMLHttpRequest();
getSound.open("get", "audio/pianoC3.mp3", true);
// open source creative commons Zero sound https://www.freesound.org/people/Tesabob2001/sounds/203479/
getSound.responseType = "arraybuffer";
// a buffer stores data temporarily in the browser, for low-latency, prevents having to wait for load to play sound
getSound.onload = function() {
    audioContext.decodeAudioData(getSound.response, function(buffer) //takes the xhtmlrequest, which is stored in getSound, and creates the buffer
        {
            audioBuffer = buffer;
            //calls the buffer of sounds and stores in var audioBuffer
        });

};
getSound.send();

window.addEventListener("mousedown", playback); //adds click event to browser to activate the sound.

function playback() { //basically required to playback.
    var playSound = audioContext.createBufferSource();
    playSound.buffer = audioBuffer; //assign audioBuffer to playSound
    playSound.connect(audioContext.destination); //connect to output
    playSound.start(audioContext.currentTime);
}
//next step is to abstract this code, so load and playback is done with 2 lines, rather than 25

## soundtest.html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Soundtest</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
    <!-- abstracted code to check whether browser is compatible -->
    <script src="js/audioCheck.js"></script>
    <!-- audioLoader code -->
    <script src="js/audioLib.js"></script>
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.2/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
    <!-- Oscillator-based audio generation, which will likely be used in final version. -->
    <!-- <script src="js/simpleaudio.js"></script> -->
    <!-- standard load of audio file, without abstracted code.
    <script src="js/musictest.js"></script> -->
    <div class="container">
    <img class="img-responsive" src="http://i.imgur.com/VPIHWEH.png" alt="gainmap.PNG" title="Source: Introduction to Web Audio API, Pluralsight Creative">
        <p>
            e.g. of a gain mapping from PluralSight Creative
        </p>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>

</html>
	function audioLoader(fileDirectory) {
	var soundObj = {};
	soundObj.fileDirectory = fileDirectory; //my guess is it's here the issue

	var getSound = new XMLHttpRequest();
	getSound.open("GET", soundObj.fileDirectory, true);
	// library object
	getSound.responseType = "arraybuffer";
	// a buffer stores data temporarily in the browser, for low-latency, prevents having to wait for load to play sound
	getSound.onload = function() {
	audioContext.decodeAudioData(getSound.response, function(buffer) //takes the xhtmlrequest, which is stored in getSound, and creates the buffer
	{
	soundObj.soundToPlay = buffer;
	//calls the folder of sounds and stored in soundObj and puts into buffer of page
	});

	}
	getSound.send();

	soundObj.play = function() {
	var playSound = audioContext.createBufferSource();
	playSound.buffer = soundObj.soundToPlay; //assign soundObj to playSound
	var volume = audioContext.createGain();
	volume.gain.value = volumeVal; //control the gain in a variable
	playSound.connect(volume);
	volume.connect(audioContext.destination); //connect to output
	playSound.start(audioContext.currentTime);
	}
	return soundObj;
	};

	var pianoC3 = audioLoader("audio/pianoC3.mp3");

	function keyPressed(){
	pianoC3.play(1);
	}
	window.addEventListener("keydown", pianoC3.play, false); //adds keydown event to browser to activate the sound.
	"use strict"
	// Code which checks browser compatibility, and if compatible but needs a different object name, changes object name
	function audioContextBrowser() {
	if (typeof AudioContext !== "undefined") {
	return new AudioContext();
	} else if (typeof webkitAudioContext !== "undefined") {
	return new webkitAudioContext();
	} else if (typeof mozAudioContext !== "undefined") {
	return new mozAudioContext();
	} else {
	throw new Error('AudioContext not Supported');
	throw new console.error('AudioContext not Supported');
	}
	}
	var audioContext = new audioContextBrowser();
	var audioBuffer;
	var getSound = new XMLHttpRequest();
	getSound.open("get", "audio/pianoC3.mp3", true);
	// open source creative commons Zero sound https://www.freesound.org/people/Tesabob2001/sounds/203479/
	getSound.responseType = "arraybuffer";
	// a buffer stores data temporarily in the browser, for low-latency, prevents having to wait for load to play sound
	getSound.onload = function() {
	audioContext.decodeAudioData(getSound.response, function(buffer) //takes the xhtmlrequest, which is stored in getSound, and creates the buffer
	{
	audioBuffer = buffer;
	//calls the buffer of sounds and stores in var audioBuffer
	});

	};
	getSound.send();

	window.addEventListener("mousedown", playback); //adds click event to browser to activate the sound.

	function playback() { //basically required to playback.
	var playSound = audioContext.createBufferSource();
	playSound.buffer = audioBuffer; //assign audioBuffer to playSound
	playSound.connect(audioContext.destination); //connect to output
	playSound.start(audioContext.currentTime);
	}
	//next step is to abstract this code, so load and playback is done with 2 lines, rather than 25
	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Soundtest</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
	<!-- abstracted code to check whether browser is compatible -->
	<script src="js/audioCheck.js"></script>
	<!-- audioLoader code -->
	<script src="js/audioLib.js"></script>
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.2/html5shiv.js"></script>
	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
	</head>

	<body>
	<!-- Oscillator-based audio generation, which will likely be used in final version. -->
	<!-- <script src="js/simpleaudio.js"></script> -->
	<!-- standard load of audio file, without abstracted code.
	<script src="js/musictest.js"></script> -->
	<div class="container">
	<img class="img-responsive" src="http://i.imgur.com/VPIHWEH.png" alt="gainmap.PNG" title="Source: Introduction to Web Audio API, Pluralsight Creative">
	<p>
	e.g. of a gain mapping from PluralSight Creative
	</p>
	</div>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
	</body>

	</html>