2014-11-11 5 views
1

Я плохо разбираюсь в английском, но я пытаюсь объяснить свою проблему. Я использую PeerJS, чтобы сделать звонок между пользователями. И я использую этот пример: http://cdn.peerjs.com/demo/videochat и это работа. Но я хочу добавить ответ или не ответить пользователю в этом скрипте. Как я могу это сделать? Это мой сценарий:Добавить ответ на скрипт peerJS

<html> 
<head> 
    <title>PeerJS - Video chat example</title> 
    <link rel="stylesheet" href="style.css"> 
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" rel="stylesheet"> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script> 
    <script type="text/javascript" src="./jquery.confirm.js"></script> 

    <script src="./peer.min.js"></script> 
    <script> 

    // Compatibility shim 
    navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia; 

    // PeerJS object 
    var peer = new Peer({ key: 'lwjd5qra8257b9', debug: 3}); 

    peer.on('open', function(){ 
     $('#my-id').text(peer.id); 
    }); 

    // Receiving a call 
    peer.on('call', function(call){ 
     // Answer the call automatically (instead of prompting user) for demo purposes 

     //here is Ansswer 

     call.answer(window.localStream); 
     step3(call); 

    }); 
    peer.on('error', function(err){ 
     alert(err.message); 
     // Return to step 2 if error occurs 
     step2(); 
    }); 

    // Click handlers setup 
    $(function(){ 
     $('#make-call').click(function(){ 
     // Initiate a call! 
     var call = peer.call($('#callto-id').val(), window.localStream); 

     step3(call); 
     }); 

     $('#end-call').click(function(){ 
     window.existingCall.close(); 
     step2(); 
     }); 

     // Retry if getUserMedia fails 
     $('#step1-retry').click(function(){ 
     $('#step1-error').hide(); 
     step1(); 
     }); 

     // Get things started 
     step1(); 
    }); 

    function step1() { 
     // Get audio/video stream 
     navigator.getUserMedia({audio: true, video: false}, function(stream){ 
     // Set your video displays 
     $('#my-video').prop('src', URL.createObjectURL(stream)); 

     window.localStream = stream; 
     step2(); 
     }, function(){ $('#step1-error').show(); }); 
    } 

    function step2() { 
     $('#step1, #step3').hide(); 
     $('#step2').show(); 
    } 

    function step3 (call) { 
     // Hang up on an existing call if present 
     if (window.existingCall) { 
     window.existingCall.close(); 
     } 

     // Wait for stream on the call, then set peer video display 
     call.on('stream', function(stream){ 
     $('#their-video').prop('src', URL.createObjectURL(stream)); 
     }); 

     // UI stuff 
     window.existingCall = call; 
     $('#their-id').text(call.peer); 
     call.on('close', step2); 
     $('#step1, #step2').hide(); 
     $('#step3').show(); 
    } 

    </script> 

    <style> 
    .pure-g { 
     width: 350px; 
     margin: auto; 
    } 
    .pure-u-1-3{ 
     width: 100%; 
    } 
    </style> 

</head> 

<body> 

    <div class="pure-g"> 
     <!-- Video area --> 
     <div class="pure-u-2-3" id="video-container" style='display: none'> 
     <video id="their-video" autoplay></video> 
     </div> 

     <!-- Steps --> 
     <div class="pure-u-1-3"> 
     <h2>SMA Voice Chat</h2> 

     <!-- Get local audio/video stream --> 
     <div id="step1"> 
      <p>Please click `allow` on the top of the screen so we can access your webcam and microphone for calls.</p> 
      <div id="step1-error"> 
      <p>Failed to access the webcam and microphone. Make sure to run this demo on an http server and click allow when asked for permission by the browser.</p> 
      <a href="#" class="pure-button pure-button-error" id="step1-retry">Try again</a> 
      </div> 
     </div> 

     <!-- Make calls to others --> 
     <div id="step2"> 
      <p>Your id: <span id="my-id">...</span></p> 
      <p>Share this id with others so they can call you.</p> 
      <h3>Make a call</h3> 
      <div class="pure-form"> 
      <input type="text" placeholder="Call user id..." id="callto-id"> 
      <a href="#" class="pure-button pure-button-success" id="make-call">Call</a> 
      </div> 
     </div> 

     <!-- Call in progress --> 
     <div id="step3"> 
      <p>Currently in call with <span id="their-id">...</span></p> 
      <p><a href="#" class="pure-button pure-button-error" id="end-call">End call</a></p> 
     </div> 
     </div> 
    </div> 

<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script> 
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script> 

</body> 
</html> 

Любая идея?

+0

помогите мне пожалуйста. – user3231235

+0

Был ли приведенный ниже ответ для u без ошибок? потому что, когда я пытался, чтобы он не показывал мне никаких уведомлений. – Zammuuz

+0

да, это работает со мной. – user3231235

ответ

0

Я не знаком с PeerJS, но я думаю, что вы можете попытаться переписать peer.on('call',...) часть следующим образом:

peer.on('call', function(call){ 
    $.confirm({ 
    text: "Receive a call?", 
    confirm: function(button) { 
     //user clicked "ok" 
     call.answer(window.localStream); 
     step3(call); 
    }, 
    cancel: function(button) { 
     //user clicked "cancel" 
    } 
    }); 
}); 
+0

Большое спасибо – user3231235

Смежные вопросы