❤
npm
Sign UpSign In

@webtor/embed-sdk-js

0.2.17 • Public • Published

embed-sdk-js

Webtor.io SDK for online torrent streaming/downloading on your site

Features

  • Supports magnet-uri and external torrent-files
  • Supports video (avi, mkv, mp4, m4v) with subtitles (vtt, srt)
  • Supports download torrent as zip-archive
  • No additional plugins/extensions required

Basic usage

Generates embed for video player:

<video controls src="magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel"></video>
<script src="https://cdn.jsdelivr.net/npm/@webtor/embed-sdk-js/dist/index.min.js" charset="utf-8" async></script>

Generates embed for video player with subtitle tracks, poster, custom title and width:

<video controls src="magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel" poster="https://via.placeholder.com/150/0000FF/808080" width="100%" data-title="Sintel">
    <track srclang="en" label="test" default src="https://raw.githubusercontent.com/andreyvit/subtitle-tools/master/sample.srt">
</video>
<script src="https://cdn.jsdelivr.net/npm/@webtor/embed-sdk-js/dist/index.min.js" charset="utf-8" async></script>

Video element is replaced by wrapper div in this scenarios.

Generate embed to download full torrent as zip-archive:

<a href="magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel" download>Please make sure that JavaScript is enabled</a>
<script src="https://cdn.jsdelivr.net/npm/@webtor/embed-sdk-js/dist/index.min.js" charset="utf-8" async></script>

Video element attributes (streaming)

Attribute Description
id ID of wrapper div
class Class of wrapper div
width Width of an iframe (might be any css width value: 800px, 100%, etc... 800px by default)
height Height of an iframe (might be any css width value: 800px, 100%, etc... optional)
src Magnet url or url to torrent file (required)
poster Url to the poster image (optional)
type Use application/x-bittorrent for torrent file url in case if it has no .torrent extension
controls Enables all player features
data-config Additional player configuration in JSON (see Player configuration)
data-* Set specific configuration value for a key (see Player configuration)

Anchor element attributes (download)

Attribute Description
id ID of wrapper div
class Class of wrapper div
href Magnet url or url to torrent file (required)
type Use application/x-bittorrent for torrent file url in case if it has no .torrent extension
controls Enables all player features
data-config Additional player configuration in JSON (see Player configuration)
data-* Set specific configuration value for a key (see Player configuration)

Advanced usage

Generates embed for video player:

    <div id="player" class="webtor" />
    <script>
        window.webtor = window.webtor || [];
        window.webtor.push({
            id: 'player',
            magnet: 'magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel&tr=udp%3A%2F%2Fexplodie.org%3A6969&tr=udp%3A%2F%2Ftracker.coppersurfer.tk%3A6969&tr=udp%3A%2F%2Ftracker.empire-js.us%3A1337&tr=udp%3A%2F%2Ftracker.leechers-paradise.org%3A6969&tr=udp%3A%2F%2Ftracker.opentrackr.org%3A1337&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2F',
            on: function(e) {
                if (e.name == window.webtor.TORRENT_FETCHED) {
                    console.log('Torrent fetched!', e.data);
                }
                if (e.name == window.webtor.TORRENT_ERROR) {
                    console.log('Torrent error!');
                }
            },
            poster: 'https://via.placeholder.com/150/0000FF/808080',
            subtitles: [
                {
                    srclang: 'en',
                    label: 'test',
                    src: 'https://raw.githubusercontent.com/andreyvit/subtitle-tools/master/sample.srt',
                    default: true,
                }
            ],
            lang: 'en',
            i18n: {
                en: {
                    common: {
                        "prepare to play": "Preparing Video Stream... Please Wait...",
                    },
                    stat: {
                        "seeding": "Seeding",
                        "waiting": "Client initialization",
                        "waiting for peers": "Waiting for peers",
                        "from": "from",
                    },
                },
            },
        });
    </script>
    <script src="https://cdn.jsdelivr.net/npm/@webtor/embed-sdk-js/dist/index.min.js" charset="utf-8" async></script>

Here is live example

