oleg
/
peerjs


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
							<!DOCTYPE HTML> 
<html lang="en"> 
<head>
<title>PeerJS Hello World Code Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<meta http-equiv="Content-Language" content="en-us"> 

<script>
  // Just for demo.
  console._log = console.log;
  console.error = console.log = function() {
    var copy = Array.prototype.slice.call(arguments).join(' ');
    $('.log').append(copy + '<br>');
    console._log(copy);
  };
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script type="text/javascript" src="../dist/peer.js"></script>
<script>
  // This is a very simple code example. See chat.html for a more involved
  // example.

  $(document).ready(function() {
    var peer1, peer2, peerId1;

    // Create a new Peer with our demo API key, with debug set to true so we can
    // see what's going on.
    peer1 = new Peer({ key: 'lwjd5qra8257b9', debug: true });
    // Create another Peer with our demo API key to connect to.
    peer2 = new Peer({ key: 'lwjd5qra8257b9', debug: true });

    // The `open` event signifies that the Peer is ready to connect with other
    // Peers and, if we didn't provide the Peer with an ID, that an ID has been
    // assigned by the server.
    peer1.on('open', function(id){
      peerId1 = id;

      var c = peer2.connect(peerId1);
      c.on('data', function(data) {
        // When we receive 'Hello', send ' world'.
        $('#helloworld').append(data);
        c.send(' peer');
      });
    });

    // Wait for a connection from the second peer.
    peer1.on('connection', function(connection) {
      // This `connection` is a DataConnection object with which we can send
      // data.
      // The `open` event firing means that the connection is now ready to
      // transmit data.
      connection.on('open', function() {
        // Send 'Hello' on the connection.
        connection.send('Hello,');
      });
      // The `data` event is fired when data is received on the connection.
      connection.on('data', function(data) {
        // Append the data to body.
        $('#helloworld').append(data);
      });
    });

    // Show browser version
    $('#browsers').text(navigator.userAgent);
  });


</script>
<style>
  #helloworld {
    font-weight: 600;
    font-size: 30px;
    padding: 20px;
    background-color: #4dace2;
    border: 1px solid #0C6BA1;
    max-width: 600px;
  }
  #browsers {
    font-weight: 600;
  }
  .warning {
    max-width: 600px;
    padding: 20px;
    background-color: #eee;
    border: 1px solid #ccc;
    font-size: 18px;
  }
  .browserinfo {
    padding: 20px;
    border: 1px solid #ccc;
    background-color: #f8f8f8;
  }
  a {
    font-weight: 600;
  }
</style>
</head> 
 
<body> 
  <a href="https://github.com/peers/peerjs"><img style="position: absolute; top: 0; right: 0; border: 0;"
    src="https://s3.amazonaws.com/github/ribbons/forkme_right_orange_ff7600.png"
    alt="Fork me on GitHub"></a>
  <div id="helloworld"></div>
  <div class="warning browser"><div class="important">
      Good news! If you can see the text in the blue box above, your Chrome is up to
      date (version 26) and you can now use WebRTC P2P
      DataChannels.
      <br>
      Open up your Chrome inspector to see what's going on under the hood.
      <br><br>
      Not cool enough? Try out <a
        href="http://cdn.peerjs.com/demo/chat.html">a chat demo</a>
      with a friend.
      <br>
      This demo was built with <a href="http://peerjs.com">PeerJS.</a><br><br>
      <div class="browserinfo">
      Your browser version: <span id="browsers"></span><br>
  Currently <strong>Firefox 22+ and Google Chrome 26.0.1403.0 or above</strong> is
  required.</strong></div><br>For more up to date compatibility
information see <a href="http://peerjs.com/status">PeerJS WebRTC
  Status</a><br>Note that this demo may also fail if you are behind
stringent firewalls.</div></div>
<div class="log" style="color:#FF7500;text-shadow:none;padding:15px;"><strong>Connection status</strong>:<br></div>
</body> 
</html>