Socket.io comment faire pour vérifier si l'utilisateur est en train de taper et de les diffuser à d'autres utilisateurs

J'essaye de configurer la prise.io serveur de chat. J'ai eu jusqu'à envoyer et recevoir des messages à partir du serveur et du client. Je me suis intéressé à montrer aux utilisateurs si quelqu'un est en train de taper. Je sais que je peux émettre lors de certains est de taper du client vers le serveur, je peux aussi la diffuser à d'autres utilisateurs. Mais il sera efficace que sur tous les keyup? Comment gérer une telle situation? Ci-dessous mon code pour l'instant:

$("#textbox").keyup(function (e)  {
 if (e.keyCode == 13)  {
  socket.emit('send', {nickname: $('#nickname').val() , msg: $("#textbox").val()});
      $('#textbox').val('');  }
 else{
  socket.emit('is typing',  {nickname: $('#nickname').val()});
     }
});

et sur le côté serveur:

socket.on('is typing', function(data){
 socket.broadcast.emit('typing', {nickname: data.nickname});
});

OriginalL'auteur Yalamber | 2013-05-27

  1. 18

    Vous pouvez utiliser délais d'attente pour envoyer des "commencé à taper" et "arrêté de taper" des messages, comme suit:

    var typing = false;
var timeout = undefined;

function timeoutFunction(){
  typing = false;
  socket.emit(noLongerTypingMessage);
}

function onKeyDownNotEnter(){
  if(typing == false) {
    typing = true
    socket.emit(typingMessage);
    timeout = setTimeout(timeoutFunction, 5000);
  } else {
    clearTimeout(timeout);
    timeout = setTimeout(timeoutFunction, 5000);
  }

}

    C'est rude, mais vous devriez obtenir l'idée.

    OriginalL'auteur abject_error

  2. 1

    Juste ajouter mon code ici en suivant ce tutoriel: https://www.youtube.com/watch?v=FvArk8-qgCk&index=5&list=PL4cUxeGkcC9i4V-_ZVwLmOusj8YAUhj_9

    //Make connection
var socket = io.connect('http://localhost:4000');
var timeout
//Query DOM
var message = document.getElementById('message'),
      handle = document.getElementById('handle'),
      btn = document.getElementById('send'),
      output = document.getElementById('output'),
      feedback = document.getElementById('feedback');

//Emit events
btn.addEventListener('click', function(){
    socket.emit('chat', {
        message: message.value,
        handle: handle.value
    });
    message.value = "";
});

function timeoutFunction() {
  socket.emit("typing", false);
}

message.addEventListener('keyup',function(){
 socket.emit('typing', handle.value);
 clearTimeout(timeout)
 timeout = setTimeout(timeoutFunction, 2000)
})


//Listen for events
socket.on('chat', function(data){
    feedback.innerHTML = '';
    output.innerHTML += '<p><strong>' + data.handle + ': </strong>' + data.message + '</p>';
});

socket.on('typing', function(data){
    if (data) {
      feedback.innerHTML = '<p><em>' + data + ' is typing...</em></p>';
    } else {
      feedback.innerHTML = ''
    }
});

    Notez qu'elle n'a pas besoin de le taper variable booléenne

    OriginalL'auteur Hans Tausend

  3. 0
       function typingtimeoutFunction (){                 

      socket.emit('typingMessage', 'stopped typing');    
    },

    onKeyDownNotEnter: function (){
         clearTimeout(this.typingtimeout);
         socket.emit('typingMessage', 'istyping');
        this.typingtimeout = setTimeout(function() {ajaxChat.typingtimeoutFunction();}, 5000);      
    },

    OriginalL'auteur ingridsede

  4. 0

    Juste pensé que je voudrais ajouter ma variation sur le très utiles réponse donnée par abject_error. Cela permet pour le statut de frappe ainsi que de l'arrêté de taper, mais le message a été entré. Je ne suis pas à l'aide d'une douille.io, mais vous obtenez l'idée.

    var typingStatus=0; //0=Not typing: message blank, 1=typing, 2=typing: something there
var typingStatus_timeout = undefined;

//called when timeout kicks in that we've stopped typing
function function_typingStatus_timeout(){
    //message entered
    if ($('#chat_message').val().trim()) {
        typingStatus=2;
    //message is blank
    } else {
        typingStatus=0;
    }
    //send new status
    connection.send(JSON.stringify({
        action:'typingStatus',
        typingStatus:typingStatus,
    }));
}

$(document).ready(function(){
    //TYPING
    $('#chat_message').keydown(function(e) {
        //only record typing if enter not pressed
        if(e.which!=13 && e.keyCode!=13) {
            //weren't typing before but are now
            if (typingStatus!=1) {
                //switch to 1 for in progress
                typingStatus=1;
                //broadcast
                connection.send(JSON.stringify({
                    action:'typingStatus',
                    typingStatus:typingStatus,
                }));        
            //were typing before and still are, clear the timeout, we're going to reset it in the next step
            } else {
                clearTimeout(typingStatus_timeout);
            }
            //either way, set the timeout to trigger after a second of not typing
            typingStatus_timeout=setTimeout(function_typingStatus_timeout,1000);

        //if enter was pressed we want to not have it register as a keydown at all.  there's a separate function on keyup that looks for enter being pressed and sends the message
        } else {
            e.preventDefault();
        }
    });
});

    OriginalL'auteur rgbflawed