Generate embed to download full torrent as zip-archive:

    <div id="download" />
    <script>
        window.webtor = window.webtor || [];
        window.webtor.push({
            id: 'download',
            mode: 'download',
            magnet: 'magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel&tr=udp%3A%2F%2Fexplodie.org%3A6969&tr=udp%3A%2F%2Ftracker.coppersurfer.tk%3A6969&tr=udp%3A%2F%2Ftracker.empire-js.us%3A1337&tr=udp%3A%2F%2Ftracker.leechers-paradise.org%3A6969&tr=udp%3A%2F%2Ftracker.opentrackr.org%3A1337&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2F',
        });
    </script>
    <script src="https://cdn.jsdelivr.net/npm/@webtor/embed-sdk-js/dist/index.min.js" charset="utf-8" async></script>

Embed configuration

Attribute Description
id Element id where player will be embedded
magnet Magnet URI (torrentUrl ot magnet is required)
width Width of an iframe (might be any css width value: 800px, 100%, etc... 800px by default)
height Height of an iframe (might be any css width value: 800px, 100%, etc... optional)
torrentUrl Url of the torrent-file (HTTP-server MUST include header "Access-Control-Allow-Origin: *" to allow torrent-file download on client-side)
mode Sets embed mode (video/download, default: video)
poster Url to the poster image (optional)
on Callback-function to capture player events (optional)
subtitles Array of subtitles (optional, see Subtitle configuration for more details)
title Replaces original file name in a header with specific title (optional)
imdbId Helps to find subtitles and additional metadata (example values 'tt0133093' or '0133093' or even '133093', optional)
header Shows header with current progress and title (true/false, default: true)
pwd Selected directory in torrent (optional)
file Selected file in torrent in selected directory (optional, by default selects first video file)
path Selected file by full file path in torrent, can be used instead of pwd and file (optional)
lang Override language (optional)
i18n Override i18n messages (optional)
controls Enables all features (true/false, default: true)
features Enables or disables specific player features (optional)

Subtitle configuration

Attribute Description
srclang Two-letter language code
label Subtitle label
src url to the subtitle src, could be vtt, srt and m3u8. It should be direct link to subtitle.
default If true this track will be selected by default (true/false, optional)

Player features

Name Description
title Displays movie title
p2pProgress Displays p2p progress
subtitles Enables subtitles control
captions Enables showing captions for subtitles
settings Enables settings control (cog)
fullscreen Enables fullscreen control
playpause Enables plays/pause control
currentTime Displays current time
timeline Enables timeline control
duration Displays total duration
volume Enables volume control
chromecast Enables chromecast support
browse Enables file browser menu
download Enables download button
embed Enables embed button

Player events

Event types:

Name Description
TORRENT_FETCHED Indicates that torrent has been fetched and also returns fetched torrent in data field
TORRENT_ERROR Indicates if some error has occured during loading (timeout, wrong url, etc...)
INITED Indicates if player can play content
OPEN Indicates that specific file in torrent was opened
PLAYER_STATUS Indicates current player status (see player statuses below)
CURRNET_TIME Indicates current player time
DURATION Indicates full content duration

Player statuses:

Name Description
PLAY The media is ready to start playing
PLAYING The media actually has started playing
PAUSE The media is paused either by the user or programmatically
ENDED The media has reach the end
SEEKING The seeking attribute is set to true indicating that seeking has started
SEEKED The seeking attribute is set to false indicating that seeking has ended
IDLE The player is ready fot the first play

Every event has following fields:

Name Description
name Name of the event
data Specific data for this event
player Player representation that can be used after initialization to control playback

Player methods:

Name Description
play Starts playback (available only after first play-click in the player)
pause Pauses playback (available only after first play-click in the player)
setPosition Sets player position in seconds (available only after first play-click in the player)
open Opens another file in torrent, full file-path should be provided

Dependencies (3)

Dev Dependencies (9)

Package Sidebar

Install

npm i @webtor/embed-sdk-js

Repository

github.com/webtor-io/embed-sdk-js

Homepage

webtor.io

Weekly Downloads

5

Version

0.2.17

License

MIT

Unpacked Size

133 kB

Total Files

6

Last publish

Collaborators

  • vintikzzzz
Try on RunKit
Report malware