/**
@Name:layuiAdmin 用户登入和注册等
@Author:贤心
@Site:http://www.layui.com/admin/
@License: LPPL
*/
layui.define(['index', 'layim'], function(exports){
var $ = layui.$
,admin = layui.admin
,element = layui.element
,router = layui.router();
var layim = layui.layim;
//演示自动回复
var autoReplay = [
'您好,我现在有事不在,一会再和您联系。',
'你没发错吧?face[微笑] ',
'洗澡中,请勿打扰,偷窥请购票,个体四十,团体八折,订票电话:一般人我不告诉他!face[哈哈] ',
'你好,我是主人的美女秘书,有什么事就跟我说吧,等他回来我会转告他的。face[心] face[心] face[心] ',
'face[威武] face[威武] face[威武] face[威武] ',
'<(@ ̄︶ ̄@)>',
'你要和我说话?你真的要和我说话?你确定自己想说吗?你一定非说不可吗?那你说吧,这是自动回复。',
'face[黑线] 你慢慢说,别急……',
'(*^__^*) face[嘻嘻] ,是贤心吗?'
];
//基础配置
layim.config({
//初始化接口
init: {
url: layui.setter.base + 'json/layim/getList.js'
,data: {}
}
//查看群员接口
,members: {
url: layui.setter.base + 'json/layim/getMembers.js'
,data: {}
}
,uploadImage: {
url: '' //(返回的数据格式见下文)
,type: '' //默认post
}
,uploadFile: {
url: '' //(返回的数据格式见下文)
,type: '' //默认post
}
,isAudio: true //开启聊天工具栏音频
,isVideo: true //开启聊天工具栏视频
//扩展工具栏
,tool: [{
alias: 'code'
,title: '代码'
,icon: ''
}]
//,brief: true //是否简约模式(若开启则不显示主面板)
//,title: 'WebIM' //自定义主面板最小化时的标题
//,right: '100px' //主面板相对浏览器右侧距离
//,minRight: '90px' //聊天面板最小化时相对浏览器右侧距离
,initSkin: '3.jpg' //1-5 设置初始背景
//,skin: ['aaa.jpg'] //新增皮肤
//,isfriend: false //是否开启好友
//,isgroup: false //是否开启群组
//,min: true //是否始终最小化主面板,默认false
//,notice: true //是否开启桌面消息提醒,默认false
//,voice: false //声音提醒,默认开启,声音文件为:default.mp3
,msgbox: '/layim/demo/msgbox.html' //消息盒子页面地址,若不开启,剔除该项即可
,find: '/layim/demo/find.html' //发现页面地址,若不开启,剔除该项即可
,chatLog: '/layim/demo/chatlog.html' //聊天记录页面地址,若不开启,剔除该项即可
});
//监听在线状态的切换事件
layim.on('online', function(status){
layer.msg(status);
});
//监听签名修改
layim.on('sign', function(value){
layer.msg(value);
});
//监听自定义工具栏点击,以添加代码为例
layim.on('tool(code)', function(insert){
layer.prompt({
title: '插入代码 - 工具栏扩展示例'
,formType: 2
,shade: 0
}, function(text, index){
layer.close(index);
insert('[pre class=layui-code]' + text + '[/pre]'); //将内容插入到编辑器
});
});
//监听layim建立就绪
layim.on('ready', function(res){
//console.log(res.mine);
layim.msgbox(5); //模拟消息盒子有新消息,实际使用时,一般是动态获得
});
//监听发送消息
layim.on('sendMessage', function(data){
var To = data.to;
//console.log(data);
if(To.type === 'friend'){
layim.setChatStatus('对方正在输入。。。');
}
//演示自动回复
setTimeout(function(){
var obj = {};
if(To.type === 'group'){
obj = {
username: '模拟群员'+(Math.random()*100|0)
,avatar: layui.cache.dir + 'images/face/'+ (Math.random()*72|0) + '.gif'
,id: To.id
,type: To.type
,content: autoReplay[Math.random()*9|0]
}
} else {
obj = {
username: To.name
,avatar: To.avatar
,id: To.id
,type: To.type
,content: autoReplay[Math.random()*9|0]
}
layim.setChatStatus('在线');
}
layim.getMessage(obj);
}, 1000);
});
//监听查看群员
layim.on('members', function(data){
//console.log(data);
});
//监听聊天窗口的切换
layim.on('chatChange', function(res){
var type = res.data.type;
console.log(res.data.id)
if(type === 'friend'){
//模拟标注好友状态
//layim.setChatStatus('在线');
} else if(type === 'group'){
//模拟系统消息
layim.getMessage({
system: true
,id: res.data.id
,type: "group"
,content: '模拟群员'+(Math.random()*100|0) + '加入群聊'
});
}
});
//面板外的操作
var $ = layui.jquery, active = {
chat: function(){
//自定义会话
layim.chat({
name: '小闲'
,type: 'friend'
,avatar: '//tva3.sinaimg.cn/crop.0.0.180.180.180/7f5f6861jw1e8qgp5bmzyj2050050aa8.jpg'
,id: 1008612
});
layer.msg('也就是说,此人可以不在好友面板里');
}
,message: function(){
//制造好友消息
layim.getMessage({
username: "贤心"
,avatar: "//tp1.sinaimg.cn/1571889140/180/40030060651/1"
,id: "100001"
,type: "friend"
,content: "嗨,你好!欢迎体验LayIM。演示标记:"+ new Date().getTime()
,timestamp: new Date().getTime()
});
}
,messageAudio: function(){
//接受音频消息
layim.getMessage({
username: "林心如"
,avatar: "//tp3.sinaimg.cn/1223762662/180/5741707953/0"
,id: "76543"
,type: "friend"
,content: "audio[http://gddx.sc.chinaz.com/Files/DownLoad/sound1/201510/6473.mp3]"
,timestamp: new Date().getTime()
});
}
,messageVideo: function(){
//接受视频消息
layim.getMessage({
username: "林心如"
,avatar: "//tp3.sinaimg.cn/1223762662/180/5741707953/0"
,id: "76543"
,type: "friend"
,content: "video[http://www.w3school.com.cn//i/movie.ogg]"
,timestamp: new Date().getTime()
});
}
,messageTemp: function(){
//接受临时会话消息
layim.getMessage({
username: "小酱"
,avatar: "//tva1.sinaimg.cn/crop.7.0.736.736.50/bd986d61jw8f5x8bqtp00j20ku0kgabx.jpg"
,id: "198909151014"
,type: "friend"
,content: "临时:"+ new Date().getTime()
});
}
,add: function(){
//实际使用时数据由动态获得
layim.add({
type: 'friend'
,username: '麻花疼'
,avatar: '//tva1.sinaimg.cn/crop.0.0.720.720.180/005JKVuPjw8ers4osyzhaj30k00k075e.jpg'
,submit: function(group, remark, index){
layer.msg('好友申请已发送,请等待对方确认', {
icon: 1
,shade: 0.5
}, function(){
layer.close(index);
});
//通知对方
/*
$.post('/im-applyFriend/', {
uid: info.uid
,from_group: group
,remark: remark
}, function(res){
if(res.status != 0){
return layer.msg(res.msg);
}
layer.msg('好友申请已发送,请等待对方确认', {
icon: 1
,shade: 0.5
}, function(){
layer.close(index);
});
});
*/
}
});
}
,addqun: function(){
layim.add({
type: 'group'
,username: 'LayIM会员群'
,avatar: '//tva2.sinaimg.cn/crop.0.0.180.180.50/6ddfa27bjw1e8qgp5bmzyj2050050aa8.jpg'
,submit: function(group, remark, index){
layer.msg('申请已发送,请等待管理员确认', {
icon: 1
,shade: 0.5
}, function(){
layer.close(index);
});
//通知对方
/*
$.post('/im-applyGroup/', {
uid: info.uid
,from_group: group
,remark: remark
}, function(res){
});
*/
}
});
}
,addFriend: function(){
var user = {
type: 'friend'
,id: 1234560
,username: '李彦宏' //好友昵称,若申请加群,参数为:groupname
,avatar: '//tva4.sinaimg.cn/crop.0.0.996.996.180/8b2b4e23jw8f14vkwwrmjj20ro0rpjsq.jpg' //头像
,sign: '全球最大的中文搜索引擎'
}
layim.setFriendGroup({
type: user.type
,username: user.username
,avatar: user.avatar
,group: layim.cache().friend //获取好友列表数据
,submit: function(group, index){
//一般在此执行Ajax和WS,以通知对方已经同意申请
//……
//同意后,将好友追加到主面板
layim.addList({
type: user.type
,username: user.username
,avatar: user.avatar
,groupid: group //所在的分组id
,id: user.id //好友ID
,sign: user.sign //好友签名
});
layer.close(index);
}
});
}
,addGroup: function(){
layer.msg('已成功把[Angular开发]添加到群组里', {
icon: 1
});
//增加一个群组
layim.addList({
type: 'group'
,avatar: "//tva3.sinaimg.cn/crop.64.106.361.361.50/7181dbb3jw8evfbtem8edj20ci0dpq3a.jpg"
,groupname: 'Angular开发'
,id: "12333333"
,members: 0
});
}
,removeFriend: function(){
layer.msg('已成功删除[凤姐]', {
icon: 1
});
//删除一个好友
layim.removeList({
id: 121286
,type: 'friend'
});
}
,removeGroup: function(){
layer.msg('已成功删除[前端群]', {
icon: 1
});
//删除一个群组
layim.removeList({
id: 101
,type: 'group'
});
}
//置灰离线好友
,setGray: function(){
layim.setFriendStatus(168168, 'offline');
layer.msg('已成功将好友[马小云]置灰', {
icon: 1
});
}
//取消好友置灰
,unGray: function(){
layim.setFriendStatus(168168, 'online');
layer.msg('成功取消好友[马小云]置灰状态', {
icon: 1
});
}
,kefu1: function(){
layim.chat({
name: '在线客服一' //名称
,type: 'kefu' //聊天类型
,avatar: '//tp1.sinaimg.cn/5619439268/180/40030060651/1' //头像
,id: 1111111 //定义唯一的id方便你处理信息
})
}
,kefu2: function(){
layim.chat({
name: '在线客服二' //名称
,type: 'kefu' //聊天类型
,avatar: '//tp1.sinaimg.cn/5619439268/180/40030060651/1' //头像
,id: 2222222 //定义唯一的id方便你处理信息
});
}
//移动端版本
,mobile: function(){
var device = layui.device();
var mobileHome = '/layim/demo/mobile.html';
if(device.android || device.ios){
return location.href = mobileHome;
}
var index = layer.open({
type: 2
,title: '移动版演示 (或手机扫右侧二维码预览)'
,content: mobileHome
,area: ['375px', '667px']
,shadeClose: true
,shade: 0.8
,end: function(){
layer.close(index + 2);
}
});
layer.photos({
photos: {
"data": [{
"src": "http://cdn.layui.com/upload/2016_12/168_1481056358469_50288.png",
}]
}
,anim: 0
,shade: false
,success: function(layero){
layero.css('margin-left', '350px');
}
});
}
};
$('.LAY-senior-im-chat-demo .layui-btn').on('click', function(){
var type = $(this).data('type');
active[type] ? active[type].call(this) : '';
});
exports('im', {});
});