Question

Is there a way to implement in chat “the other user is not typing” when his textarea is empty and “the other user is typing” when the textarea has at least one character?

First, I wanted to implement this “is typing” function by checking every 2 seconds if the user is pressing keys but i’ve realized it would slow the chat too too much. Is it a simple way to pull the info when the textarea is not empty (user is typing) and when empty- do nothing.

Thank you.

Answer 1

Send the “is typing” message on first keyup and use window.setTimeout to send the “not typing” message after 10 seconds or so. Cancel and reschedule the setTimeout on every keyup.

Untested example below:

var input = document.getElementById('typeeBox');
var isTyping = false;
var timeoutId = 0;

function stoppedTyping() {
    isTyping = false;
    // Send not typing message.
    // Update db status.
}

function startedTyping() {
    if (!isTyping) {
        // Send is typing message.
        // Update db status.
        isTyping = true;
        timeoutId = window.setTimeout(stoppedTyping, 10000);
    } else {
        window.clearTimeout(timeoutId);
        timeoutId = window.setTimeout(stoppedTyping, 10000);
    }
}

input.addEventListener('keyup', startedTyping, false);