Contents

Preface

Acknowledgment

1. Overview and Setup

What Is a Program?

What Is JavaScript?

HTML, CSS, and JavaScript

What Is a Web Application?

What Is the Web Audio API?

Setting Up Your Work Environment

Setup View in Browser for Windows

Setup View in Browser for Mac

How to Create Code Snippets

Accessing the Chrome Developer Tools

Troubleshooting Problems and Getting Help

2. Getting Started with JavaScript and the Web Audio API

Hello Sound Program

Variables

null

Documenting Your Code with Comments

Exploring Variables with an Oscillator

console.log()

String

Built-In String Methods

toUpperCase()

toLowerCase()

charAt()

replace()

slice()

The length Property

Numbers

How to Determine the Data Type of a Variable

Examples of Arithmetic Operators

Examples of Precedence

Math.min() and Math.max()

Math.ceil() and Math.floor()

Math.random()

Math.abs()

Number-to-String Conversion

Arrays

push()

pop()

shift()

unshift()

concat()

Summary

3. Operators

What Are Operators?

Assignment Operators

Assignment

Addition Assignment

Subtraction Assignment

Multiplication Assignment

Division Assignment

Modulo Assignment

The Boolean Data Type

Comparison Operators

Equality Operator

Strict Equality Operator

Greater Than and Less Than Operators

Greater Than or Equal to Operator

Less Than or Equal to Operator

Not Equal to Operator

Strict Not Equal to Operator

Logical Operators

The Logical AND Operator

The Logical OR Operator

The NOT Operator

Summary

4. Conditional Statements and Loops

Conditional Statements

The if Statement

The switch Statement

Ternary Operator

Loops

for Loops

Using for Loops with Arrays

while Loops

When to Use for Loops and When to Use while Loops

Summary

5. Functions

Functions—A Simple Example

Parts of a Function

Function Expressions

Abstracting Oscillator Playback

A Working Effects Box Example

The Arguments Object

Function Scope

Why You Should Always Declare Your Variables with var

Variable Hoisting

How Hoisting Affects Functions

Anonymous Functions

Closures

What Is a Closure?

Callback Functions

Working with JavaScript’s Built-In Callback Functions

filter()

map()

Recursion

Summary

6. Objects

JavaScript Data Types

Looping through Objects

When to Use Objects Rather Than Arrays

How to Check If an Object Has Access to a Particular Property or Method

Cloning Objects

Prototypal Inheritance

The "this" Keyword

The bind Function

Summary

7. Node Graphs and Oscillators

The AudioContext() Method

Node Graphs

Oscillators

The stop Method

The onended Property

How to Stop Oscillators and Restart Them

The type Property

The frequency Property

The detune Property

Summary

8. Using HTML and CSS to Build User Interfaces

What Is a User Interface?

HTML

Explanation of the HTML Template

Understanding HTML Elements

Form and Input Elements

CSS

Comments

Element Selectors

Grouping Selectors

Descendent Selectors

Child Selectors

class and id

Modifying the App Interface

Margin, Border, and Padding

Removing List Element Bullet Points

Font Size, Style (Type), and Color

Centering Block-Level Elements

Summary

9. DOM Programming with JavaScript

How Does JavaScript Communicate with the DOM?

HTML

JavaScript

Building the Application

How to Trigger an Oscillator by Clicking a Button

Toggling the Start/Stop Text

Programming the Frequency Slider

Changing the Frequency in Real Time

Changing Waveform Types

Completed Code with Waveform Selection

Giving an Outline to the Selected Waveform Type

Summary

10. Simplifying DOM Programming with JQuery

What Is JQuery?

JQuery Setup

Referencing JQuery Directly

Using JQuery from a CDN

How to Use JQuery

Selecting HTML Elements

Storing DOM Selectors as Variables

Using Methods

HTML

JQuery/JavaScript to Change a Single Property

JQuery/JavaScript to Change Multiple Properties

Method Chaining

HTML

CSS

JQuery/JavaScript

HTML

JQuery/JavaScript

The this Keyword

HTML

JQuery/JavaScript

