Chapter 6. Piano Man
"More than art, more than literature, music is universally accessible." – Billy Joel
In this chapter, we will learn how to use audio by creating a virtual piano application. First, we will learn about the HTML5 Audio element and API. Then we will create an audio manager to load audio files asynchronously and cache them for playback later. We will create a keyboard using HTML elements and style it using CSS.
We will learn the following in this chapter:
- The HTML5
<audio>element and its attributes - How to use the Audio API to control audio in an application
- How to dynamically load audio files
- How to handle keyboard events to turn the computer keyboard into a piano keyboard
- How to use a range input to control the volume of an audio element
- How to check if the range input type is supported by your browser
