layim的文档中有layim.setFriendStatus(11111, ‘online’); 方法用来修改用户上线与离线的状态显示;
不知道是不是没有授权的原因,layim.js中没有找到这个方法;
于是,自己定一个。
在layim.js 中添加方法
行号60-90处
// 离线与上线
LAYIM.prototype.setFriendStatus = function(id,status){
return setFriendStatus(id,status), this;
};
后面 1070行左右吧,
//离线与上线
var setFriendStatus = function(id, status){
var the_one = $("#layim-friend"+id);
if(status == "online"){
the_one.removeClass('gray');
}else if(status =="offline"){
the_one.addClass('gray');
}
};
另外面板生成这,也要改一项,用来判断用户是否在线
=={{ "offline"data.status?“class=gray”:""}}
//主模板
var listTpl = function(options){
var nodata = {
friend: "该分组下暂无好友"
,group: "暂无群组"
,history: "暂无历史会话"
};
options = options || {};
options.item = options.item || ('d.' + options.type);
return ['{{# var length = 0; layui.each('+ options.item +', function(i, data){ length++; }}'
,'<li layim-event="chat" data-type="'+ options.type +'" data-index="{{ '+ (options.index||'i') +' }}" id="layim-'+ options.type +'{{ data.id }}" {{ "offline"==data.status?"class=gray":""}} ><img src="{{ data.avatar }}"><span>{{ data.username||data.groupname||data.name||"佚名" }}</span><p>{{ data.remark||data.sign||"" }}</p></li>'
,'{{# }); if(length === 0){ }}'
,'<li class="layim-null">'+ (nodata[options.type] || "暂无数据") +'</li>'
,'{{# } }}'].join('');
};
这里用到一个灰色的css 需要在layim.css中添加
/* 离线好友*/
.gray{ -webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;}
以上完事后,在页面上socket事件监听中 调用方法
//监听收到的消息
socket.onmessage = function(res){
//console.log(res.data);
var data = eval("("+res.data+")");
switch(data['message_type']){
// 服务端ping客户端
case 'ping':
socket.send('{"type":"ping"}');
break;
// 登录 更新用户列表
case 'init':
//console.log(data['id']+"登录成功");
//layim.getMessage(res.data); //res.data即你发送消息传递的数据(阅读:监听发送的消息)
break;
//添加 用户
case 'addUser':
layim.addList(data.data);
break;
//删除 用户
case 'delUser':
layim.removeList({
type: 'friend'
,id: data.data.id //好友或者群组ID
});
break;
// 添加 分组信息
case 'addGroup':
layim.addList(data.data);
break;
case 'delGroup':
layim.removeList({
type: 'group'
,id: data.data.id //好友或者群组ID
});
break;
// 检测聊天数据
case 'chatMessage':
layim.getMessage(data.data);
break;
// 离线消息推送
case 'logMessage':
setTimeout(function(){layim.getMessage(data.data)}, 1000);
break;
// 用户退出 更新用户列表
case 'online':
layim.setFriendStatus(data.id, 'online');
break;
// 用户退出 更新用户列表
case 'logout':
layim.setFriendStatus(data.id, 'offline');
break;
//聊天好有不在线
case 'ctUserOutline':
layer.msg('好友不在线', {'time' : 1000});
break;
}
};