0.2.0 • Published 3 years ago

use-player v0.2.0

Weekly downloads
3
License
MIT
Repository
-
Last release
3 years ago

Use Dacast Player

React hook for Dacast Video Player.

Commands

npm i use-player

Usage

import * as React from 'react';
import { usePlayer } from 'use-player';
const App = () => {

  let playerRef = React.useRef(null);
  let playerOptions = {
    autoplay: false, // default
    provider: 'universe', // default
  };
  usePlayer(playerRef, 'YOUR_CONTENT_ID_FROM_DACAST', playerOptions);

  return (
    <div ref={playerRef}></div>
  );
};

All player options

ParameterTypeOptionalDefaultDescription
providerOVPProviderNo'universe''vzaar', 'dacast', 'universe' or 'singularity'.
widthnumberYes100%Player width in pixels. Omit units.
heightnumberYes100%Player height in pixels. Omit units.
playerPlayerYes'theo''theo', 'vjs5' or 'jw'
jwUrlstringYes
hlsQualitiesstringYes
autoplayboolean | stringYesfalsePlay video once the player loads.
kioskModeboolean | stringYesfalseEnable Kiosk mode.
loopboolean | stringYesfalsePlay video on repeat mode.
playsinlineboolean | stringYes
startMuteboolean | stringYesfalseVideo starts muted.
brandTextstringYesnull
brandLinkstringYesnull
disableControlsbooleanYesfalseDisable the player control bar interaction.
hideFullscreenboolean | stringYesfalseHide the fullscreen control button.
adPreRollUrlstringYes
adMidRollUrlstringYes
adMidRollTimenumberYes
adPostRollUrlstringYes
showControlsForJSAdsboolean | stringYes
borderbooleanYesfalseShows a border line around the player.
colourAccentstringYesrgba(255, 255, 255, 0.4)The color in hexadecimal format of elements such as video progress bar, volume bar and options background.
colourBasestringYesrgba(155, 155, 155, 0.3)The theme main color in hexadecimal format, affects the player controls backgrounds.
colourSetstringYes
endTextstringYesnullText to appear once the video playback finishes.
endLinkstringYesnullLink to appear once the video playback finishes.
showPlayButtonboolean | stringYestrueShow or hide the big play button over the video. Doesn't hide the play/pause button on the control bar.
previewThumbsboolean | stringYestrueShow a preview image of the video when the mouse hovers the video progress bar.
preloadboolean | stringYesfalse
hideControlsboolean | stringYesfalseHides the control bar.
socialSharingstringYes
videoURLstringYesnull
setSubsBgboolean | stringYes
brandOverlayFSboolean | stringYesfalse
colourBgstringYesnull
playlistModestringYesnull
continuousPlayboolean | stringYesfalseWhether the next video in a playlist will be autplayed.
hideBufferingboolean | stringYesfalse
languagestringYes'en'ISO 639-1 language code for localization
skipButtonsTimenumberYes
objectFitCSSObjectFitCSSYes'fill''fill', 'contain', 'cover', 'none' or 'scale-down'.
hideMailCatcherbooleanYes
lightWeightbooleanYes
inplayertokenstringYes
referrerTokenstringYes
signedKeystringYes
subtitlesstringYes
relayGAEventsToParentbooleanYes
adsAds | OldAdsNo
themeThemeInfoNo

Example

https://codepen.io/turizoft/pen/RwoywBg

0.2.0

3 years ago

0.1.66

3 years ago

0.1.512

3 years ago

0.1.6

3 years ago

0.1.1

4 years ago

0.1.0

4 years ago