
  function chat(socketurl,guestid,sessionusername='',guestip,kefus,guestdata,web={qq:'',weixin:''}){
  
   //电脑端
 
    layui.config({
  version: true
}).use(['layer','mobile','form','jquery', 'table', 'element', 'flow','layim'],function(layer,mobile){
  var mobile = layui.mobile
  ,layim = mobile.layim
  ,$ = layui.jquery
  ,table = layui.table
  ,form = layui.form
  ,layer = mobile.layer;
  
  //演示自动回复
//   var autoReplay = [
//     '您好，我现在有事不在，一会再和您联系。', 
//     '你没发错吧？face[微笑] ',
//     '洗澡中，请勿打扰，偷窥请购票，个体四十，团体八折，订票电话：一般人我不告诉他！face[哈哈] ',
//     '你好，我是主人的美女秘书，有什么事就跟我说吧，等他回来我会转告他的。face[心] face[心] face[心] ',
//     'face[威武] face[威武] face[威武] face[威武] ',
//     '<（@￣︶￣@）>',
//     '你要和我说话？你真的要和我说话？你确定自己想说吗？你一定非说不可吗？那你说吧，这是自动回复。',
//     'face[黑线]  你慢慢说，别急……',
//     '(*^__^*) face[嘻嘻] ，是贤心吗？'
//   ];


   
  //console.log(layim.datafrend);
var table = layui.table;
    var form = layui.form;
    var  $ = layui.$;
     /*监听提交*/
    var ws = new WebSocket(socketurl);
    //localStorage.getItem("userid")
    //var fromid="{{$Request.session.guestid}}";
    var fromid=guestid;
   if(sessionusername){
       fromid=sessionusername
   }
   
    var  userstatus=[];
   
    
    var statu="";
    $('#loginout').click(function(){
          $.ajax({
            url:"/http/chat/loginout",
            type:'post',
            headers:{
                'kefutoken':localStorage.getItem("kefutoken"), 
            },
          
            data:{},
            
            beforeSend:function () {
               
            },
            success:function(data){
                
                 
                if(data.status == 1){
                    
                    
                     layer.msg("退出成功！", {icon: 1, anim: 5, time: 2300});
                   window.location.reload();
                    return false;
                }else{
                  layer.msg(data.msg, {icon: 1, anim: 5, time: 1300});
                }
            },
            error:function () {
                layer.msg("请求错误")
            }
        });
    })
    // $.ajax({
    //         url:"/http/chat/getfromid",
    //         type:'post',
    //         headers:{
    //             'kefutoken':localStorage.getItem("kefutoken"), 
    //         },
          
    //         data:{},
            
    //         beforeSend:function () {
               
    //         },
    //         success:function(data){
                
                 
    //             if(data.status == 1){
    //                 fromid=data.userid;
    //                  //console.log(fromid);
    //                  layer.msg("初始化用户成功！", {icon: 1, anim: 5, time: 2300});
                   
    //                 return fromid;
    //             }else{
    //               layer.msg(data.msg, {icon: 1, anim: 5, time: 1300});
    //             }
    //         },
    //         error:function () {
    //             layer.msg("请求错误")
    //         }
    //     });
    
    if(!fromid){
      
      fromid=parseInt(Math.random()*100000);
    }
    ws.onopen = function() {
        
          let   message='{"qq":"'+web.qq+'","weixin":"'+web.weixin+'","data":"'+window.location.href+'","type":"guest","fromid":"'+fromid+'","toid":"'+kefus[0].userid+'","username":"'+"游客"+' ip:'+guestip+'","avatar":"'+"/static/images/user.png"+'"}';
           // var onconnects='{"fromid":"'+fromid+'","type":"onconnect","url":"+window.location.href+"}';
           
           //console.log(message);
           ws.send(message);
    };
    ws.onerror=function(){
        statu="聊天服务器连接异常!!"
         $('#div_box').append('<div class="div_box" style="border-bottom:1px solid #ccc;color:red;text-align:center">\n' +
                    '\n' + statu +
                    '</div>')
    }
 
   // $("#Submitbtn").click(function() {
   //      var val = document.getElementById('test1').value;
   //      if(val && !statu){
   //          $('#div_box').append('<div class="div_box" style="border-bottom:1px solid #ccc;color:red;text-align:right">\n' +
   //                  '\n' + val +
   //                  '</div>')
   //          var message='{"data":"'+val+'","type":"text","fromid":"'+fromid+'","toid":"'+toid+'"}';

   //          ws.send(message);
   //          document.getElementById('test1').value="";
   //      }
   //  }); 
   
    ws.onconnect = function(e){
        
        // $('#div_box').after('<div id="div_box">\n' +
        //     '\n' + e.data +
        //     '</div>')
    };
    // ws.onmessage = function(e){
    //     var res=eval("("+e.data+")");
    //     switch(res.type){
    //       // case "text":
    //       //  if(res.fromid==toid){
    //       //    $('#div_box').append('<div class="div_box">\n' +
    //       //       '\n' + res.data +
    //       //       '</div>')
    //       //  }
             
    //       // break;
    //       case "bind":
    //       var bind='{"fromid":"'+fromid+'","type":"bind"}';
    //        ws.send(bind);
         
         
    //       break;
    //     }

        
    // };
   ws.onmessage = function(e){
        var rs=eval("("+e.data+")");
       
        switch(rs.type){
          case "friend":
         
           if(rs.fromid!=fromid){            
              obj = {
                username: rs.username
                ,avatar: rs.avatar
                ,id: rs.fromid
                ,type: rs.type
                ,content: rs.data
              }
              layim.getMessage(obj);
           }
             
          break;
          case "group":
          if(rs.fromid!=fromid){ 
          layim.getMessage({
            system: false
            ,id: rs.toid
            ,type: "group"
            ,username: rs.username
            ,avatar: rs.avatar
            ,content: rs.data
          });
         }
         
          break;
            case "bind":
                
        
                
                
            if(fromid){
              var bind='{"fromid":"'+fromid+'","type":"bind"}';
          ws.send(bind);
            }
           
            
          break;
          case "isonline":
          
            userstatus=rs.status;
            console.log(userstatus);
           let sta="online";
           for(let b in userstatus){
            if(userstatus[b].statu==0){
              sta="offline";
            }else{
              sta="online";
            }
            
            layim.setFriendStatus(userstatus[b].uid, sta);   
            

           }
          break;
          case "save":
             console.log(rs);
              $.ajax({
                    url:"/http/chat/save/",
                    type:'post',
                  
                    data:{data:rs},
                    
                    beforeSend:function () {
                       
                    },
                    success:function(data){
                        // data=JSON.parse(data);

                        if(data.status == 1){
                             //layer.msg("请等对方接入！请稍等......", {icon: 1, anim: 5, time: 5300});
                           
                            return false;
                        }else{
                           //layer.msg(data.msg, {icon: 1, anim: 5, time: 5300});
                        }
                    },
                    error:function () {
                      //  layer.msg("请求错误.....", {icon: 1, anim: 5, time: 5300});
                    }
                });
                 $.ajax({
                    url:"/http/wechat/tpl/",
                    type:'post',
                  
                      data:{content:'(客户ip:'+guestip+') 内容：'+rs.data,chatuid:fromid},
                    
                    beforeSend:function () {
                       
                    },
                    success:function(data){


                        // if(data.status == 1){
                        //      layer.msg("发送失败！对方已离线！", {icon: 1, anim: 5, time: 2300});
                           
                        //     return false;
                        // }else{
                        //   layer.msg(data.msg, {icon: 1, anim: 5, time: 1300});
                        // }
                    },
                    error:function () {
                       // layer.msg("请求错误！请稍后....", {icon: 1, anim: 5, time: 5300})
                    }
                });
  // layer.msg("发送失败！对方已离线！", {icon: 1, anim: 5, time: 2300});

        }

     
    };
  layim.config({
    
    init: guestdata
    ,
    
    //上传图片接口
    // uploadImage: {
    //      //url: '/dyadmin/upload/uploadimg?type=webim' //（返回的数据格式见下文）
    //      url:'/http/chat/base64'
    //   ,type: '' //默认post
    //   , headers:{
    //             'kefutoken':localStorage.getItem("kefutoken"), 
    //         }
    // },
    
    //上传文件接口
    // uploadFile: {
    //   url: '/dyadmin/upload/uploadFlie?type=webim' //（返回的数据格式见下文）
    //   ,type: '' //默认post
    // , headers:{
    //             'kefutoken':localStorage.getItem("kefutoken"), 
    //         },
    // },
   brief: true

    //扩展聊天面板工具栏
    // ,tool: [{
    //   alias: 'code'
    //   ,title: '代码'
    //   ,iconUnicode: '&#xe64e;'
    // }]
    
    //扩展更多列表
    ,moreList: [{
      alias: 'find'
      ,title: '发现'
      ,iconUnicode: '&#xe628;' //图标字体的unicode，可不填
      ,iconClass: '' //图标字体的class类名
    },{
      alias: 'share'
      ,title: '分享与邀请'
      ,iconUnicode: '&#xe641;' //图标字体的unicode，可不填
      ,iconClass: '' //图标字体的class类名
    }]
    
    //,tabIndex: 1 //用户设定初始打开的Tab项下标
    //,isNewFriend: false //是否开启“新的朋友”
    ,isgroup: true //是否开启“群聊”
    ,chatTitleColor: '#009688' //顶部Bar颜色
    ,title: 'CHAT' //应用名，默认：我的IM
  });

  //创建一个会话
  /*
  layim.chat({
    id: 111111
    ,name: '许闲心'
    ,type: 'kefu' //friend、group等字符，如果是group，则创建的是群聊
    ,avatar: 'http://tp1.sinaimg.cn/1571889140/180/40030060651/1'
  });
  */

  
  //监听点击“新的朋友”
  layim.on('newFriend', function(){
    layim.panel({
      title: '新的朋友' //标题
      ,tpl: '<div style="padding: 10px;">自定义模版，{{d.data.test}}</div>' //模版
      ,data: { //数据
        test: '么么哒'
      }
    });
  });
  
  //查看聊天信息
  layim.on('detail', function(data){
    //console.log(data); //获取当前会话对象
    layim.panel({
      title: data.name + ' 聊天信息' //标题
      ,tpl: '<div style="padding: 10px;">自定义模版，<a href="http://www.layui.com/doc/modules/layim_mobile.html#ondetail" target="_blank">参考文档</a></div>' //模版
      ,data: { //数据
        test: '么么哒'
      }
    });
  });
  
  //监听点击更多列表
  layim.on('moreList', function(obj){
    switch(obj.alias){
      case 'find':
        layer.msg('自定义发现动作');
        
        //模拟标记“发现新动态”为已读
        layim.showNew('More', false);
        layim.showNew('find', false);
      break;
      case 'share':
        layim.panel({
          title: '邀请好友' //标题
          ,tpl: '<div style="padding: 10px;">自定义模版，{{d.data.test}}</div>' //模版
          ,data: { //数据
            test: '么么哒'
          }
        });
      break;
    }
  });
  
  //监听返回
  layim.on('back', function(){
    //如果你只是弹出一个会话界面（不显示主面板），那么可通过监听返回，跳转到上一页面，如：history.back();
  });
  
  //监听自定义工具栏点击，以添加代码为例
  layim.on('tool(code)', function(insert, send){
    insert('[pre class=layui-code]123[/pre]'); //将内容插入到编辑器
    send();
  });
  
  //监听发送消息
  layim.on('sendMessage', function(data){
       var To = data.to;
    var From = data.mine;
   
    if(To.type === 'friend'){
  
         var arr = Object.keys(userstatus);
        if(arr.length>0){       
        if(userstatus[To.id]!=undefined){
           if(userstatus[To.id].statu==0) {
              layim.setChatStatus('<span style="color:#FF5722;">对方当前已离线。。。</span>');
         }else{
           layim.setChatStatus('<span style="color:#FF5722;">对方正在输入。。。</span>');
         }
        }else{
         layim.setChatStatus('<span style="color:#FF5722;"></span>');
      }
        
       }    
   

       var message='{"qq":"'+web.qq+'","weixin":"'+web.weixin+'","data":"'+From.content+'","type":"'+To.type+'","fromid":"'+fromid+'","toid":"'+To.id+'","username":"'+From.username+' ip:'+guestip+'","avatar":"'+From.avatar+'"}';
      

   }else{

     var message='{"qq":"'+web.qq+'","weixin":"'+web.weixin+'","data":"'+From.content+'","type":"'+To.type+'","fromid":"'+fromid+'","toid":"'+To.id+'","username":"'+From.username+' ip:'+guestip+'","avatar":"'+From.avatar+'"}';
   }
    
         
     ws.send(message);
    
    

  });
  
  
  //监听查看更多记录
  layim.on('chatlog', function(data, ul){
    console.log(data);
    layim.panel({
      title: '与 '+ data.name +' 的聊天记录' //标题
      ,tpl: '<div style="padding: 10px;">这里是模版，{{d.data.test}}</div>' //模版
      ,data: { //数据
        test: 'Hello'
      }
    });
  });
  
  //模拟"更多"有新动态
  layim.showNew('More', true);
  layim.showNew('find', true);
  
  
//   {{volist name="$kefus" id='vo'}} 
  $('.LAY-senior-im-chat-demo .layui-btnkf').on('click', function(){
      let key=$(this).attr('date-key-index');
       console.log(key);
      layim.chat({
        id: kefus[key].userid
        ,name: kefus[key].truename
        ,type: 'friend' //friend、group等字符，如果是group，则创建的是群聊
        ,avatar: kefus[key].avatar 
      });
   });
//   {{/volist}}
//   $('.LAY-senior-im-chat-demo .layui-btnkf').on('click', function(){
//     var type = $(this).data('type');
//     active[type] ? active[type].call(this) : '';
//   });

});
}
      
    
    
    
    
    
    
    
    
    
        
    $(function() { 

        $(window).scroll(function() { 

            if ($(window).scrollTop() > 700) $('div.goup').show(); 

            else

            $('div.goup').hide();

        }); 

            $('div.goup').click(function() { $('html, body').animate({scrollTop: 0}, 1000);

        });

    });