Refactoring the Oscillator Player to Use JQuery

Without JQuery

With JQuery

Setting Up the Event Listener for the User-Selected List Element

Event Listener without JQuery

Event Listener with JQuery

Modifying the Code in setInterval

setInterval Method without JQuery

setInterval Method with JQuery

onOff Method without JQuery

$onOff Selector with JQuery

Summary

11. Loading and Playing Audio Files

Prerequisites

The Two Steps to Loading an Audio File

The XMLHttpRequest Object

get Requests

A Word on Audio File Type Compatibility

Synchronous versus Asynchronous Code Execution

Processing the Audio Buffer with the Node Graph

Summary

12. Factories and Constructors

JavaScript and the Concept of Class

What Are Classes?

The Factory Pattern

Dynamic Object Extension

Private Data

Getters and Setters

Constructors and the new Keyword

Adding Methods to Constructors

The Prototype Object and the Prototype Property

Why Do Constructors Exist If You Can Do the Same Thing with Factories?

Summary

13. Abstracting the File Loader

Thinking about Code Abstraction

Creating the Abstraction

Walking through the Code

Summary

14. The Node Graph and Working with Effects

How to Think About the Node Graph

Gain Nodes

The Placement of Nodes Is Up to You

What Effects Are Available?

How to Determine the Nodes You Need to Create the Effect You Want

A Real-World Example

Some Effects Require Development Work

Summary

15. The Biquad Filter Node

Using the Biquad Filter Node

Filter Types

Creating an Equalizer

Graphic EQ

Parametric EQ

Summary

16. The Convolver Node

Convolution Reverb

Where to Get Pre-Recorded Impulse Response Files

Using Impulse Response Files

HTML

JavaScript

Controlling the Amount of Reverberation

Summary

17. Stereo Panning, Channel Splitting, and Merging

The Stereo Panner Node

The Channel Splitter

The Channel Merger

Merging All Channels of a Multichannel File into a Single Mono Channel

Using the Merger and Splitter Nodes Together

Summary

18. The Delay Node

The Delay Node

Creating Echo Effects

Creating Slap Back Effects

Creating a Ping-Pong Delay

Summary

19. Dynamic Range Compression

The Dynamics Compressor Node

Summary

20. Time

The Timing Clock

The start Method

Looping Sounds

Update Your Audio Loader Library

Changing Audio Parameters over Time

The Audio Parameter Methods

The setValueAtTime Method

The exponentialRampToValueAtTime Method

The linearRampToValueAtTime Method

The setTargetAtTime() Method

The setValueCurveAtTime() Method

Summary

21. Creating Audio Visualizations

A Brief Word on Fourier Analysis

A Brief Explanation of Binary-Coded Decimal Numbers

The Spectrum Analyzer

JavaScript/JQuery

HTML

CSS

Walking through the Code

Storing the Frequency Data in an Array

How to Think About the frequencyData Array

Building the Display Interface

Connecting the Analyzer to the DOM

Summary

22. Adding Flexibility to the Audio Loader Abstraction

The Updated Interface

Modifying the Library

Modifying audioBatchLoader

An Explanation of the Previous Code Edit

Summary

23. Building a Step Sequencer

The Problem

Can I Use setInterval or setTimeout?

The Solution

How It Works

Changing Tempo

Building the Sequencer

Playing Back Sounds in Sequence

Creating the User Interface Grid

HTML

CSS

Adding Interactivity to the Grid Elements

Summary

24. AJAX and JSON

AJAX

JSON

Making an AJAX Call to the iTunes Search API

How the Code Works

HTML

JavaScript

Creating Your Own Web API to Reference Synthesizer Patch Data

The Data Structure

HTML

CSS

How the Code Works

Building on the API

data.js

module.js

Extend the JSON Object

Summary

25. The Future of JavaScript and the Web Audio API

The Web Audio API 1.0

3D Spacial Positioning

Raw Modification of Audio Buffer Data

Suggestions for Continued Learning

JavaScript 6

node.js

The Web MIDI API

Open Sound Control

Summary

Further Reading

Book Website

Index

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.191.223.123