96 Chapter 4—Video and Audio
As simple as this example may seem, the processes during loading a media
stream are actually rather complicated. The specification distinguishes between
network state and ready state, devoting two readonly attributes to these two
states in the HTMLMediaElement interface, with several constants for describing
the relevant state.
The attribute networkState is for monitoring the network state. It can be queried
at any time and returns the possible values listed in Table 4.5.Table 4.5 Constants of the “networkState” attributeValue Constant Description0 NETWORK_EMPTY The video/audio has not yet been initialized.
1 NETWORK_IDLE The video/audio source is selected but is not cur-
rently being loaded.2 NETWORK_LOADING The browser is actively loading the video/audio.
3 NETWORK_NO_SOURCE No suitable source for the video/audio can be
found.When selecting a suitable source, you need to remember that there are two op-
tions for doing this: either via the src attribute of the relevant element or via sev-
eral source elements from which the browser can choose the most suitable one.
If we are working with several source elements for a video, the question arises as
to how we know which of the offered elements was in fact chosen by the browser.
The answer is in the readonly attribute video.currentSrc. In the screen shot of the
video player, you can see it at the bottom left before the copyright.
Actively asking if media types are supported by the relevant browser or not
can be done not only by the browser when selecting the suitable source ele-
ment, but also by the programmer with a script. The method we use for this is
canPlayType(type) and requires a corresponding media type as an argument.
The answer is probably if the browser is fairly sure that it can play the format,
maybe if the browser is rather skeptical, or '' as an empty character chain if it can
definitely not deal with it.See for yourself what selection of common types canPlayType(type) returns
for your browser at http://html5.komplett.cc/code/chap_video/js_canPlayType.
html.