📖 Documentation

Implementation with Vanilla Js

  • 🚨 RsiInterpretationPlayer must be imported before rsiSubtitles.

    • RsiSubtitles cannot work without the widget RsinterpretationPlayer

  • 🚨 In order to use the widget subtitles you must add as parameter of RsiInterpretationPlayer data-has-subtitles to be true.

<!-- 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-position-menu="bottom"
  data-is-box-shadow="true"
  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>
  const component = document.querySelector('#akkadu-interpretation-player')
  component.addEventListener('onReady', function (e) { 
    console.info('received onReady event for subtitles:', e.detail.isReady);
  });
</script>

<!-- 🚨 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>