Я играю с веб-сайтами Coldfusion 10 и делаю простой чат для тестирования. Я видел несколько чатов, где у них есть текст «пользователь печатает ...», который появляется, когда другой пользователь печатает. Кто-нибудь знает, как эффективно реализовать это?Coldfusion Websockets «Пользователь печатает ...» Функциональность
Создайте еще одно уведомление канала и опубликуйте в нем «Пользователь печатает», когда пользователь выполняет «keyDown» и «emptystring», когда «keyUp».
Подпишитесь на этот канал вместе с вами в чате. целью этого канала на стороне приемника должен быть внутренний html, который может быть заполнен сообщением «Пользователь вводит».
псевдокод:
<cfwebsocket name="notificationSocket"
onmessage="notifyHandler"
subscribeto="notificationChannel" >
<cfwebsocket name="ChatSocket"
onmessage="chatHandler"
subscribeto="chatChannel" >
<!-- Conversation displayer -->
<div id="messageBoard"></div>
<!-- your text message input area -->
<textarea onKeyDown="sayTyping()" onKeyUp="sayStopped()" id="chatInput"></textarea>
<div id="notifyArea"></div>
<input name="submit" onClick="publishMessage()"></textarea>
<script>
/*chat Functions*/
var publishMessage = function(){
var msg = document.getElementById('chatInput').value;
mycfwebsocketobject.publish("chatChannel", msg);
};
var chatHandler = function(msgObj){
document.getElementById('messageBoard').innerHTML += ColdFusion.JSON.encode(msgObj);
};
/*notifying Functions*/
var notifyHandler = function(noteObj){
document.getElementById('notifyArea').innerHTML = ColdFusion.JSON.encode(noteObj);
};
var sayTyping = function(){
mycfwebsocketobject.publish("notificationchannel","User is Typing...");
};
var sayStopped = function(){
mycfwebsocketobject.publish("notificationchannel","");
};
</script>
Еще одно усовершенствование будет иметь DIV уже с текстом «пользователь печатает» и ваш канал транслирует текст как «шоу» и «noshow». Это в основном имя класса, данное для показа и скрытия. Меньше трафика.
подход 2: Используя один и тот же канал
<cfwebsocket name="ChatSocket"
onmessage="chatHandler"
subscribeto="chatChannel" >
<!-- Conversation displayer -->
<div id="messageBoard"></div>
<!-- your text message input area -->
<textarea onKeyDown="sayTyping()" onKeyUp="sayStopped()" id="chatInput"></textarea>
<div id="notifyArea" class="no">User is typing...</div>
<input name="submit" onClick="publishMessage()"></textarea>
<script>
/*chat Functions*/
var publishMessage = function(){
var msg = document.getElementById('chatInput').value;
mycfwebsocketobject.publish("chatChannel", msg);
};
var chatHandler = function(msgObj){
var msg = ColdFusion.JSON.encode(msgObj);
if (msg == '@[email protected]'){
notifyHandler('yes');
}
else if (msg == '@[email protected]'){
notifyHandler('no');
}
else {
document.getElementById('messageBoard').innerHTML += msg;
}
};
/*notifying Functions*/
var notifyHandler = function(action){
document.getElementById('notifyArea').className = action;
/*call the notify handler with off to stop showing the user is typing message
after a certain interval of time. This is to avoid someone believing that
partner is still typing even when the connection is lost*/
if(action == 'on'){
setTimeout(function(){notifyHandler('no')},250);
}
};
var sayTyping = function(){
mycfwebsocketobject.publish("chatChannel","@[email protected]");
};
var sayStopped = function(){
mycfwebsocketobject.publish("chatChannel","@[email protected]");
};
</script>
<style>
.yes { display:block;}
.no { display:none;}
</style>
всегда можно обмануть этот код, введя сообщение как @ userTyping @ -да 'или' @ userTyping @ -нет. Но, как я уже сказал, это всего лишь ПОС. Кроме того, для тайм-аута, о котором вы упоминали, keyUp все равно позаботится об этом. Но вы также можете вызвать notifyHandler() с помощью setTimeout(), как показано выше.
Внутри Комментарии - вопрос о том, как фильтровать один на один обмен сообщениями. Вот пример кода для этого.
Вместо использования атрибута subscribeTo используйте функцию js, чтобы подписаться на пользователя и передать некоторые значения заголовков. Эти заголовки могут быть использованы в качестве фильтров на вызов с использованием публикации selector
Пример:
<cfwebsocket name="ChatSocket" onOpen="openHandler" onMessage="msgHandler" onError="errHandler">
<script>
function openHandler(){
//Subscribe to the channel, pass in headers for filtering later
ChatSocket.subscribe('chatChannel',{name: '#Session.Auth.FirstName#', UserID: '#Session.Auth.UserID#', AccountID: '#Session.Auth.AccountID#' });
}
function publish(txt, userID){
var msg = {
AccountID: "#Session.Auth.AccountID#",
publisher: '#Session.Auth.UserID#',
id: userID,
message: converthtml(txt)
};
//When including headers, the "selector" is where you will filter who it goes to.
var headers = {
AccountID: "#Session.Auth.AccountID#",
publisher: '#Session.Auth.UserID#',
id: userID,
selector: "UserID eq '"+userID+"' and AccountID eq '#Session.Auth.AccountID#'"
};
ChatSocket.publish('chatChannel',msg, headers);
}
function msgHandler(message){
console.log(message);
}
function errHandler(err){
console.log(err);
}
</script>
Благодаря для примера. Единственная проблема заключается в том, что я использую websocket для чата Live Help, поэтому разговоры будут один на один, а не транслироваться всем в канале. Нужно ли мне создать уникальный подканал для уведомления для каждого инициированного чата? Кроме того, должен ли быть тайм-аут, чтобы он не обновлял каждый нажатый ключ? – Guest
В этом случае вы можете использовать один и тот же канал и адаптировать свою логику, чтобы различать, если входящее сообщение является «уведомлением» или чат-сообщением. – Sanjeev
Итак, лучший способ иметь один на один чат, например, живой чат с помощью одного канала и фильтрацию по идентификаторам? – Guest