функция facebook «xyz набирает»?

Question

Есть ли какие-либо идеи о том, как сделать функцию Facebook используемой в чате, где, когда вы начинаете вводить ее, отображается на экране пользователя?

У меня есть полный рабочий чат, основанный на идентификаторе пользователя, но не подходящий для этого. Чат работает с использованием JSON, php и ajax.

Answer 1

Это на самом деле довольно просто особенность, чтобы добавить к чат. Сначала вам понадобится место для хранения информации для ввода. Обычно я просто храню его в базе данных. 1 для печатает, и 0 для нет. Вы захотите использовать интеллектуальную настройку, чтобы при вводе только одного запроса было отправлено, чтобы показать, что вы печатаете, а не каждый раз, когда вы нажимаете клавишу. У меня есть мой настроить с помощью таймера так что, когда пользователь прекращает печатать на 2000 миллисекунд, то настройки для этого разговора типирование установлено в 0

моего сценария выглядит следующим образом:

var typing = false, 
    shift = false, 
    timer; 
$(".chatText").unbind('keyup keypress blur').keypress(function (e) { 
    if (e.keyCode == 13) { 
     if (e.shiftKey !== true) { 
      shift = true; 
      return false; 
     } 
    } 
}).bind('keyup', function() { 
    if (shift) { 
     Connect.messages.send(id, to); 
     Connect.type(id, 0); 
     shift = false; 
    } else { 
     clearTimeout(timer); 
     if ($(this).val().length > 0) { 
      if (!typing) { 
       Connect.type(id, 1); 
      } 
      timer = setTimeout(function() { 
       Connect.type(id, 0); 
      }, 2000); 
     } 
     if ($(this).val().length == 0) { 
      Connect.type(id, 0); 
     } 
    } 
}).blur(function() { 
    Connect.type(id, 0); 
}); 

Connect.type функция:

type: function (id, t) { 
    if ((t == 0 && typing) || (t == 1 && !typing)) { 
     $$.connect.staticRec(btoa($$.TRANS.d("L2FqYXgvdHlwZS5waHA/aWQ9") + id + $$.TRANS.d("JlNFVD0=") + t)); //ajax/type.php?id={id}&SET={t} 
    } 
    if (t) { 
     typing = true 
    } 
    else typing = false; 
} 

ajax/type.php:

<?php 
    require "connect.php"; 
    require "user.php"; 

    $number = $data['number']; 
    $id = escape($_GET['id']); 

    if (strlen($id) < 4 OR strlen($id) > 6 OR (int)$_GET['SET'] > 1) exit(); 

    $FOTQ = $mysqli->query("SELECT `from` FROM `typing` WHERE `id`='$id'")->fetch_assoc(); //from or to query 
    $FOT = ($FOTQ['from'] == $number ? 'from' : 'to') . 'typing'; 

    $type = escape($_GET['SET']); 

    $mysqli->query("UPDATE `typing` SET `$FOT`='$type' WHERE `id`='$id'"); 
?> 

Информирование пользователя с помощью сервера, отправленная Events (примечание: моя собственная функция SSE):

var $id = $(this).data("id"); 
var item = $(".messageBox[data-id='" + $id + "']"); 
item.data("orgName", item.children("name").text()); 
$$.connect.live.create({ 
    url: $$.TRANS.e("/ajax/typing/" + $id), 
    message: function (e) { 
     item = $(".messageBox[data-id='" + item.data("id") + "']"); 
     if (e.data == "1") { 
      var name = item.children("name").text(); 
      var firstName = name.split(" ")[0]; 
      var hasName = name.match(/[0-9]/) ? "User" : firstName; 
      item.children("name").html(hasName + "..is typing"); 
     } 
     if (e.data == "0") { 
      item.children("name").text(item.data("orgName")); 
     } 
    }, 
    duration: 2500 
}, "typing", false); 

Мои typing.php для сервера-Sent Event:

<?php 
    require "connect.php"; 
    require "user.php"; 

    header("Content-Type: text/event-stream\n\n"); 
    header('Cache-Control: no-cache'); 

    set_time_limit(1200); 

    $id = escape($_GET['id']); 
    $number = $data['number']; 
    $ms = 100; 
    $tS = 0; //type stat 

    while (1) { 
     $FOTQ = $mysqli->query("SELECT * FROM `typing` WHERE `id`='$id'")->fetch_assoc(); //from or to query 
     $cts = $FOTQ[($FOTQ['from'] == $number ? 'to' : 'from') . 'typing']; //current type stat 

     if ($tS != $cts) { 
      echo "data:" . $cts; 
      echo "\n\n"; 
      $tS = 1; 
     } 

     echo "\n\n"; 

     ob_flush(); 
     flush(); 
     usleep($ms * 1000); 
    } 
?> 

Я использую сервера-Sent Events. Это позволяет мне поддерживать открытое соединение с сервером.

ПРИМЕЧАНИЕ. Мои навыки PHP - это Meh.

Но, надеюсь, это даст вам представление.

Answer 2

Pseduo код

OnKeyDown или KeyUp, установите «печатает», установить тайм-аут (функция «не печатать», некоторое количество времени)