JSFiddle - React, Tailwind, and code Playground

by evankennedy

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/peerjs/0.3.14/peer.min.js"></script>

JavaScript

var js = document.createElement("script");

js.onload = start;
js.type = 'text/javascript';
js.src = 'https://cdnjs.cloudflare.com/ajax/libs/peerjs/0.3.14/peer.min.js';
document.body.appendChild(js);

function start() {
// Compatibility shim
    navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

    // PeerJS object
    var peer = new Peer({
    	host: '52.38.106.219',
      port: 9000,
      path: '/app',
      secure: true,
    	debug: 3,
    	config: {
    		iceServers: [
    			{ url: 'stun:stun.l.google.com:19302' }
    		]
    	}
    });

    peer.on('open', function() {
    	console.log('peer id', peer.id);
    	
		var sock = new WebSocket('ws://52.38.106.219:3434');
		
		sock.onmessage = function(message) {
			var id = message.data;
			console.log('id connected', id);
			if(id != peer.id) call(id);
		};
		
		sock.onopen = function(event) {
			sock.send(peer.id);
		};
    });

    // Receiving a call
    peer.on('call', function(call){
		call.answer(window.localStream);
		play(call);
    });
    
    peer.on('error', console.error.bind(console));
    
    function call(id) {
    	play(peer.call(id, window.localStream));
    }

    navigator.getUserMedia({ audio: true, video: false }, function(stream) {
        window.localStream = stream;
    }, console.error.bind(console));

    function play(call) {
		call.on('stream', function(stream){
			var audio = new Audio(URL.createObjectURL(stream));
			audio.play();
		});
    }
}