Users can select an image, file, sound, or video by selecting from the available options, uploading, or entering a URL.
Use media
to allow the user to select from more than one type of media with a single control.
For example, allow the user to select an image or a video.
Limiting the user to one type of media is equivalent to using the underlying type of VCC. See image, video, sound, or file VCC.
You can set type options for the allowed media types.
Configure the returnType
to save the value as a URL to the file or an object with the URL and additional metadata.
{
"name": "Media Upload",
"type": "media",
"typeOptions": {
"acceptOnly": ["image", "video"],
"returnType": "url",
"hideExtensions": false,
"videoOptions": {
"hls": true,
"estimatePoses": false
},
"imageOptions": {
"width": 100
}
}
}
The following typeOptions
are available for configuring a media VCC.
Specifies the underlying media types to allow.
The value is an array containing any of the following options.
If the value is an empty array, or if acceptOnly
is not included, then any file type will be allowed.
image - Allows users to choose images files.
Using a media
VCC with acceptOnly
set to ["image"]
is equivalent to using an image VCC.
video - Allows users to choose video files.
Using a media
VCC with acceptOnly
set to ["video"]
is equivalent to using a video VCC.
audio - Allows users to choose audio files.
Using a media
VCC with acceptOnly
set to ["audio"]
is equivalent to using a sound VCC.
file - Allows users to choose any type of file.
Using a media
VCC with acceptOnly
set to ["file"]
is equivalent to using a file VCC.
Enables you to hide all asset packs and VCC extensions in cases where they don’t make sense (for example, templates for selling premium assets). In the following code sample, extensions are hidden, so Browse Image Asset Packs will not appear as a selection.
{
"key": "hideExtensions",
"name": "Image or Video No Extensions",
"type": "media",
"typeOptions": {
"acceptOnly": ["image", "video"],
"hideExtensions": true,
"videoOptions": {
"hls": true
}
}
}
The previous sample code displays the following selections.
Sets the configuration options for video values. Some of the more commonly used options are as follows.
For delivery of longer content, HTTP Live Streaming (HLS) can be enabled by setting hls
to true.
When enabled, uploaded videos are transcoded for HLS and return an m3u8 playlist.
Use this feature in conjunction with hls.js for controlling playback.
Pose detection data can be generated by setting estimatePoses
to true.
When specified, pose data is available after upload by appending .poses
to the returned URL.
For example, https://objects.koji-cdn.com/project-id/my-video.mp4.poses
.
See the video VCC for more options.
Sets the configuration options for image values.
For example, the width
and height
options can be used to specify a fixed size for an image.
See the image VCC for more options.
Specifies the type of the returned value when a user selects a file. Set one of the following options:
url
– Returns a string with a URL that points to the file.
extended
– Returns an object with the URL and additional metadata about the file.
If returnType
is not specified, it defaults to extended
.
When returnType
is set to extended
, the saved object has the following structure.
{
"url": "string", (1)
"type": "string", (2)
"sizeBytes": "string", (3)
"videoMetadata": { (4)
"thumbnailUrl": "string", (5)
},
"audioMetadata": { (6)
"durationSeconds": "number", (7)
},
"imageMetadata": { (8)
"naturalWidth": "number", (9)
"naturalHeight": "number", (10)
}
}
url
– URL of the selected media file.
type
- Type of media: image
, video
, audio
, or file
.
sizeBytes
- Size in bytes of the media file.
videoMetadata
- Metadata for a video file.
thumbnailUrl
- URL for the video thumbnail.
audioMetadata
- Metadata for an audio file.
durationSeconds
- Duration in seconds for an audio file.
imageMetadata
- Metadata for an image file.
naturalWidth
- Natural width of an image in pixels.
naturalHeight
- Natural height of an image in pixels.
Note
|
Metadata for a particular type of media will be included only if that type of media is allowed.
For example, if the acceptOnly array does not include audio , audioMetadata will not be included in the returned value.
|