// 用来存储 realtimeObject
var rt = null;
// 用来存储创建好的 roomObject
var room = null;
// 监听是否服务器连接成功
var firstFlag = true;
// 用来标记历史消息获取状态
var logFlag = false;
// 拉取历史相关
// 最早一条消息的时间戳
var msgTime;
//聊天记录区域
var printWall = document.getElementById('print-wall');
function main() {
//showLog('正在连接服务器,请等待...');
//判断登录状态
var val = clientId;
if (val) {
clientId = val;
}
if (!firstFlag) {
rt.close();
}
// 创建实时通信实例
rt = AV.realtime({
appId: appId,
clientId: clientId,
secure: true
});
// 监听连接成功事件
rt.on('open', function () {
firstFlag = false;
//showLog('服务器连接成功!');
// 获得已有房间的实例
rt.room(roomId, function (object) {
// 判断服务器端是否存在这个 room,如果存在
if (typeof(object) != 'undefined') {
room = object;
// 当前用户加入这个房间
room.join(function () {});
// 房间接受消息
room.receive(function (data) {
if (!msgTime) {
// 存储下最早的一个消息时间戳
msgTime = data.timestamp;
}
showMsg(data);
});
} else {
// 如果服务器端不存在这个 conversation
//showLog('服务器不存在这个 conversation,你需要创建一个。');
// 创建暂态的聊天室(暂态聊天室支持无限人员聊天,但是不支持存储历史)
// transient: true,
// 默认的数据,可以放 Conversation 名字等
rt.room({
// Room 的默认名字
name: nickname + '-Room',
// 默认成员的 nickname
members: [
// 当前用户
nickname
],
attr: {
test: '您已进入' +nickname + '-Room...'
}
}, function (obj) {
// 创建成功,后续你可以将 room id 存储起来
room = obj;
roomId = room.id;
showLog('创建一个新 Room 成功,id 是:', roomId);
// 关闭原连接,重新开启新连接
rt.close();
main();
});
}
});
});
// 监听服务情况
rt.on('reuse', function () {
//showLog('服务器正在重连,请耐心等待。。。');
});
// 监听错误
rt.on('error', function () {
showLog('连接遇到错误,请刷新页面');
});
}
// 处理接收消息
function showMsg(data, isBefore) {
var text = '';
var nickname = '';
var fromPeerId = data.fromPeerId;
if (data.msg.type) {
text = data.msg.text;
nickname = data.msg.attr.nickname;
} else {
text = data.msg;
}
if (data.fromPeerId === clientId) {
nickname = '自己';
}
if (String(text).replace(/^\s+/, '').replace(/\s+$/, '')) {
showLog(encodeHTML(nickname), text, isBefore);
}
}
// 拉取历史
bindEvent(printWall, 'scroll', function (e) {
if (printWall.scrollTop < 20) {
getLog();
}
});
// 获取消息历史
function getLog(callback) {
var height = printWall.scrollHeight;
if (logFlag) {
return;
} else {
// 标记正在拉取
logFlag = true;
}
room.log({
t: msgTime
}, function (data) {
logFlag = false;
// 存储下最早一条的消息时间戳
var l = data.length;
if (l) {
msgTime = data[0].timestamp;
}
for (var i = l - 1; i >= 0; i--) {
showMsg(data[i], true);
}
if (l) {
printWall.scrollTop = printWall.scrollHeight - height;
}
if (callback) {
callback();
}
});
}
//demo中输出代码
function showLog(msg, data, isBefore) {
//根据消息类型组装文本
if(data && typeof(data) != 'undefined'){
var li = document.createElement('li');
switch(data._lctype){
case 11: //观众加入
li.className = 'join_li';
msg = '<p><span>'+ data._lcattrs.nickname +'</span> 加入直播间</p>';
//增加观众人数
var viewerNum = parseInt($('.viewerNum').html());
viewerNum = viewerNum + 1;
$('.viewerNum').html(viewerNum);
break;
case 12: //观众离开
msg = '';
//减少观众人数
var viewerNum = parseInt($('.viewerNum').html());
viewerNum = viewerNum - 1;
$('.viewerNum').html(viewerNum);
break;
case 21: //点赞
msg = '';
//增加点赞数
var hitNum = parseInt($('.hitNum').html());
hitNum = hitNum + 1;
$('.hitNum').html(hitNum);
break;
case 31: //直播中断(暂不支持)
msg = '';
break;
case 32: //直播继续(暂不支持)
msg = '';
break;
case 39: //直播结束
li.className = 'join_li';
msg = '<p>直播结束</p>';
rt.close();
break;
default:
var randNum = Math.ceil(Math.random()*6);
var className = 'audience_name cl'+randNum;
msg = '<span class="'+ className +'">'+ msg +':</span><p>'+ encodeHTML(JSON.stringify(data)) +'</p>';
break;
}
}else{
var li = document.createElement('li');
li.className = 'join_li';
msg = '<p>'+ msg +'</p>';
}
//显示聊天消息
if(msg){
li.innerHTML = msg;
if (isBefore) {
printWall.insertBefore(li, printWall.childNodes[0]);
} else {
printWall.appendChild(li);
}
bScroll();
}
}
function encodeHTML(source) {
return String(source)
.replace(/&/g, '&')
.replace(/ .replace(/>/g, '>')
.replace(/(^")|("$)/g, "");
// .replace(/\/g,'\')
// .replace(/"/g,'"')
// .replace(/'/g,''');
}
function bindEvent(dom, eventName, fun) {
if (window.addEventListener) {
dom.addEventListener(eventName, fun);
} else {
dom.attachEvent('on' + eventName, fun);
}
}
//滚动条自动跳到底部方法 bScroll();
;(function($,undefined){
bScroll =function(e){
var t=this;
var nScrollHight = 0;
var nScrollTop = 0;
var nDivHight = $(".right_cut").height();
$(".right_cut").scroll(function () {
nScrollHight = $(this)[0].scrollHeight;
nScrollTop = $(this)[0].scrollTop;
});
var cth = $('.comment_text').height();
$(".right_cut").scrollTop(cth);
}
})(jQuery);