🚀 Quick Implementation
We made a simple version of our interpretation-player
that doesn't require you to listen to our events. In this version we will control your video-player
for you. We have Quick Implementations for Vue, React and Vanilla Javascript. Below is an example of the Vanilla Javascript
quick implementation:
Simultaneous Interpretation (SI)
<!-- stylesheet -->
<link rel="stylesheet" href="https://akkadu-assets.s3.amazonaws.com/akkadu-rsi-widget/rsi-vanilla/1.0.62/interpretation-player.min.css" />
<!-- Component -->
<div
id="akkadu-interpretation-player"
data-sdk-key="your_sdk_key"
data-room-name="your_room_name"
data-is-player-controlled="true">
</div>
<!-- 🚨 Script must be loaded after the component -->
<script src="https://akkadu-assets.s3.amazonaws.com/akkadu-rsi-widget/rsi-vanilla/1.0.62/interpretation-player.min.js" ></script>
You will simply need to add as data attributes:
- Your key as
data-sdk-key
data-is-player-controlled
to true, more props- Your
data-room-name
SI + AI Recognized Subtitles
<!-- stylesheet -->
<link rel="stylesheet" href="https://akkadu-assets.s3.amazonaws.com/akkadu-rsi-widget/rsi-vanilla/1.0.62/interpretation-player.min.css" />
<link rel="stylesheet" href="https://akkadu-assets.s3.amazonaws.com/akkadu-rsi-widget/rsi-vanilla/1.0.62/rsi-subtitles.min.css" />
<!-- Component -->
<div
id="akkadu-interpretation-player"
data-sdk-key="your_sdk_key"
data-room-name="your_room_name"
data-is-player-controlled="true"
data-has-subtitles="true">
</div>
<div
id="akkadu-rsi-subtitles"
data-sdk-key="your_sdk_key"
data-room-name="your_room_name">
</div>
<!-- 🚨 Script must be loaded after the component -->
<script src="https://akkadu-assets.s3.amazonaws.com/akkadu-rsi-widget/rsi-vanilla/1.0.62/interpretation-player.min.js" ></script>
<script src="https://akkadu-assets.s3.amazonaws.com/akkadu-rsi-widget/rsi-vanilla/1.0.62/rsi-subtitles.min.js" ></script>
For the AI Subtitles you need to add one extra div with the following data attributes, remember to add one extra attribute to the interpretation player data-has-subtitles="true"
for the AI Subtitles to work properly.
- Your key as
data-sdk-key
- Your
data-room-name