This section provides an extension to Using Tizen WASM Player with RenderingMode::kVideoTexture of ElementaryMediaStreamSource. It presents how to extend an existing WASM Player application with Video Decoder functionalities using the Tizen WASM Video Decoder Sample.
To enable the WASM Video Decoder in an existing WASM Player application, you must:
Set the video rendering mode
Configure the GL context
Initialize the GL
Implement the rendering loop
The WASM Video Decoder allows the application to fill a requested GL texture with decoded frame, instead of rendering it on a HTMLMediaElement.
Setting Video Texture rendering mode for WASM Player
To change the ElementaryMediaStreamSource rendering mode from Media Element to Video Texture, RenderingMode::kMediaElement must be replaced by RenderingMode::kVideoTexture:
using LatencyMode = samsung::wasm::ElementaryMediaStreamSource::LatencyMode;
using RenderingMode = samsung::wasm::ElementaryMediaStreamSource::RenderingMode;
auto elementary_media_stream_source = std::make_unique<samsung::wasm::ElementaryMediaStreamSource>(LatencyMode::kNormal, RenderingMode::kVideoTexture);
Configuring GL Context
This section covers the configuration of GL context using the Samsung Emscripten SDK. You must first make the canvas accessible, and then prepare either SDL or EGL for GL initialization.
Making Canvas Accessible from Emscripten
GL context in WASM is associated with a <canvas> HTML element. To make it possible for WASM to use it:
Create a <canvas> element in the application's HTML file that runs the WASM module:
NoteNote that the EGL provided by the Emscripten SDK does not support setting the GL major version, so it is not possible to use GLES 3.0 using EGL wrapper.
Register the GL Context for WASM Video Decoder by informing ElementaryMediaTrack about current graphics context:
video_track_.RegisterCurrentGraphicsContext();
Implementing the Rendering Loop
To implement the WASM Video Decoder rendering loop:
Request the video texture fill.
The decoding loop that fills the texture with a decoded video frame can be started after OnTrackOpen event is received or when the HTMLMediaElement::Play callback is called.
When the texture is filled with the video frame, draw it:
void VideoDecoderTrackDataPump::RequestNewVideoTexture() {
video_track_.FillTextureWithNextFrame(
texture_, [this](samsung::wasm::OperationResult result) {
if (result != samsung::wasm::OperationResult::kSuccess) {
std::cout << "Filling texture with next frame failed" << std::endl;
return;
}
Draw();
});
}
Draw the texture.
Like in any C++ application, you need to provide a rendering loop.
In the WASM Video Decoder application, the loop is created with the cycle illustrated in the following image:
Define a global callback function for emscripten_request_animation_frame:
int CAPIOnDrawTextureCompleted(double /* time */, void* thiz) {
if (thiz)
static_cast<VideoDecoderTrackDataPump*>(thiz)->OnDrawCompleted();
return 0;
}
Recycle the video picture
It is important to always recycle the video picture after it has been drawn.
To do so, call the RecycleTexture method in the emscripten_request_animation_frame callback:
When rendering must be stopped, end the rendering loop.
To properly end a rendering loop, the application needs to handle ElementaryMediaTrack::FillTextureWithNextFrame errors, such as OperationResult::kAlreadyDestroyed when a track
was stopped before calling this method or OperationResult::kAborted when a track was stopped after calling this method.
Before invalidating the pointer that has already been provided to the emscripten_request_animation_frame callback, abort that callback withemscripten_cancel_animation_frame, by providing the callback ID returned by the emscripten_request_animation_frame method.
Manage Your Cookies
We use cookies to improve your experience on our website and to show you relevant
advertising. Manage you settings for our cookies below.
Essential Cookies
These cookies are essential as they enable you to move around the website. This
category cannot be disabled.
Company
Domain
Samsung Electronics
.samsungdeveloperconference.com
Analytical/Performance Cookies
These cookies collect information about how you use our website. for example which
pages you visit most often. All information these cookies collect is used to improve
how the website works.
Company
Domain
LinkedIn
.linkedin.com
Meta (formerly Facebook)
.samsungdeveloperconference.com
Google Inc.
.samsungdeveloperconference.com
Functionality Cookies
These cookies allow our website to remember choices you make (such as your user name, language or the region your are in) and
tailor the website to provide enhanced features and content for you.
Company
Domain
LinkedIn
.ads.linkedin.com, .linkedin.com
Advertising Cookies
These cookies gather information about your browser habits. They remember that
you've visited our website and share this information with other organizations such
as advertisers.
Company
Domain
LinkedIn
.linkedin.com
Meta (formerly Facebook)
.samsungdeveloperconference.com
Google Inc.
.samsungdeveloperconference.com
Preferences Submitted
You have successfully updated your cookie preferences.