HTML and CSS Reference
In-Depth Information
the bounds of the area we will test. If the mouse pointer is within those bounds, we know the
button has been clicked:
function eventMouseUp ( event ) {
iif ( timeWaited >= buttonWait ) {
timeWaited = 0 ;
iif ( ( mouseY >= playY ) && ( mouseY <= playY + bH ) && ( mouseX >= playX ) &&
( mouseX <= playX + bW ) ) {
in immediate mode, you would have to “roll your own,” just like the other functionality we have dis-
After a hit is detected, we need to determine whether we are going to call the play() or
pause() method of the HTMLAudioElement object represented by the audioElement vari-
able. To figure out which method to call, we simply test to see whether the audio is paused
bycheckingthe audioElement.paused property.Ifso,wecallthe play() method;ifnot,we
call pause() . Recall that the HTMLAudioElement.paused property is set to true if the audio
is not playing, regardless ofwhether the paused() function was called. This means that when
the application starts but we have not set autoplay , we can easily display the proper button
(play or pause) just by testing this property:
iif ( audioElement . paused ) {
audioElement . play ();
} else
else {
audioElement . pause ();
Now,in drawScreen() ,we need to choose which button to display: the one representing play
(green triangle) or pause (two horizontal boxes). The play button is displayed when the audio
is paused, and the pause button is displayed when the audio is playing. This button is a “call
to action,” so it displays what will happen when you click on it, not the status of the audio
Search WWH ::

Custom Search