Perspective - Audio
Component Palette Icon:
info
The UI for this component is hidden by default and is browser dependent. There is a hidden property, props.display, which can be used to display UI for this component. In the event a user is displaying the UI (props.display = true), the component will be displayed differently based on the browser in use.
Description​
New in 8.1.16
An audio component, hidden by default, that Designers can use to play and pause sound clips in the browser.Supported Audio Files​
Supported audio file types are browser dependent.
| File Type | Browser Compatibility |
|---|---|
| 3GP | Firefox for Android |
| ADTS | Firefox Available only if available on the underlying operating system's media framework. |
| FLAC | Chrome 56, Edge 16, Firefox 51, Safari 11 |
| MPEG-4 (MP4) | Chrome 3, Edge 12, Firefox, Internet Explorer 9, Opera 24, Safari 3.1 |
| Ogg | Chrome 3, Firefox 3.5, Edge 17 (desktop only), Internet Explorer 9, Opera 10.50 Edge requires Web Media Extensions to be installed. |
| QuickTime (MOV) | Only older versions of Safari, plus other browsers that supported Apple's QuickTime plugin |
| Waveform Audiofile (WAV) | Chrome 8+, Edge 12+, Firefox 4+, Opera 11.5+, Safari 4+ |
| WebM | Chrome 6, Edge 17 (desktop only), Firefox 4, Opera 10.6, Safari 14.1 (macOS), Safari 15 (iOS). Edge requires Web Media Extensions to be installed. |
Properties​
Most Properties have binding options. For more information on Bindings, see Types of Bindings in Perspective. This section only documents the Props Category of properties. The other Categories are described on the Perspective Component Properties page.
| Name | Description | Property Type |
|---|---|---|
| source | The source URL of the media file. | value: string |
| play | The play state of the media file. Toggling this property will start or pause the media file. | value: boolean |
| loop | Determines if the media file should loop after reaching the end. | value: boolean |
| volume | The percentage of maximum volume (from 0 to 100). | value: numeric |
| playbackRate | A double that represents the playback rate of the media file. | value: numeric |
| allowDownload | Determines whether the audio player allows downloading of the media file. | value: boolean |
| style | Sets a style that applies to the component. The Style menu contains all the tools for modifying text, background, margins, and borders. You can also specify a style class. | object |
Scripting​
See the Perspective - Audio Scripting page for the full list of scripting functions available for this component.