@globocom/clappr-detach-plugin v0.4.7

clappr-detach-plugin

Note: this plugin was previously called clappr-detach-plugin, but has changed to @globocom/clappr-detach-plugin.

A Clappr plugin to detach the video.

This project is a fork from https://github.com/team-767/clappr-detach-plugin. We took a different approach that was done in that project.

Installation

npm install -S @globocom/clappr-detach-plugin

Usage

To init the plugin you have to pass it the Clappr object. See bellow the compatibility between this plugin and Clappr versions.

import Clappr from 'clappr'
import initClapprDetachPlugin from '@globocom/clappr-detach-plugin'

const detachPlugin = initClapprDetachPlugin(Clappr)

We did it this way so the plugin will receive the dependency and doesn't have to install it.

Full example:

import Clappr from 'clappr'
import initClapprDetachPlugin from '@globocom/clappr-detach-plugin'

const player = new Clappr.Player({
  source: 'http://www.sample-videos.com/video/mp4/480/big_buck_bunny_480p_5mb.mp4',
  plugins: {
    'core': [initClapprDetachPlugin(Clappr)]
  }
})

This plugin exposes the public methods attach and detach that you can call with:

player.getPlugin('detach').detach()
player.getPlugin('detach').attach()

Or using the player configure method:

player.configure({ isDetached: true })
player.configure({ isDetached: false })

Options

import Clappr from 'clappr'
import initClapprDetachPlugin from '@globocom/clappr-detach-plugin'

const player = new Clappr.Player({
  source: 'http://www.sample-videos.com/video/mp4/480/big_buck_bunny_480p_5mb.mp4',
  plugins: {
    'core': [initClapprDetachPlugin(Clappr)]
  },
  // these are the default values
  detachOptions: {
    dragEnabled: true,
    height: 180,
    isDetached: false,
    onAttach: () => { },
    onDetach: () => { }
    opacity: 1,
    orientation: 'bottom-right',
    position: {
      bottom: 10,
      right: 10,
    },
    width: 320,
  }
})

Compatibility

This table doesn't mean that other versions won't work together.

It does means that we are sure that these versions work together.