teyuto-react-player Github

TeyutoPlayer is a React library that allows you to embed a Teyuto video player in a React app.

Installation

Install TeyutoPlayerSdk:

npm i @teyuto/react-player

Usage

import React, { useState, useRef } from 'react';
import TeyutoPlayer from '@teyuto/react-player';

const App = () => {
  const [setCurrentTime] = useState(0);
  const [setVolume] = useState(0);
  const teyutoPlayerRef = useRef(null);

  const obj = {
    channel: '<CHANNEL_PUBLIC>', //required
    id: '<VIDEO_ID>',  //required
    options: {
      autoplay: 'on',
      muted: 'off',
      controls: 'on',
      playbackRates: 'on',
      qualitySelector: 'on',
      playerColor: '#dddddd',
      loop: 'off',
      captions: 'on',
      seekButtons: 'off',
      lowLatency: 'off',
      token: 'your_api_token'
    }
  };

  const handlePlay = () => {
    console.log('Video started playing');
  };

  const handlePause = () => {
    console.log('Video paused');
  };

  return (
    <div>
      <TeyutoPlayer
        ref={teyutoPlayerRef}
        posElem="#player-container"
        obj={obj}
        onPlay={handlePlay}
        onPause={handlePause}
      />
      <div id="player-container"></div>
      <button onClick={() => teyutoPlayerRef.current.play()}>Play</button>
      <button onClick={() => teyutoPlayerRef.current.pause()}>Pause</button>
      <button onClick={() => teyutoPlayerRef.current.setVolume(0)}>Mute</button>
      <button onClick={() => teyutoPlayerRef.current.setVolume(1)}>Unmute</button>
      <button onClick={() => alert(teyutoPlayerRef.current.getCurrentTime())}>GetCurrentTime</button>
      <button onClick={() => alert(teyutoPlayerRef.current.getVolume())}>GetVolume</button>
      <button onClick={() => teyutoPlayerRef.current.setCurrentTime(15)}>SetCurrentTime (15 seconds)</button>
      <button onClick={() => teyutoPlayerRef.current.setVolume(0.5)}>SetVolume (0.5)</button>
    </div>
  );
}

export default App;

Replace <VIDEO_ID> with your Teyuto video ID Replace <CHANNEL_PUBLIC> with your Channel (public)