JavaScript/jQuery、HTML、CSS 构建 Web IM 远程及时聊天通信程序

2020-05-22 16:09:00易采站长站整理

if (keyCode == 13) {
var $chatMain = $(“#” + $(this).find(“body”).attr(“jid”));
_opts.sendHandler($chatMain);
}
});
},
// 建立新聊天窗口
newWebIM: function (settings) {
var chatUser = remote.userAddress(settings.receiver);
var userJID = “u” + hex_md5(chatUser);
_opts.initWebIM(userJID, chatUser);
$(“#” + userJID).find(remote.receiver).val(chatUser);
$(“#” + userJID).show(220);
},
// 远程发送消息时执行函数
messageHandler: function (user, content) {
var userName = user.split(“@”)[0];
var tempUser = user;
if (~tempUser.indexOf(“/”)) {
tempUser = tempUser.substr(0, tempUser.indexOf(“/”));
}
var userJID = “u” + hex_md5(tempUser);
// 首次初始webIM
if (!$(“#” + userJID).get(0)) {
// 初始IM面板;
_opts.initWebIM(userJID, user);
}
// 设置消息接受者的名称
$(“#” + userJID).find(remote.receiver).val(user);
if ($(“#” + userJID).get(0)) {
// 消息提示
if ($(“div[id='” + userJID + “‘]:hidden”).get(0)) {
var haveMessage = $(“.have-msg”);
haveMessage.show();
$(“.no-msg”).hide();
}
_opts.messageTip(“闪聊有了新消息,请查收!”);
// 向chat接收信息区域写消息
remote.jsjac.chat.writeMessage(userJID, userName, content);
}
},
// 消息提示
messageTip: function () {
if (count % 2 == 0) {
window.focus();
document.title = “你来了新消息,请查收!”;
} else {
document.title = “”;
}
if (count > 4) {
document.title = “”;
count = 0;
} else {
window.setTimeout(_opts.messageTip, 1000);
count ++;
}
}
};
// 初始化远程聊天程序相关方法
var initRemoteIM = function (settings) {
// 初始化远程消息
remote.jsjac.chat.init();
// 设置客户端写入信息方法
remote.jsjac.chat.writeReceiveMessage = settings.writeReceiveMessage;
// 注册事件
$(window).bind({
unload: remote.jsjac.chat.unloadHandler,
error: remote.jsjac.chat.errorHandler,
beforeunload: remote.jsjac.chat.logout
});
}
$.extend({
WebIM: function (opts) {
opts = opts || {};
// 覆盖默认配置
defaultOptions = $.extend(defaultOptions, defaultOptions, opts);
var settings = $.extend({}, defaultOptions, opts);
initRemoteIM(settings);
settings.newWebIM(settings);
$.WebIM.settings = settings;
}
});
$.WebIM.settings = $.WebIM.settings || _opts;
$.WebIM.initWebIM = _opts.initWebIM;
$.WebIM.newWebIM = _opts.newWebIM;
$.WebIM.messageHandler = _opts.messageHandler;
})(jQuery);

这里的方法基本上是聊天窗口上的应用,主要是本地聊天程序的js、HTML元素的操作。如字体、字体大小、颜色、表情、消息的发送等,不涉及到聊天消息发送的核心代码,其中有用到发送远程消息的方法。