ui/ Media
A representation of HTMLMediaElement
component with an ability to attach a custom event
handler.
import Media from '@enact/ui/Media';
Members
MediaComponent
A component representation of HTMLMediaElement.
import Media from '@enact/ui/Media';
Properties
A type of media component.
An event map object for custom media events.
List custom events that aren't standard to React. These will be directly added to the media element and props matching their name will be executed as callback functions when the event fires.
Example:
{'umsmediainfo': 'onUMSMediaInfo'} // `onUMSMediaInfo` prop function will execute when the `umsmediainfo` event happens
A event map object for media events.
Default: {@link ui/Media.handledMediaEventsMap}A function to be run when media updates.
Media sources passed as children to
mediaComponent
See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source
getKeyFromSourceFunction
getKeyFromSource( source )String
Generates a key representing the source node or nodes provided
Example:
getKeyFromSource('path/file.mp4'); // 'path/file.mp4'
getKeyFromSource(
<source src="path/file.mp4" type="video/mp4" />
); // 'path/file.mp4'
getKeyFromSource([
<source src="path/file.mp4" type="video/mp4" />,
<source src="path/file.ogg" type="video/ogg" />,
]); // 'path/file.mp4+path/file.ogg'
1 Param
- source ArrayElementStringElement
- default: ''
URI for a source,
<source>
node, or array of<source>
nodes
Returns
- String
Key representing sources
Type Definitions
handledMediaEventsMapObject
Maps standard media event type
values to React-style callback prop names
See https://reactjs.org/docs/events.html#media-events
{
abort : 'onAbort',
canplay : 'onCanPlay',
canplaythrough : 'onCanPlayThrough',
durationchange : 'onDurationChange',
emptied : 'onEmptied',
encrypted : 'onEncrypted',
ended : 'onEnded',
error : 'onError',
loadeddata : 'onLoadedData',
loadedmetadata : 'onLoadedMetadata',
loadstart : 'onLoadStart',
pause : 'onPause',
play : 'onPlay',
playing : 'onPlaying',
progress : 'onProgress',
ratechange : 'onRateChange',
seeked : 'onSeeked',
seeking : 'onSeeking',
stalled : 'onStalled',
suspend : 'onSuspend',
timeupdate : 'onTimeUpdate',
volumechange : 'onVolumeChange',
waiting : 'onWaiting'
}