JavaScript for Sound Artists: Learn to Code with the Web Audio API by Turner William & Leonard Steve

JavaScript for Sound Artists: Learn to Code with the Web Audio API by Turner William & Leonard Steve

Author:Turner, William & Leonard, Steve [Turner, William]
Language: eng
Format: azw3, epub
Publisher: CRC Press
Published: 2017-01-20T05:00:00+00:00


HTML

<input type="button" value = "Play">

<input type="button" value = "Pause">

<input type="button" value = "Stop">

JQuery/JavaScript

$(function() {

$("input").on("click",function(){ /*assign event listener to all

input elements*/

console.log($(this).val()); /*use the this keyword to access the

element clicked and return its value property*/

});

});

Refactoring the Oscillator Player to Use JQuery

Now that you understand some JQuery basics, you are going to refactor the application you created in the previous chapter by replacing the built-in JavaScript DOM methods with JQuery selectors and methods.

Copy the completed code from the previous chapter to a new directory. In your index.html file reference the JQuery library.

<head>

<meta charset="UTF-8">

<title>CSS and HTML</title>

<script type="text/javascript" src="https://ajax.googleapis.

com/ajax/libs/jquery/2.1.0/jquery.js" charset="utf-8">

</script>

<script src="js/app.js"></script>

<link rel="stylesheet" href="css/app.css">

</head>

Replace the app.js file with a new empty file with the same name.

In the old application, you used this function to encapsulate your code:

window.onload = function() {

}

In the new version of your code, make sure you replace window.onload with the equivalent JQuery function. Also put "use strict" and the AudioContext instantiation at the top of the file, as in the following example:

"use strict";

var audioContext = new AudioContext();

$(function(){

// all code will go here

});

Next, modify the first three variables of the JavaScript file to use JQuery selectors.



Download



Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.