JSFiddle - React, Tailwind, and code Playground

by bistri

HTML

<script src="https://localapi.bistri.com/bistri.conference-3.2.1.js"></script>
    <input type="file" id="file_transfert">
	<a id="download" href="">Download file</a>

JavaScript

var room;
var members;
var localStream;

onBistriConferenceReady = function ()
{
    document.querySelector ( "#file_transfert" ).addEventListener ( 'change', function ( event )
	{
		members.forEach ( function ( member )
		{
			bc.sendFile ( member.id, room, event.target.files[ 0 ] );
		} );
    }, false );

    bc.init ( {
        "appId": "38077edb",
        "appKey": "4f304359baa6d0fd1f9106aaeb116f33",
        "debug": true
    } );

    bc.files.bind ( "onFileSent", function ( id )
	{
        console.log ( "onFileSent", id );
    } );
	
    bc.files.bind ( "onFileTransferWaiting", function ( pid, info )
	{
        console.log ( "onFileTransferWaiting", pid, info );
    } );

    bc.files.bind ( "onFileTransferAborted", function ()
	{
        console.log ( "onFileTransferAborted", arguments );
    } );
	
    bc.files.bind ( "onFileTransferProgress", function ( id, percent )
	{
        console.log ( "onFileTransferProgress", id, percent );
    } );
	
    bc.files.bind ( "onFileTransferBitrate", function ( id, bitrate )
	{
        console.log ( "bitrate", bitrate );
    } );
	
    bc.files.bind ( "onNewFileTransfer", function ( id, info, answer )
	{
        console.log ( "onNewFileTransfer", info, answer )
		
		answer.ok ();
    } );
	
    bc.files.bind ( "onFileReceived", function ( id, info )
	{
		var anchor = document.querySelector ( "#download" ); 
		
		anchor.href = info.url;
		anchor.download = info.name;
		
        console.log ( "onFileReceived", id, info );
    } );
	
    bc.signaling.bind ( "onJoinedRoom", function ( data )
	{
		members = data.members;
        console.log( "join room", data )
    } );

    bc.signaling.bind ( "onConnected", function ()
	{
		bc.joinRoom ( "uneroom" );
    } );

    bc.connect ();
}