apicloud apicloud

注册
查看: 46651|回复: 225

[新手教程] apicloud+融云实现即时通讯的心血历程

 

业余车手

UID:46814

主题:
152
帖子:
628
云币:
18255

一周年中秋节社会摇圣诞节老司机你吃屎!首长好!我还是个孩子!托马斯全旋女朋友不想上班!装逼侠超人锤子侠SB侠我李白贼6

[新手教程] apicloud+融云实现即时通讯的心血历程

 
46651 225 | 发表于 2015-9-16 16:44:58 |阅读模式 | |
本帖最后由 周枫 于 2017-2-21 09:19 编辑

 
      请尊重作者的辛勤劳动!!!  
        好多人都问我,为什么不直接把项目打包传上来,我想说:这是不可能的,不是我怕项目被别人用,而是那样就失去了你自己的思考和交流的意义,我不会那么做的。
        帖子发出后,有好多朋友问我QQ号,交流QQ官方群:398827124,192967653;
        白天因为我也要上班工作,可能不能及时回复,请谅解~~


2015-12-25补充:
上传项目相关图片素材,在附件列表位置

PS:图片你们也找我要,自己找点不好嘛~~~

重大更新 12-24:
apicloud+rongcloud2 实现即时通讯的心血历程重大更新 01.26

apicloud+rongcloud2+sqlite 实现即时通讯的心血历程(三)

更新2016.10.25
                                                    apicloud+rongcloud2+sqlite  实现即时通讯的心血历程——汇总
2015-12-23补充:
好多人问我开发思路,今天我把开发思路文档方式贴出,在 附件 融云会话处理方案.rar ,整理的很详细了,大家自己下载看吧,我正在做本地化处理,完成优化之后再更新。
2015-10-29补充:
1. 上代码 date.js,需要的去下载,作用:转换时间类型
2. 说一下群组的思路:
我只说我的思路,其他实现的方式也可以:
原理:当前人的所有群组信息同步到融云,你说话的时候是你的id对群组的id说话,融云会对当前群组的所有人员发消息,道理就是这样的
1. 我用的是rongcloud1,在同步数据到融云服务器的时候那个方法有错误,因此我选择的是融云提供的java-sdk中的 ApiHttpClient.syncGroup 这个方法
2. 我是把当前登录人员点击“群聊”菜单时,提交个人person_id到java服务器端
3. java服务器端查询当前人员所在的全部群组,形成数组,利用  ApiHttpClient.syncGroup同步到融云服务器
4. 发送群组消息的时候,就是当前人的id对群组的id说了内容,然后融云会告诉这个群组下所有的人员id发送消息

2015-09-19补充:图片发送和获取逻辑:
1.  图片来源一般有2种方式,一是相册选择,可以使用UIMediaScanner 这个模块,数据是个数组,需要循环发送,二是直接照相,api.getPicture,传过去就是图片的在app的fs地址路径
2. 接收的时候融云返回有2个属性,一个是缩略图地址,一个是图片真实地址,这两个地址是融云服务器的,页面显示缩略图,点击打开显示真实地址


使 用apicloud开发已经快2个月了,起初的目的就是为了实现安卓和苹果的兼容,属于一个试验项目,究竟apicloud是否能够满足公司的要求?最 终看来还是不错的,使用apicloud+融云实现了类似微信即时通讯的功能。看到有很多后来的人依然在这块挣扎,我就把自己的实现思路和成果分享出来和大家一起交流一下,我也是第一次做手机开发,有很多经验不足的地方,希望大家能够直接指出来,我也不断完善自己的产品。
    这次没有使用本地数据库,所有数据都是从融云和服务器获取,会影响性能,下一步会把数据本地化处理,再将优化后的代码和大家交流。
    具体实现的思路,说的可能会有些混乱,希望大家能谅解~
    一、功能说明:
    1. 登录功能:类似微信,登录后记住当前人账号和密码,记在了Storage里,可能会有安全性问题,想在第二版优化时保存在数据库中;
    2. 通讯录功能:类似微信,包括群组及好友列表
    3. 历史会话列表:类似微信,包括群组及个人的历史会话列表
    4. 发送内容:包括文本、语音和图片
    二、使用的模块
        包括:fs、imageBrowser、bubbleMenu、listContact、UIMediaScanner、rongCloud、UIChatBox
    三、实现思路:
    PS:这里借鉴了 “流浪男” 的一篇文章,感谢他的对我实现思路的重大启发,原文:https://community.apicloud.com/bb ...viewthread&tid=8715
           使用论坛中的aui.css样式
            感谢技术客服  技术支持-M 的辛勤帮助
            感谢  吴勇  兄弟的帮助
    1.  登录操作,登录时访问服务器(自己的云服务器)获取token,服务器使用的是java的sdk获取token,组装token和人员的所有信息json返回到app,保存在storage里,后期会存到本地数据库中;
    2. 主界面,包括4个菜单,分别为会话历史页面、通讯录页面、应用页面和个人设置页面,所有的和融云相关的业务逻辑都在hh_index_window里面初始化,其他页面获取数据时,都是采取监听模式获取数据;
    3. 会话历史页面:hh_index_window.html
<!DOCTYPE html>
<html>
        <head>
                <metacharset="utf-8">
                <!-- html5:在创建html时为了防止页面缩放等不兼容效果,要创建个viewport  -->

                <metaname="viewport"
content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
                <!-- 在IOS设备上,有时会将数字转为手机号,这里也要禁止下 -->
                <metaname="format-detection" content="telephone=no"/>
                <title>会话列表</title>
                <linkrel="stylesheet" type="text/css"href="../../css/aui.css" />
                <style>
                .span_name {
                       width: 20%;
                       /*font-size: 18px;*/
                       /*text-align: center;*/
                       display: inline-block;
                       /*word-break: keep-all;*/
                       white-space: nowrap;
                       overflow: hidden;
                       text-overflow: ellipsis;
                }
               </style>
        </head>
        <body>
               <!--<div class="aui-content"><inputtype="button" value="为了测试,点击这里清空会话"onclick="clearConversations();"/>-->
                       <ul class="aui-user-view">
                              <!--<li class="aui-user-view-cell aui-img"onclick="openNewsList();">
                                      <img class="aui-img-object aui-pull-left"src="../../image/person/demo1.png">
                                      <div class="aui-img-body">
                                              <span>系统消息1<em>10:22</em></span>
                                              <pclass='aui-ellipsis-1'>
                                                     理想家校通上线啦~~~
                                              </p>
                                      </div>-->
                                      <!--<div id="notify"style="height:0px;">
                                          <divclass="circle">
                                                  <pid="messages" class="circle_p"></p>
                                          </div>
                                  </div>-->
                              <!--</li>-->
                               <!--会话列表-->
                               <div id="hhlist_div"></div>
                              <script type="text/html"id="hhlist_script">
                                      <% if(result.length == 0){ %>

                               <div
style="text-align:center;color:#666;"><span>您还没有会话记录,快去找小伙伴们聊天
吧~~</span></div>
                   <% }else{ %>
                                              <%for(var i=0;i<result.length; i++) {%>
                                                            

                                                             <li id="<%=result.targetId%>"
alt="<%=result.conversationType %>"class="aui-user-view-cellaui-img"  onclick="openHhList('<%=result.targetId
%>','<%=result.latestMessageId
%>','<%=result.person_name
%>','<%=result.conversationType %>','hh_index');">
                                                                    <img class="aui-img-object aui-pull-left"src="<%=result.avatar_url %>">
                                                                    <div class="aui-img-body">

                                                                            <span><span
class="span_name"><%=result.person_name
%></span><em><%=g_time.getTime(result.receivedTime,1)
%></em></span>
                                                                            <% if(result.objectName =='RC:VcMsg') { %>
                                                                                    <pclass='aui-ellipsis-1'>[语音]</p>
                                                                            <% } %>
                                                                            <% if(result.objectName =='RC:TxtMsg') { %>
                                                                                    <pclass='aui-ellipsis-1'><%=result.latestMessage.text %></p>
                                                                            <% } %>
                                                                            <% if(result.objectName =='RC:ImgMsg') { %>
                                                                                    <pclass='aui-ellipsis-1'>[图片]</p>
                                                                            <% } %>
                                                                    </div>
                                                                    <% if(result.unreadMessageCount > 0) { %>
                                                                            <divstyle="height:0px;">
                                                                                <divclass="circle">
                                                                                       <pclass="circle_p"><%=result.unreadMessageCount%></p>
                                                                                       <input type="hidden"class="unread_count" value="<%=result.unreadMessageCount%>"/>
                                                                                </div>
                                                                        </div>
                                                                    <% } %>
                                                             </li>
                           <%}%>
                   <% } %>
                                      
                              </script>
                       </ul>
               <!--</div>-->
               
                <scripttype="text/javascript"src="../../script/api.js"></script>
                <scripttype="text/javascript"src="../../script/template.js"></script>
                <scripttype="text/javascript" src="../../script/date.js"></script>
                <!-- 长按控件周枫 2015.08.05 -->
                <scripttype="text/javascript"src="../../script/hammer.min.js"></script>
                <scripttype="text/javascript"src="../../script/base_config.js"></script>
                <scripttype="text/javascript"src="../../script/huihua/hh_index_window.js"></script>
        </body>
</html>

/*
* 把所有的融云类的处理全部放在消息列表页,然后通过APICloud的api.sendEvent和api.addEventListener 来处理融云的一些事件。
记住除了消息列表页其他页面不要做融云的任何链接处理
*/
//定义融云
var rong;
//内容高度
var rect_h;
//header高度
var header_h;

apiready = function() {
        api.showProgress({
                               title : '加载中...',
                               modal :false
                       });
        rect_h = api.pageParam.rect_h;
        header_h = api.pageParam.header_h;

        //加载融云模块
        rong = api.require('rongCloud');
        //融云初始化
        rongCloud();

        //监听来自会话页面发送消息的事件
        api.addEventListener({
                name :'sendMessage'
        }, function(ret) {
                if (ret&& ret.value) {
                       var value = ret.value;
                       switch(value.type) {
                               case'text':

                                      sendMessage('' + value.type + '', '' + value.targetId + '','' +
value.content + '', '' + value.extra + '', '' + value.conversationType +
'');
                                      break;
                               case'pic':
                                      //判断是照相还是选择,选择是数组,照相是一个
                                      switch(value.pic_source) {
                                              case 'camera':
                                                     sendPicture('' + value.targetId + '', '' + value.imgSrc + '','' + value.extra + '', '' + value.conversationType + '');
                                                     break;
                                              case 'album':
                                                     //                                                     alert(JSON.stringify(value));
                                                     var img_list = value.img_list;
                                                     for (var i = 0; i < img_list.length; i++) {
                                                             //                                                     alert(value.img_list.image_list.path+'123123');
                                                             //图片真实地址
                                                             var img_temp = img_list.path;
                                                             var img_url;
                                                             //文件后缀名,如:png,jpg, mp4
                                                             var suffix = img_list.suffix;
                                                             var obj_scan =api.require('UIMediaScanner');
                                                             if (api.systemType == 'ios') {
                                                                    //虚拟路径转真实路径
                                                                    obj_scan.transPath({
                                                                            path : img_temp
                                                                    }, function(ret) {
                                                                            //发送图片格式
                                                                            if (suffix == 'png' || suffix =='jpg') {
                                                                                   sendPicture('' + value.targetId + '', '' + ret.path + '', '' + value.extra +'', '' + value.conversationType + '');
                                                                            }
                                                                    });
                                                             } else if (api.systemType ="android") {
                                                                    //                                                                    api.alert({
                                                                    //                                                                            msg:img_temp
                                                                    //                                },function(ret,err){
                                                                    //                                        //coding...
                                                                    //                                 });
                                                                    //发送图片格式
                                                                    if (suffix == 'png' || suffix == 'jpg') {
                                                                            sendPicture('' + value.targetId +'', '' + img_temp + '', '' + value.extra + '', '' + value.conversationType +'');
                                                                    }
                                                             }

                                                     }
                                                     break;
                                      }
                                      break;
                               case'voi':

                                      sendVoice('' + value.targetId + '', '' + value.voicePath +'', '' +
value.duration + '', '' + value.extra + '', '' + value.conversationType
+ '');
                                      break;
                       }
                }
        });

        //监听来自会话页面获取历史会话的事件
        api.addEventListener({
                name :'getHistory'
        }, function(ret) {
                if (ret&& ret.value) {
                       var value = ret.value;
                       getHistoryMessagesById(value.type,value.target_id, value.old_msg_id, value.msg_count);
                }
        });

        //监听来自通讯录页面获取最新会话id的事件
        api.addEventListener({
                name :'getOldMessageId'
        }, function(ret) {
                if (ret&& ret.value) {
                       var value = ret.value;
                       getLatestMessagesById(value.conver_type,value.target_id, value.count, function(mes_list) {
                               varold_msg_id = -1;
                               if(getJsonObjLength(mes_list) != 0) {
                                      old_msg_id = mes_list[0].messageId;
                               }
                               //发送target_id获取最新会话id
                               api.sendEvent({
                                      name : 'setOldMessageId',
                                      extra : {
                                              old_msg_id ld_msg_id
                                      }
                               });
                       });

                }
        });

        //监听来注销页面的事件
        api.addEventListener({
                name :'logout'
        }, function(ret) {
               rong.disconnect(false);
        });

        //系统消息未读使用
        //       var messages = Math.floor((Math.random()*10)+1);
        //       document.getElementById("messages").innerHTML =messages;
}
/*
* 打开会话页面
* 周枫
* 2015-08-03
*/
function openHhList(target_id, old_msg_id, person_name, conver_type, h_from) {
        //清除未读信息
        cleanMsg(target_id, conver_type);
        getCoversationList();
        //如果是群组,则获取群组人员姓名json
        if (conver_type == "GROUP") {
               getGroupInfoById(target_id);
        }

        api.openWin({
                name :'hh_chat_window',
                url :'hh_chat_window.html',
                bounces :true,
                animation :'push',
                delay : 1,
                scrollToTop :true,
                pageParam : {
                       'targetId' : target_id,
                       'old_msg_id' : old_msg_id + 1,
                       'conver_type' : conver_type,
                       'person_name' : person_name,
                       'header_h' : header_h,
                       'conver_type' : conver_type,
                       'h_from' : h_from
                },
                rect : {
                       x : 0,
                       y : 'auto',
                       w : 'auto',
                       h : 'auto'
                }
        });
        $api.addEvt($api.byId('back'), 'click',function() {
               api.closeWin();
        });
        //       });
}

/**
* 打开消息列表页面
* 周枫
* 2015.08.17
*/
function openNewsList() {
        api.openWin({
                name :'xx_index_window',
                url :'xx_index_window.html',
                bounces :true,
                animation :'push',
                delay : 1,
                scrollToTop :true,
                pageParam : {
                       'header_h' : header_h
                },
                rect : {
                       x : 0,
                       y : 'auto',
                       w : 'auto',
                       h : 'auto'
                }
        });
}

/*
* 融云初始化
* 周枫
* 2015-08-03
*/
function rongCloud() {
        var token = $api.getStorage('mytoken');
        //融云初始化
        rong.init(function(ret, err) {
                if(ret.status == "success") {
                       api.execScript({
                               name :'index',
                               script :'setTitle("会话");'
                       });
                } else {
                       api.execScript({
                               name :'index',
                               //                              frameName : 'hh_index',
                               script :'setTitle("连接失败");'
                       });
                }
        });
        //监听新消息
        receiveMessageListener();
        //连接
        rong.connect({
                token : '' +token + ''
        }, function(ret, err) {
                if(ret.status == 'success') {
                       //清空所有会话
                       //                                                                                   clearConversations();
                       //消息列表
                       getCoversationList();
                       //初始化当前人员群组信息
                       //                       initPersonGroup();
                       //                       quitGroup();
                } else {
                       var err_code = err.code;
                       switch(err_code) {
                               case"-1":
                                      api.toast({
                                              msg : "对不起,客户端发生未知错误!",
                                              location : 'middle'
                                      });
                                      break;
                               case"2002":
                                      api.toast({
                                              msg : "对不起,客户端数据包不完整,请求数据包有缺失!",
                                              location : 'middle'
                                      });
                                      break;
                               case"2003":
                                      api.toast({
                                              msg : "对不起,服务器不可用!",
                                              location : 'middle'
                                      });
                                      break;
                               case"2004":
                                      api.toast({
                                              msg : "对不起,请重新向身份认证服务器获取 Token!",
                                              location : 'middle'
                                      });
                                      break;
                               case"2005":
                                      api.toast({
                                              msg : "对不起,可能是错误的 App Key,或者 App Key 被服务器积极拒绝!",
                                              location : 'middle'
                                      });
                                      break;
                               case"2006":
                                      api.toast({
                                              msg : "对不起,服务端数据库错误!",
                                              location : 'middle'
                                      });
                                      break;
                               case"5004":
                                      api.toast({
                                              msg : "对不起,服务器超时!",
                                              location : 'middle'
                                      });
                                      break;
                               case"-10000":
                                      api.toast({
                                              msg : "对不起,未调用 init 方法进行初始化!",
                                              location : 'middle'
                                      });
                                      break;
                               case"-10002":
                                      api.toast({
                                              msg : "对不起,输入参数错误!",
                                              location : 'middle'
                                      });
                                      break;
                       }
                }
        });
}

/*
* 监听新消息
当有新消息传来时,利用sendEvent发出一个事件,同时传递消息内容,可以在会话页面进行一次监听接收
* 周枫
* 2015-08-03
*/
function receiveMessageListener() {
       rong.setOnReceiveMessageListener(function(ret, err) {
                //       api.alert({
                //              msg:JSON.stringify(ret)
               //  },function(ret,err){
                //         //coding...
               //  });
                if(ret.status == "success") {
                       //发送事件
                       api.sendEvent({
                               name :'getNewMessage',
                               extra : {
                                      data : ret.result.message
                               }
                       })
                       //                                             cleanMsg(ret.result.message.targetId,ret.result.message.conversationType);
                       getCoversationList();
                }
        })
}

/*
* 获取会话消息列表
* 周枫
* 2015-08-03
*/
function getCoversationList() {
        //消息列表
        rong.getConversationList(function(ret,err) {
                if(ret.status == 'success') {
                       sendConListReJson(ret, function(list_json) {
                              beforeRender(list_json);
                               //                                                                                                                                         api.alert({
                               //                                                                                                                         msg:JSON.stringify(list_json)
                               //                                                                                                   });

                               varhtml_type = template.render('hhlist_script', list_json);
                              document.getElementById('hhlist_div').innerHTML = html_type;
                              api.hideProgress();
                               //未读总条数,显示在APP右上角
                               varunread_sum = 0;
                               varunread_arr = $api.domAll('.unread_count');
                               for (vari = 0; i < unread_arr.length; i++) {
                                      var unread_count = parseInt($api.val(unread_arr));
                                      unread_sum = unread_sum + unread_count;
                               }
                               //设置应用图标右上角数字,支持所有iOS手机,以及部分Android手机,如小米和三星的某些型号
                              api.setAppIconBadge({
                                      badge : unread_sum
                               });

                               varaui_img = $api.domAll('.aui-user-view-cell');
                               //如果之前有系统消息,需要改成从1开始循环,去掉系统消息
                               for (vari = 0; i < aui_img.length; i++) {
                                      (function(i) {
                                              var id =$api.attr(aui_img, "id");
                                              //长按删除,3秒
                                              var myHanmer = newHammer($api.byId(id));
                                             myHanmer.on("press", function(e) {
                                                     api.confirm({
                                                             title : "提示",
                                                             msg : "确认删除当前会话吗?",
                                                             buttons : ["取消", "确定"]
                                                     }, function(ret, err) {
                                                             if (1 == ret.buttonIndex) {
                                                                    return;
                                                             } else {
                                                                    //删除会话
                                                                    clearMessageById($api.attr(myHanmer.input.target, 'id'),$api.attr(myHanmer.input.target, 'alt'));
                                                             }
                                                     });
                                                     //                                                     alert($api.attr(myHanmer.input.target,'id'));
                                              });
                                      })(i);
                               }
                       });
                } else {
                       var errJson = JSON.stringify(err);
                       //                       api.alert({
                       //                              msg : "err=" + errJson
                       //                       });
                }
        });
}

/**
*  获取某一会话的最新消息记录
*/
function getLatestMessagesById(conver_type, target_id, count, callback) {
        rong.getLatestMessages({
               conversationType : conver_type,
                targetId :target_id + '',
                count :parseInt(count)
        }, function(ret, err) {
                if(ret.status == "success") {
                       callback(ret.result);
                } else {
                       api.alert({
                               msg : '获取某一会话的最新消息记录失败'
                       });
                }
        })
}

/**
* 获取历史聊天记录
* 周枫
* 2015.08.20
*/
function getHistoryMessagesById(conver_type, target_id, old_msg_id, msg_count){
        rong.getHistoryMessages({
               conversationType : conver_type,
                targetId :target_id,
               oldestMessageId : parseInt(old_msg_id),
                count :msg_count
        }, function(ret, err) {
                if(ret.status == 'success') {
                       //                       alert('222:' +JSON.stringify(ret.result));
                       api.sendEvent({
                               name :'setHistory',
                               extra : {
                                      data : ret.result
                               }
                       });
                } else {
                       api.alert({
                               msg : '对不起,获取历史会话信息失败'
                       });
                }
        })
}

/*
*发送消息的函数
注意要放在消息列表页,不要放在会话页面
在会话页面利用sendEvent发出一个发送消息的事件,在消息列表页监听
* 周枫
* 2015-08-03
*/
function sendMessage(type, targetId, content, extra, conversationType) {
        //       api.alert({
        //               msg:'type:'+type+',targetId:'+targetId+',content:'+content+',conversationType:'+conversationType
        //  },function(ret,err){
        //         //coding...
        //  });
        rong.sendTextMessage({
               conversationType : '' + conversationType + '',
                targetId : ''+ targetId + '',
                text : '' +content + '',
                extra : '' +extra + ''
        }, function(ret, err) {
                if(ret.status == 'prepare') {
                       //单聊准备发送,向会话页面发送正在发送消息事件
                       api.sendEvent({
                               name :'insertSendMessage',
                               extra : {
                                      data : ret.result
                               }
                       })
                       //清除未读信息
                       cleanMsg(ret.result.message.targetId,conversationType);
                } else if(ret.status == 'success') {
                       //成功后处理
                       getCoversationList();
                } else if(ret.status == 'error') {
                       //失败
                       api.alert({
                               msg : '发送信息失败:' + err.msg
                       });
                }
        });
}

/**
* 发送图片消息
* 周枫
* 2015.08.11
* @param {Object} sendMsg
*/
function sendPicture(target_id, img_url, extra, conversationType) {
        //       api.alert({
        //               msg : 'img_url:' + img_url + ',target_id:' +target_id
        //       }, function(ret, err) {
        //               //coding...
        //       });
        rong.sendImageMessage({
               conversationType : conversationType,
                targetId :target_id,
                imagePath :img_url,
                extra : extra
        }, function(ret, err) {
                if(ret.status == 'prepare') {
                       //单聊准备发送,向会话页面发送正在发送消息事件
                       api.sendEvent({
                               name :'insertSendMessage',
                               extra : {
                                      data : ret.result
                               }
                       })
                       //清除未读信息
                       cleanMsg(ret.result.message.targetId,conversationType);
                } else if(ret.status == 'progress') {

                } else if(ret.status == 'success') {

                } else if(ret.status == 'error') {
                       var err_code = err.code;
                       switch(err_code) {
                               case -2:
                                      api.alert({
                                              msg : '对不起,图片发送失败'
                                      });
                                      break;
                               case -1:
                                      api.alert({
                                              msg : '对不起,图片发送失败,未知错误'
                                      });
                                      break;
                               case3001:
                                      api.alert({
                                              msg : '对不起,图片发送失败,服务器超时'
                                      });
                                      break;
                               case 405:
                                      api.alert({
                                              msg : '对不起,图片发送失败,您在黑名单中'
                                      });
                                      break;
                               case-10000:
                                      api.alert({
                                              msg : '对不起,图片发送失败,未调用 init 方法进行初始化'
                                      });
                                      break;
                               case-10001:
                                      api.alert({
                                              msg : '对不起,图片发送失败,未调用 connect 方法进行连接'
                                      });
                                      break;
                               case -10002:
                                      api.alert({
                                              msg : '对不起,图片发送失败,输入参数错误'
                                      });
                                      break;
                       }
                }
        });
}

/*
* 发送语音消息
* 周枫
* 2015.08.12
*
*/
function sendVoice(target_id, voicePath, duration, extra, conversationType) {
        rong.sendVoiceMessage({
               conversationType : conversationType,
                targetId :target_id,
                voicePath :voicePath,
                duration :parseInt(duration),
                extra : extra
        }, function(ret, err) {
                if(ret.status == 'prepare') {
                       //单聊准备发送,向会话页面发送正在发送语音事件
                       api.sendEvent({
                               name :'insertSendMessage',
                               extra : {
                                      data : ret.result
                               }
                       })
                       //清除未读信息
                       cleanMsg(target_id, conversationType);
                } else if(ret.status == 'success') {

                } else if(ret.status == 'error') {
                       var err_code = err.code;
                       switch(err_code) {
                               case -2:
                                      api.alert({
                                              msg : '对不起,语音发送失败'
                                      });
                                      break;
                               case -1:
                                      api.alert({
                                              msg : '对不起,图片发送失败,未知错误'
                                      });
                                      break;
                               case3001:
                                      api.alert({
                                              msg : '对不起,图片发送失败,服务器超时'
                                      });
                                      break;
                               case 405:
                                      api.alert({
                                              msg : '对不起,图片发送失败,您在黑名单中'
                                      });
                                      break;
                               case-10000:
                                      api.alert({
                                              msg : '对不起,图片发送失败,未调用 init 方法进行初始化'
                                      });
                                      break;
                               case-10001:
                                      api.alert({
                                              msg : '对不起,图片发送失败,未调用 connect 方法进行连接'
                                      });
                                      break;
                               case-10002:
                                      api.alert({
                                              msg : '对不起,图片发送失败,输入参数错误'
                                      });
                                      break;
                       }
                }
        });
}

/*
* 发送会话历史列表返回增加头像和姓名和时间的json
* 周枫
* 2015-08-05
*/
function sendConListReJson(con_list, callback) {
        api.ajax({
                url :BASE_URL_ACTION + '/rongcloud/getConListReList',
                method :'post',
                dataType :'json',
                data : {
                       values : {
                              "con_list" : con_list,
                              "ip_addr" : BASE_SERVER_IP,
                              "app_type" : BASE_APP_TYPE
                       }
                }
        }, function(ret, err) {
                if (ret) {
                       if (ret.status == 'success') {
                              $api.setStorage('hh_index_list', ret.result);
                              callback(ret);
                       } else {
                              api.alert({
                                      msg : '对不起,获取会话列表失败'
                               });
                       }

                }
        });
}

/*
* 清空某一会话的所有聊天消息记录
* 周枫
* 2015-08-05
*/
function clearMessageById(user_id, conver_type) {
        //首先移除会话列表
        rong.removeConversation({
               conversationType : conver_type,
                targetId :user_id
        }, function(ret, err) {
                if(ret.status == 'success') {
                       //再真实删除聊天记录
                       rong.clearMessages({
                              conversationType : conver_type,
                               targetId: user_id
                       }, function(ret, err) {
                               if(ret.status == 'success') {
                                      //                                      api.toast({
                                      //                                             msg : '操作成功',
                                      //                                              duration: 1000,
                                      //                                             location : 'middle'
                                      //                                      });
                                      //重新获取会话列表
                                      getCoversationList();
                               }
                       });
                }
        })
}

/*
* 清空所有会话及会话消息
* 周枫
* 2015-08-05
*/
function clearConversations() {
        rong.clearConversations({
               conversationTypes : ['PRIVATE', 'GROUP', 'SYSTEM']
        }, function(ret, err) {
                if(ret.status == 'success') {

                } else {
                       api.alert({
                               msg : '对不起,删除失败'
                       });
                }
                //重新获取会话列表
               getCoversationList();
        })
}

/*
* 清除未读信息红点和条数
* 周枫
* 2015-08-03
*/
function cleanMsg(target_id, conver_type) {
        rong.getHistoryMessages({
               conversationType : conver_type,
                targetId :target_id,
               oldestMessageId : -1,
                count : 1
        }, function(ret, err) {
                if(ret.status != "success") {
                       api.alert({
                               msg : '清除未读信息失败'
                       });
                }
        })
}

/**
* 废弃,因为融云初始化有问题
* 同步当前用户所属的群组信息到融云服务器
* PS:由于apicloud的参数问题,所以暂时启用了
* 周枫
* 2015.08.24
*/
function initPersonGroup() {
        var person_id =$api.getStorage('person_id');
        var identity_id =$api.getStorage('identity');
        var ip_addr = BASE_SERVER_IP;
        //获取当前人员群组信息
        api.ajax({

                url :BASE_URL_ACTION + '/group/queryMyGroupForApp?person_id=' +
person_id + '&identity_id=' + identity_id + '&ip_addr=' +
ip_addr,
                method :'get',
                dataType :'text'
        }, function(ret, err) {
                var p_group =eval('(' + ret + ')');
                if(p_group.success == true) {
                       //同步当前用户所属的群组信息到融云服务器
                       rong.syncGroup({
                               groups :
                               //                              p_group.groups
                               [{
                                      //                                      groupId : '975',
                                      //                                      groupName : '张福才',
                                      //                                      portraitUri :'../../image/person/group.png'
                                      id : '975',
                                      name : '张福才',
                                      portraitUrl : '../../image/person/group.png'
                               }, {
                                      //                                      groupId : '976',
                                      //                                      groupName : '张福才2',
                                      //                                      portraitUri : '../../image/person/group.png'
                                      id : '976',
                                      name : '张福才2',
                                      portraitUrl : '../../image/person/group.png'
                               }]
                       }, function(ret, err) {
                              api.toast({
                                      msg : JSON.stringify(ret)
                               });
                       })
                } else {
                       api.alert({
                               msg : '初始化群组信息失败:' + p_group.info
                       });
                }
        });
}

function beforeRender(data) {
        var g_time = new getTimeTemplate();
        //g_time为想在template的标签中执行的函数
        data.g_time = g_time;
}
    这个页面主要包括加载融云的初始化和各种操作,所有函数都有注释就不解释了,总之,其他页面使用数据时都是使用监听获取数据的
    4. 会话页面,包括hh_chat_window.html和hh_chat_frame.html两个页面,相关代码写在对应的js中
    hh_chat_window.html
   
<!DOCTYPE HTML>
<html>
        <head>
                <metacharset="utf-8">
                <!-- html5:在创建html时为了防止页面缩放等不兼容效果,要创建个viewport  -->

                <metaname="viewport"
content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
                <!-- 在IOS设备上,有时会将数字转为手机号,这里也要禁止下 -->
                <metaname="format-detection" content="telephone=no"/>
               <title>APP</title>
                <linkrel="stylesheet" type="text/css"href="../../css/aui.css" />
               <!--<link rel="stylesheet" type="text/css"href="../../css/api.css"/>-->
        </head>
        <style>
                .history-date{
                       font-size: 12px;
                }
               #message-content {
                       overflow-y: auto;
                }
                #wrap {
                       height: 100%;
                       display: -webkit-box;
                       display: -webkit-flex;
                       display: flex;
                       -webkit-box-orient: vertical;
                       -webkit-flex-flow: column;
                       flex-flow: column;
                }
                .topbar {
                       background: #1abc9c;
                       height: 50px;
                       /*border-bottom: 1px solid #DDDFE3;*/
                       line-height: 50px;
                       text-align: center;
                       display: none;
                       color: #ffffff;
                       font-size: 18px;
                }
                .activebar {
                       display: block;
                }
                .back {
                       position: absolute;
                       padding: 1px 10px 0px 10px;
                       height: 29px;
                       font-size: 15px;
                       /*color: #EFEDED;*/
                       /*z-index: 99999;*/
                }
                .mTitle {
                       width: 50%;
                       font-size: 18px;
                       text-align: center;
                       display: inline-block;
                       word-break: keep-all;
                       white-space: nowrap;
                       overflow: hidden;
                       text-overflow: ellipsis;
                }
        </style>
        <body>
                <divid="wrap">
                       <header class="aui-bar aui-bar-navaui-bar-primary" id="aui-header">
                               <divid="cloud" class="topbar activebar">
                                      <div id="back" class="back"onclick="back();" tapmode="">
                                              <iclass="aui-iconfont aui-icon-left"></i>
                                      </div>
                                      <div class="mTitle"id="mTitle"></div>

                                      <a id='menu' class="aui-iconfont aui-icon-friendsaui-pull-right" style="display:none;"
onclick="showGroupListById();"></a>
                              </div>
                       </header>
                       <div class="aui-contentaui-content-padded" id="message-content">
                               <pclass="aui-text-center history-date"></p>
                       </div>
                </div>
                <scripttype="text/javascript" src="../../script/api.js"></script>
                <scripttype="text/javascript" src="../../script/base_config.js"></script>
                <scripttype="text/javascript"src="../../script/huihua/hh_chat_window.js"></script>
        </body>
</html>
   hh_chat_window.js
   
var header_t;
//顶部header高度
var header_h;
//发送id
var target_id;

var conver_type;
var h_from;
var person_name;
apiready = function() {
        //定位header位置,留出上面电池等空隙,苹果需要
        var header = $api.byId('aui-header');
        $api.fixStatusBar(header);
        header_t =$api.offset($api.byId('cloud'));
        header_h = api.pageParam.header_h;
        //当前会话用户id和当前会话历史消息从消息列表页点击传递进来
        target_id = api.pageParam.targetId;
        //真实姓名
        person_name = api.pageParam.person_name;

        conver_type = api.pageParam.conver_type;

        //从哪个页面进入的聊天界面
        h_from = api.pageParam.h_from;
        initHeaer();

        //当前target_id的最大会话id
        var old_msg_id =api.pageParam.old_msg_id;
        //打开聊天内容frame页面
        api.openFrame({
                name :'hh_chat_frame',
                scrollToTop :true,
                allowEdit :true,
                url :'../../html/huihua/hh_chat_frame.html',
                pageParam : {
                       'target_id' : target_id,
                       'old_msg_id' : old_msg_id,
                       'conver_type' : conver_type
                },
                rect : {
                       x : 0,
                       y : header_h,
                       w : api.winWidth,
                       h : api.winHeight - header_h - 50,
                },
                //页面是否弹动为了下拉刷新使用
                bounces :true
        });

        //安卓关闭
        if (api.systemType == 'android') {
               backFromChatForAndroid();
        }

        //加载uichatbox模块
        initUichatbox();

};

/**
* 安卓点击返回的时候
* 周枫
* 2015.08.31
*/
function backFromChatForAndroid() {
        api.addEventListener({
                name :"keyback"
        }, function(ret, err) {
                back();
        });
}

/**
*返回会话列表页面
* 周枫
* 2015.08.08
*/
function back() {
        switch(h_from) {
                case 'hh_index':
                       //清楚红点
                       api.execScript({
                               name :'index',
                               frameName: 'hh_index',
                               script :'cleanMsg("' + target_id + '","' + conver_type + '");'
                       });
                       //重新获取会话列表
                       api.execScript({
                               name :'index',
                               frameName: 'hh_index',
                               script :'getCoversationList();'
                       });
                       break;
                case'txl_index':
                       //清楚红点
                       api.execScript({
                               name :'index',
                               frameName: 'hh_index',
                               script :'cleanMsg("' + target_id + '","' + conver_type + '");'
                       });
                       //重新获取会话列表
                       api.execScript({
                               name :'index',
                               frameName: 'hh_index',
                               script :'getCoversationList();'
                       });
                       api.execScript({
                               name :'index',
                               frameName: 'txl_index',
                               script :'loadData();'
                       });
                       api.execScript({
                               name :'index',
                               frameName: 'txl_index',
                               script :'showMyself();'
                       });

                       break;
                case'txl_content':
                       //清楚红点
                       api.execScript({
                               name :'index',
                               frameName: 'hh_index',
                               script :'cleanMsg("' + target_id + '","' + conver_type + '");'
                       });
                       //重新获取会话列表
                       api.execScript({
                               name :'index',
                               frameName: 'hh_index',
                               script :'getCoversationList();'
                       });

                       api.execScript({
                               name :'txl_content_window',
                               frameName: 'txl_content_frame',
                               script :'loadData();'
                       });
                       api.execScript({
                               name :'txl_content_window',
                               frameName: 'txl_content_frame',
                               script :'showMyself();'
                       });

                       break;
        }

        api.closeWin();
}

function reloadTxlIndex() {
        //       api.alert({
        //               msg : '11111'
        //       }, function(ret, err) {
        //               //coding...
        //       });
        api.execScript({
                name :'index',
                frameName :'txl_index',
                script :'loadData();'
        });
}

/**
*加载uichatbox模块
* 周枫
* 2015.08.08
*/
function initUichatbox() {
        //引入chatbox
        var chatBox = api.require('UIChatBox');
        //获取表情存放路径
        var sourcePath = BASE_EMOTION_PATH;
        //表情存放目录
        var emotionData;
        //存储表情
        getImgsPaths(sourcePath,function(emotion) {
                emotionData =emotion;
        })
        chatBox.open({
                placeholder :'',
                //输入框显示的最大行数(高度自适应)
                maxRows : 4,
                //自定义表情文件夹(表情图片所在的文件夹,须同时包含一个与该文件夹同名的.json配置文件)的路径
                //.json文件内的 name 值必须与表情文件夹内表情图片名对应
                emotionPath :sourcePath,
                //聊天输入框模块可配置的文本
                texts : {
                       //(可选项)JSON对象;录音按钮文字内容
                       recordBtn : {
                               //(可选项)字符串类型;按钮常态的标题,默认:'按住 说话'
                              normalTitle : '按住 说话',
                               //(可选项)字符串类型;按钮按下时的标题,默认:'松开 结束'
                              activeTitle : '松开 结束'
                       }
                },
                //模块各部分的样式集合
                styles : {
                       //(可选项)JSON对象;输入区域(输入框及两侧按钮)整体样式
                       inputBar : {
                              borderColor : '#d9d9d9',
                               bgColor :'#f2f2f2'
                       },
                       //(可选项)JSON对象;输入框样式
                       inputBox : {
                              borderColor : '#B3B3B3',
                               bgColor :'#FFFFFF'
                       },
                       //JSON对象;表情按钮样式
                       emotionBtn : {
                               normalImg: BASE_CHATBOX_PATH + '/chatBox_face1.png'
                       },
                       //(可选项)JSON对象;附加功能按钮样式,不传则不显示附加功能按钮
                       extrasBtn : {
                               normalImg: BASE_CHATBOX_PATH + '/chatBox_add1.png'
                       },
                       //JSON对象;键盘按钮样式
                       keyboardBtn : {
                               normalImg: BASE_CHATBOX_PATH + '/chatBox_key1.png'
                       },
                       //(可选项)JSON对象;输入框左侧按钮样式,不传则不显示左边的语音按钮
                       speechBtn : {
                               normalImg: BASE_CHATBOX_PATH + '/chatBox_key1.png'
                       },
                       //JSON对象;“按住 录音”按钮的样式
                       recordBtn : {
                               //(可选项)字符串类型;按钮常态的背景,支持rgb,rgba,#,图片路径(本地路径,fs://,widget://);默认:'#c4c4c4'
                               normalBg: '#c4c4c4',
                               //(可选项)字符串类型;按钮按下时的背景,支持rgb,rgba,#,图片路径(本地路径,fs://,widget://);默认:'#999999';
                              //normalBg 和 activeBg 必须保持一致,同为颜色值,或同为图片路径
                               activeBg: '#999999',
                               color :'#000',
                               size : 14
                       },
                       //(可选项)JSON对象;表情和附加功能面板的小圆点指示器样式,若不传则不显示该指示器
                       indicator : {
                               //(可选项)字符串类型;配置指示器的显示区域;默认:'both'
                               //取值范围:
                               //both(表情和附加功能面板皆显示)
                              //emotionPanel(表情面板显示)
                              //extrasPanel(附加功能面板显示)
                               target :'both',
                               color :'#c4c4c4',
                              activeColor : '#9e9e9e'
                       }
                },
                //(可选项)点击附加功能按钮,打开的附加功能面板的按钮样式,配合 extrasBtn 一起使用,若 extrasBtn 参数内 normalImg 属性不传则此参数可不传
                extras : {
                       titleSize : 10,
                       titleColor : '#a3a3a3',
                       //数组类型;附加功能按钮的样式
                       btns : [{
                               title : '图片',
                               //(可选项)字符串类型;按钮常态的背景图片
                               normalImg: BASE_CHATBOX_PATH + '/chatBox_album1.png',
                               //(可选项)字符串类型;按钮按下时的背景图片
                               activeImg: BASE_CHATBOX_PATH + '/chatBox_album2.png'
                       }, {
                               title : '拍照',
                               normalImg: BASE_CHATBOX_PATH + '/chatBox_cam1.png',
                               activeImg: BASE_CHATBOX_PATH + '/chatBox_cam2.png'
                       }]
                }
        }, function(ret, err) {
                //字符串类型;回调的事件类型,
                //取值范围:
                //show(该模块打开成功)
                //send(用户点击发送按钮)
                //clickExtras(用户点击附加功能面板内的按钮)
                //数字类型;当 eventType 为 clickExtras 时,此参数为用户点击附加功能按钮的索引,否则为 undefined
                //字符串类型;当 eventType 为 send 时,此参数返回输入框的内容,否则返回 undefined

                //点击附加功能面板
                if(ret.eventType == 'clickExtras') {
                       var c_index = ret.index;
                       switch(c_index) {
                               case 0:
                                      //                                      api.confirm({
                                      //                                             title : "提示",
                                      //                                             msg : "您想要从哪里选取图片 ?",
                                      //                                             buttons : ["现在照", "相册选", "取消"]
                                      //                                      }, function(ret, err) {
                                      //                                             //定义图片来源类型
                                      //                                             var sourceType;
                                      //                                             if (1 == ret.buttonIndex) {/* 打开相机*/
                                      //                                                     sourceType = "camera";
                                      //                                             } else if (2 == ret.buttonIndex) {
                                      //                                                     sourceType = "album";
                                      //                                             } else {
                                      //                                                     return;
                                      //                                             }
                                      //相册选
                                      getPicture("album");
                                      //                                      });
                                      break;
                               case 1:
                                      //现在照
                                      getPicture("camera");
                                      break;
                       }

                }
                //点击发送按钮
                if(ret.eventType == 'send') {
                       /*
                        *1.用户输入文字或表情
                        */
                       /*用户输入表情或文字*/
                       /*使用读文件方法,读json*/
                       var sendMsg = transText(ret.msg);
                       if ($api.trimAll(sendMsg).length != 0) {
                               //发送消息的函数,后面会有介绍
                               //发送消息
                               //                              chat(sendMsg);
                              api.execScript({
                                      name : '',
                                      frameName : 'hh_chat_frame',
                                      script : 'sendText("' + sendMsg + '","' +conver_type + '")'
                               });
                               /*将文字中的表情符号翻译成图片,并可自定义图片尺寸*/
                               functiontransText(text, imgWidth, imgHeight) {
                                      var imgWidth = imgWidth || 30;
                                      var imgHeight = imgHeight || 30;
                                      var regx = /\[(.*?)\]/gm;
                                      var textTransed = text.replace(regx, function(match) {
                                              var imgSrc =emotionData[match];
                                              if (!imgSrc) {
                                                     //说明不对应任何表情,直接返回
                                                     return match;
                                              }
                                              var img ="<img src=" + imgSrc + " width=" + imgWidth + "height=" + imgHeight + ">";
                                              return img;
                                      });
                                      textTransed = transferBr(textTransed);
                                      return textTransed;
                               }

                       } else {
                               //为ipad写的
                              api.toast({
                                      msg : '对不起,消息不能为空',
                                      duration : 2000,
                                      location : "middle"
                               });
                       }

                }
        });

        //加载录音按钮事件
        /**
         press(按下录音按钮)
         press_cancel(松开录音按钮)
         move_out(按下录音按钮后,从按钮移出)
         move_out_cancel(按下录音按钮后,从按钮移出并松开按钮)
         move_in(move_out事件后,重新移入按钮区域)
         */
        chatBox.addEventListener({
                target :'recordBtn',
                name :'press'
        }, function(ret, err) {
                //开始录音
               startRecord();
        });
        //(松开录音按钮)
        chatBox.addEventListener({
                target :'recordBtn',
                name :'press_cancel'
        }, function(ret, err) {
                stopRecord();
        });
        //move_out(按下录音按钮后,从按钮移出)
        chatBox.addEventListener({
                target :'recordBtn',
                name :'move_out'
        }, function(ret, err) {
               api.execScript({
                       name : '',
                       frameName : 'hh_voice_window',
                       script : 'moveOut()'
                });
        });
        //move_out_cancel(按下录音按钮后,从按钮移出并松开按钮)
        chatBox.addEventListener({
                target :'recordBtn',
                name :'move_out_cancel'
        }, function(ret, err) {
               api.stopRecord(function(ret, err) {
                       if (ret) {
                              removefile(ret.path);
                       }
                });
               api.closeFrame({
                       name : 'hh_voice_window'
                });
        });
        //move_in(move_out事件后,重新移入按钮区域)
        chatBox.addEventListener({
                target :'recordBtn',
                name :'move_in'
        }, function(ret, err) {
               api.execScript({
                       name : '',
                       frameName : 'hh_voice_window',
                       script : 'moveIn()'
                });
        });
        //输入框绑定
        /**
         *
         move(输入框所在区域弹动事件)
         change(输入框所在区域高度改变)
         showRecord(用户点击左侧语音按钮)
         showEmotion(用户点击表情按钮)
         showExtras(用户点击右侧附加功能按钮,如果 open 时传了 extras 参数才会有此回调)

         */
        //move(输入框所在区域弹动事件)  就是输入框收起和弹出变化
        chatBox.addEventListener({
                target :'inputBar',
                name : 'move'
        }, function(ret, err) {
                //                api.toast({msg: JSON.stringify(ret),location: 'top'}); //50
                //                          api.toast({msg: JSON.stringify(err),location:'middle'}); //283
                //点击输入框时会话界面高度发生变化
               setChatFrameByInputMove(ret.inputBarHeight, ret.panelHeight);
        });

        //change(输入框所在区域高度改变)
        chatBox.addEventListener({
                target :'inputBar',
                name :'change'
        }, function(ret, err) {
                //                api.toast({msg: JSON.stringify(ret),location: 'top'}); //50
                //                          api.toast({msg: JSON.stringify(err),location:'middle'}); //283
                //点击输入框时会话界面高度发生变化
               setChatFrameByInputChange(ret.inputBarHeight, ret.panelHeight);
        });
}

/**
*发送消息
* 周枫
* 2015.08.08
* @param {Object} sendMsg
*/
//function chat(sendMsg) {
//        //向会话列表页发送消息事件
//        api.sendEvent({
//                name :'sendMessage',
//                extra : {
//                       type : 'text',
//                       targetId : '' + target_id + '',
//                       content : sendMsg,
//                       conversationType : 'PRIVATE',
//                       extra : ''
//                }
//        })
//}

/**
* 删除文件
* 周枫
* 2015.08.10
* @param {Object} path
*/
function removefile(path) {
        var fs = api.require('fs');
        fs.remove({
                path : path
        }, function(ret, err) {
                if(ret.status != true) {
                       //                       api.alert({
                       //                              msg : err.msg
                       //                       }, function(ret, err){
                       //                              //coding...
                       //                       });
                }
        });
}

/**
*开始录音
* 周枫
* 2015.08.10
*/
function startRecord() {
        api.openFrame({
                name :'hh_voice_window',
                url :'../../html/huihua/hh_voice_window.html',
                scrollToTop :true,
                rect : {
                       x : 0,
                       y : 0,
                       w : api.winWidth,
                       h : api.winHeight - 50,
                },
        });
        //点击后播放开启录音的声音
        api.startPlay({
                path :'widget://res/LowBattery.mp3'
        }, function() {
               api.startRecord();
        });
}

/**
* 结束录音
* path:'',              //字符串,返回的音频地址
duration:0            //数字类型,音频的时长
* 周枫
* 2015.08.10
*/
function stopRecord() {
        api.stopRecord(function(ret, err) {
                if (ret) {
                       if (ret.duration == 0) {
                              api.execScript({
                                      name : '',
                                      frameName : 'hh_voice_window',
                                      script : 'moveShort()'
                               });
                              removefile(ret.path);
                       } else {
                              api.sendEvent({
                                      name : 'setVoice',
                                      extra : {
                                              voice_result : ret,
                                              conver_type :conver_type
                                      }
                               });
                               //                                                            api.execScript({
                               //                                                                    name :'',
                               //                                                                   frameName : 'hh_chat_frame',
                               //                                                                    script :'sendVoi("' + ret.path + '",' + ret.duration + ')'
                               //                                                            });
                               //
                               //                             sendVoiceMessage(mytoken, ret.path, ret.duration);
                               //                                                    $api.val($api.byId("record_hid"), ret.path);
                       }
                       setTimeout("api.closeFrame({name:'hh_voice_window'})", 400);
                }
        });
}

/**
* 点击输入框时会话界面高度发生变化
*  inputBarHeight: 50,    //数字类型;输入框及左右按钮整体区域的高度,仅当监听 inputBar 的 move 和change 事件时本参数有值
panelHeight: 300       //数字类型;输入框下边缘距离屏幕底部的高度,仅当监听 inputBar 的 move 和change 事件时本参数有值
* 周枫
* 2015.08.10
*/
function setChatFrameByInputMove(inputBarHeight, panelHeight) {
        if (inputBarHeight > 0) {//输入框打开时
               api.setFrameAttr({
                       name : 'hh_chat_frame',
                       rect : {
                               x : 0,
                               y :header_h,
                               w :api.winWidth,
                               h :api.winHeight - header_h - inputBarHeight - panelHeight - 35,
                       },
                });
        } else {//关闭时
               api.setFrameAttr({
                       name : 'chatFrame',
                       rect : {
                               x : 0,
                               y :header_h,
                               w :api.winWidth,
                               h :api.winHeight - header_h - inputBarHeight - 35,
                       },
                });
        }
        setTimeout('setBottom()', 200);
}

/**
* 输入框内文字行数,现设置为最多4行
*  inputBarHeight: 50,    //数字类型;输入框及左右按钮整体区域的高度,仅当监听 inputBar 的 move 和change 事件时本参数有值
panelHeight: 300       //数字类型;输入框下边缘距离屏幕底部的高度,仅当监听 inputBar 的 move 和change 事件时本参数有值
* 周枫
* 2015.08.10
*/
function setChatFrameByInputChange(inputBarHeight, panelHeight) {
        api.setFrameAttr({
                name :'hh_chat_frame',
                rect : {
                       x : 0,
                       y : header_h,
                       w : api.winWidth,
                       h : api.winHeight - header_h - inputBarHeight -panelHeight - 35,
                },
        });
        setTimeout('setBottom()', 200);
}

function setBottom() {
        api.execScript({
                name : '',
                frameName :'hh_chat_frame',
                script :'goBottom()'
        });
}

/**
*  通过系统相册或拍照获取图片和视频
sourceType:(可选项)图片源类型,从相册、图片库或相机获取图片,  library:图片库,camera:相机,album:相册
encodingType:(可选项)返回图片类型,jpg或png,默认值:png
mediaValue:(可选项)媒体类型,图片或视频 ,pic:图片,video:视频
destinationType:(可选项)返回数据类型,指定返回图片地址或图片经过base64编码后的字符串
allowEdit:(可选项)是否可以选择图片后进行编辑,只支持iOS,默认值:false
quality:(可选项)图片质量,只针对jpg格式图片(0-100整数),默认值:50
targetWidth:(可选项)压缩后的图片宽度,图片会按比例适配此宽度,默认值:原图宽度
targetHeight:(可选项)压缩后的图片高度,图片会按比例适配此高度,默认值:原图高度
saveToPhotoAlbum:(可选项)拍照或录制视频后是否保存到相册,默认值:false
callback
{
data:"",               //图片路径
base64Data:"",          //base64数据,destinationType为base64时返回
duration:0              //视频时长(数字类型)
}
* 通过系统相册或拍照获取图片和视频
* 周枫
* 2015.08.11
* @param {Object} sourceType
*/
function getPicture(sourceType) {
        switch(sourceType) {
                case'camera':
                       //获取一张图片
                       api.getPicture({
                              sourceType : sourceType,
                              encodingType : 'png',
                              mediaValue : 'pic',
                               allowEdit: false,
                               quality :80,
                               //               targetWidth : 100,
                               //               targetHeight : 1280,
                              saveToPhotoAlbum : true
                       }, function(ret, err) {
                               if (ret){
                                      var imgSrc = ret.data;
                                      if (imgSrc != "") {
                                              api.sendEvent({
                                                     name : 'setPicurl',
                                                     extra : {
                                                             imgSrc : imgSrc,
                                                             pic_source : 'camera',
                                                             conver_type : conver_type
                                                     }
                                              });
                                      }
                                      //                                      sendPic(imgSrc);
                               }
                       });
                       break;
                case 'album':
                       //UIMediaScanner 是一个多媒体扫描器,可扫描系统的图片、视频等多媒体资源
                       var obj = api.require('UIMediaScanner');
                       obj.open({
                               //(可选项)图片显示的列数,须大于1
                               column :4,
                               //(可选项)图片排序方式,asc(旧->新),desc(新->旧)
                               sort : {
                                      key : 'time',
                                      order : 'desc'
                               },
                               //(可选项)模块各部分的文字内容
                               texts : {
                                      stateText : '已选择*项',
                                      cancelText : '取消',
                                      finishText : '完成'
                               },
                               styles :{
                                      bg : '#fff',
                                      mark : {
                                              icon : '',
                                              position :'top_right',
                                              size : 20
                                      },
                                      nav : {
                                              bg : '#eee',
                                              stateColor : '#000',
                                              stateSize : 18,
                                              cancleBg :'rgba(0,0,0,0)',
                                              cancelColor : '#000',
                                              cancelSize : 18,
                                              finishBg :'rgba(0,0,0,0)',
                                              finishColor : '#000',
                                              finishSize : 18
                                      }
                               }
                       }, function(ret) {
                              //callback
                               // list:[{                   //数组类型;返回选定的资源信息数组
                               //path:'',                   //字符串类型;资源路径,返回资源在本地的绝对路径
                              //thumbPath: '',              //字符串类型;缩略图路径,返回资源在本地的绝对路径
                               //suffix:'',                 //字符串类型;文件后缀名,如:png,jpg,mp4
                               //size:1048576,               //数字类型;资源大小,单位(Bytes)
                               //time:'2015-06-29 15:49'     //字符串类型;资源创建时间,格式:yyyy-MM-dd HH:mm:ss
                               //}]
                               if (ret){
                                      if (getJsonObjLength(ret.list) != 0) {
                                              api.sendEvent({
                                                     name : 'setPicurl',
                                                     extra : {
                                                             image_list : ret.list,
                                                             pic_source : 'album',
                                                             conver_type : conver_type
                                                     }
                                              });
                                      }
                               }
                       });
                       break;
        }

}

/**
* 根据群组id获取群组信息页面
* 周枫
* 2015.09.11
*/
function showGroupListById() {
        getGroupListById(function(group_list) {
                api.openWin({
                       name : 'hh_group_window',
                       url : 'hh_group_window.html',
                       bounces : true,
                       animation : 'push',
                       delay : 1,
                       scrollToTop : true,
                       pageParam : {
                              'targetId' : target_id,
                              'header_h' : header_h,
                              'group_list' : group_list,
                              'group_name' : person_name
                       },
                       rect : {
                               x : 0,
                               y :'auto',
                               w :'auto',
                               h :'auto'
                       }
                });
        });
}

function getGroupListById(callback) {
        api.ajax({
                url :BASE_URL_ACTION + '/dsjxt/getPersonInfoByGroupId?groupId=' + target_id +'&app_type=' + BASE_APP_TYPE,
                method :'get',
                dataType :'text'
        }, function(ret, err) {
                var obj =eval('(' + ret + ')');
                if (obj) {
                       callback(obj);
                }
        });
}

function initHeaer() {
        //如果是群组会话,则显示右上角群组成员
        if (conver_type == 'GROUP') {
               $api.css($api.byId('menu'), 'display:inline;');
        }
        $api.html($api.byId('mTitle'),person_name);
}
   hh_chat_frame.html
   
<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8">
                <!-- html5:在创建html时为了防止页面缩放等不兼容效果,要创建个viewport  -->

                <metaname="viewport"
content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
                <!-- 在IOS设备上,有时会将数字转为手机号,这里也要禁止下 -->
                <metaname="format-detection" content="telephone=no"/>
    <title>会话页面frame</title>
    <link rel="stylesheet" type="text/css"href="../../css/aui.css" />
    <style>
            .history-date { font-size:12px; text-align: center;}
            .pic_thumb {max-width:100px;}
    </style>
</head>
<body>
        <div class="aui-content aui-content-padded"style="padding-top:10px; padding-bottom: 10px;"id="message-content">

        <!--<divclass="aui-chat-sender history-date"
id="hh_update_div"><p>上拉加载会话记录...</p></div>-->
        <!--<divclass="aui-chat-sender">
            <div class="aui-chat-sender-avatar"><imgsrc="../../image/person/demo_m.png"></div>
            <divclass="aui-chat-sender-cont">
                <divclass="aui-chat-right-triangle"></div>

               <span>6''<img id="voice_123" alt="98"
src="../../image/chatBox/msendlog.png" width="40px"height="30px"
onclick="playVoice('123','path',0);"/></span>
            </div>
        </div>
        <divclass="aui-chat-receiver">
            <divclass="aui-chat-receiver-avatar"><imgsrc="../../image/person/demo_w.png"></div>
            <divclass="aui-chat-receiver-cont">
                <divclass="aui-chat-left-triangle"></div>
                <span>你好!</span>
            </div>
        </div>
        <div class="aui-chat-senderhistory-date"><p>7-16 20:00</p></div>
        <divclass="aui-chat-sender">
            <divclass="aui-chat-sender-avatar"><imgsrc="../../image/person/demo_m.png"></div>
            <divstyle="float:right; margin: 0 10px 10px 20px; "><em>[图片]</em></div>
            <divclass="aui-chat-sender-cont">
                <divclass="aui-chat-right-triangle"></div>-->

                   <!--<span><img style=" width: 10px; height:
10px; margin-right: 10px; " alt="99"
src="../../image/loading_more.gif"/></span>-->   
<!--<span>Hello!!</span>-->
            <!--</div>
        </div>
        <divclass="aui-chat-receiver">
            <divclass="aui-chat-receiver-avatar"><imgsrc="../../image/person/demo_w.png"></div>
            <divclass="aui-chat-receiver-title"><em>[图片]</em></div>
            <divclass="aui-chat-receiver-cont">
                <divclass="aui-chat-left-triangle"></div>
                <span>你好!</span>
            </div>
        </div>-->
    </div>
</body>
<script type="text/javascript"src="../../script/api.js"></script>
<script type="text/javascript"src="../../script/date.js"></script>
<script type="text/javascript"src="../../script/base_config.js"></script>
<script type="text/javascript"src="../../script/huihua/hh_chat_frame.js"></script>
</html>
hh_chat_frame.js
//最后一条消息的 Id,获取此消息之前的 count 条消息,没有消息第一次调用应设置为: -1
var old_msg_id = -1;
//定义发送人
var target_id;

var conver_type;

apiready = function() {
        //当前target_id的历史聊天记录
        var historyMessages =api.pageParam.historyMessages;
        target_id = api.pageParam.target_id;
        old_msg_id = api.pageParam.old_msg_id;
        conver_type = api.pageParam.conver_type;
        //页面加载时获取历史信息
        setTimeout('initGetHistory("' +target_id + '", "' + old_msg_id + '", "' + conver_type +'", ' + 10 + ')', '200');
        setTimeout('goBottom()', 500);
        //监听收到新消息写入
        api.addEventListener({
                name :'getNewMessage'
        }, function(ret) {
                if (ret&& ret.value) {
                       //监听成功
                       var newMessageData = ret.value;
                       //                                             api.alert({
                       //                                                     msg :JSON.stringify(newMessageData)
                       //                                             });
                       //                      api.alert({msg:newMessageData.data.objectName });
                       //根据targetId和当前会话用户id判断一下,如果相等则写入
                       if (newMessageData.data.targetId == target_id){
                               //获取会话列表页数据
                               varhh_index_list = $api.getStorage('hh_index_list');
                               //会话头像
                               varreceive_img;
                              
                               for (vari = 0; i < hh_index_list.length; i++) {

                                      if ((newMessageData.data.targetId == target_id) &&
(hh_index_list.targetId == newMessageData.data.senderUserId)) {
                                              receive_img =hh_index_list.avatar_url;
                                              break;
                                      }

                                      if ((newMessageData.data.targetId == target_id) &&
(hh_index_list.targetId != newMessageData.data.senderUserId)) {
                                              receive_img =BASE_URL_ACTION + '/html/thumb/Material/0D/0D7B3741-0C3D-D93C-BA3D-74668271F934.jpg@50w_50h_100Q_1x.jpg';
                                      }
                               }
                               //如果是群组则显示发送人姓名
                               if(newMessageData.data.conversationType == "GROUP") {
                                      var group_data = $api.getStorage('group_data');
                                      var sender_name =group_data[newMessageData.data.senderUserId];
                                      switch(newMessageData.data.objectName) {
                                              case 'RC:TxtMsg':

                                                     $api.append($api.byId("message-content"), '<div
class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-title"><em>'
+ sender_name + '</em></div><div
class="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
newMessageData.data.content.text +
'</span></div></div>');
                                                     break;
                                              case 'RC:ImgMsg':

                                                     $api.append($api.byId("message-content"), '<div
class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-title"><em>'
+ sender_name + '</em></div><div
class="aui-chat-receiver-img"><div
class="aui-chat-left-triangle"></div><span><img
class="pic_thumb" src="' +
newMessageData.data.content.thumbPath +
'"></span></div></div>');
                                                     break;
                                              case 'RC:VcMsg':
                                                     //                                                                                   alert('11111111111111111' + JSON.stringify(newMessageData));
                                                     var con = "";

                                                     con += '<divclass="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-title"><em>'
+ sender_name + '</em></div><div
class="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
newMessageData.data.content.duration + '\'\'<img id="voice_' +
newMessageData.data.messageId + '" alt="97"
src="../../image/chatBox/mrecelog.png" width="40px" height="30px"
onclick="playVoice(\'' + newMessageData.data.messageId + '\',\'' +
newMessageData.data.content.voicePath +
'\',1);"/></span></div></div>';
                                                     //                                      alert(con);
                                                     $api.append($api.byId("message-content"), con);
                                                     break;
                                      }
                               } else {
                                      switch(newMessageData.data.objectName) {
                                              case 'RC:TxtMsg':

                                                     $api.append($api.byId("message-content"), '<div
class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
newMessageData.data.content.text +
'</span></div></div>');
                                                     break;
                                              case 'RC:ImgMsg':

                                                     $api.append($api.byId("message-content"), '<div
class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-img"><div
class="aui-chat-left-triangle"></div><span><img
class="pic_thumb" src="' +
newMessageData.data.content.thumbPath +
'"></span></div></div>');
                                                     break;
                                              case 'RC:VcMsg':
                                                     //                                                                                   alert('11111111111111111' + JSON.stringify(newMessageData));
                                                     var con = "";

                                                     con += '<divclass="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
newMessageData.data.content.duration + '\'\'<img id="voice_' +
newMessageData.data.messageId + '" alt="97"
src="../../image/chatBox/mrecelog.png" width="40px"height="30px"
onclick="playVoice(\'' + newMessageData.data.messageId + '\',\'' +
newMessageData.data.content.voicePath +
'\',1);"/></span></div></div>';
                                                     //                                      alert(con);
                                                     $api.append($api.byId("message-content"), con);
                                                     break;
                                      }
                               }

                       }
                }
                goBottom();
        });

        //监听发送新消息写入,这个事件主要来处理发送消息插入到会话窗口中
        api.addEventListener({
                name :'insertSendMessage'
        }, function(ret) {
                if (ret&& ret.value) {
                       var newMessageData = ret.value;
                       //我的头像
                       var sender_img = $api.getStorage('avatar_url');
                       //                                                                    alert(JSON.stringify(newMessageData));
                       //RC:TxtMsg:文本消息,RC:VcMsg:语音消息,RC:ImgMsg:图片消息,RCBSMsg:位置消息
                       switch (newMessageData.data.message.objectName){
                               case'RC:TxtMsg':
                                      //页面写入发送消息

                                      $api.append($api.byId("message-content"),'<div
class="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img src="' + sender_img +
'"></div><divclass="aui-chat-sender-cont"><div
class="aui-chat-right-triangle"></div><span>' +
newMessageData.data.message.content.text +
'</span></div></div>');
                                      break;
                               case'RC:ImgMsg':
                                      if (api.systemType == 'ios') {

                                              $api.append($api.byId("message-content"),'<div
class="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img src="' + sender_img +
'"></div><div class="aui-chat-sender-img"><div
class="aui-chat-right-triangle"></div><span><img
class="pic_thumb" src="' +
newMessageData.data.message.content.thumbPath +
'"></span></div></div>');
                                      } else if (api.systemType == 'android') {

                                             $api.append($api.byId("message-content"), '<div
class="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img src="' + sender_img +
'"></div><div class="aui-chat-sender-img"><div
class="aui-chat-right-triangle"></div><span><img
class="pic_thumb" src="' +
newMessageData.data.message.content.thumbPath +
'"></span></div></div>');
                                      }

                                      break;
                               case'RC:VcMsg':
                                      var con = "";

                                      con += '<divclass="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img src="' + sender_img +
'"></div><divclass="aui-chat-sender-cont"><div
class="aui-chat-right-triangle"></div><span>' +
newMessageData.data.message.content.duration + '\'\'<img id="voice_' +
newMessageData.data.message.messageId + '" alt="98"
src="../../image/chatBox/msendlog.png" width="40px"height="30px"
onclick="playVoice(\'' + newMessageData.data.message.messageId + '\',\''
+ newMessageData.data.message.content.voicePath +
'\',0);"/></span></div></div>';
                                      $api.append($api.byId("message-content"), con);
                                      break;
                       }

                }
                goBottom();
        });
        //绑定下拉刷新历史会话事件
        api.setRefreshHeaderInfo({
                visible :true,
                loadingImg :'widget://image/local_icon_refresh.png',
                bgColor :'#F5F5F5',
                textColor :'#8E8E8E',
                textDown : '下拉加载更多...',
                textUp : '松开加载...',
                showTime :true
        }, function(ret, err) {
                //从服务器加载数据,完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态
                //调用获取历史会话监听
               initGetHistory(target_id, old_msg_id, conver_type, 20);
        });
        //获取历史会话监听,渲染页面
        api.addEventListener({
                name :'setHistory'
        }, function(ret) {
                //               api.alert({
                //                      msg:'333:'+JSON.stringify(ret)
                //     },function(ret,err){
                //             //coding...
                //     });
                if (ret&& ret.value) {
                       var historyMessages = ret.value.data;
                       //                       api.alert({
                       //                              msg:JSON.stringify(historyMessages)
                       //         },function(ret,err){
                       //                 //coding...
                       //          });
                       if (historyMessages != '') {
                               var con ='';
                               //倒叙循环会话记录
                               for (vari = getJsonObjLength(historyMessages) - 1; i >= 0; i--) {
                                      var targetid = historyMessages.targetId;
                                      var content = '';
                                      //文字还是图片还是声音 RC:TxtMsg:文本消息,RC:VcMsg:语音消息,RC:ImgMsg:图片消息,RCBSMsg:位置消息
                                      var type = historyMessages.objectName;
                                      //SEND 还是 RECEVIE
                                      var dir = historyMessages.messageDirection;
                                      var start = historyMessages.sentTime;
                                      //                                      var end = new Date();
                                      var g_time = new getTimeTemplate();

                                      //我的头像
                                      var sender_img = $api.getStorage('avatar_url');
                                      //计算会话时间
                                      if (i == historyMessages.length - 1) {
                                              con += '<divclass="aui-chat-sender history-date"><p>' +g_time.getTime(start, 1) + '</p></div>';
                                      } else {
                                              var M1 =historyMessages.sentTime;
                                              var M2 = historyMessages[i+ 1].sentTime;
                                              if ((M1 - M2) >=180 * 1000) {
                                                     con += '<div class="aui-chat-senderhistory-date"><p>' + g_time.getTime(start, 1) + '</p></div>';
                                              }
                                      }
                                      //加载会话内容
                                      if (dir == 'SEND') {
                                              switch(type) {
                                                     case 'RC:TxtMsg':

                                                             con += '<divclass="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img src="' + sender_img +
'"></div><divclass="aui-chat-sender-cont"><div
class="aui-chat-right-triangle"></div><span>' +
historyMessages.content.text +
'</span></div></div>';
                                                             break;
                                                     case 'RC:VcMsg':

                                                             con += '<divclass="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img src="' + sender_img +
'"></div><div class="aui-chat-sender-cont"><div
class="aui-chat-right-triangle"></div><span>' +
historyMessages.content.duration + '\'\'<img id="voice_' +
historyMessages.messageId + '" alt="98"
src="../../image/chatBox/msendlog.png" width="40px"height="30px"
onclick="playVoice(\'' + historyMessages.messageId + '\',\'' +
historyMessages.content.voicePath +
'\',0);"/></span></div></div>';
                                                             break;
                                                     case 'RC:ImgMsg':

                                                             con += '<divclass="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img src="' + sender_img +
'"></div><div class="aui-chat-sender-img"><div
class="aui-chat-right-triangle"></div><span><img
class="pic_thumb" src="' +
historyMessages.content.thumbPath +
'"></span></div></div>'
                                                             break;
                                              }

                                              //渲染发送会话

                                              //                                     $api.prepend($api.byId("message-content"), '<div
class="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img
src="../../image/person/demo2.png"></div><div
class="aui-chat-sender-cont"><div
class="aui-chat-right-triangle"></div><span>' +
historyMessages.content.text +
'</span></div></div>');
                                      } else {
                                              //获取会话列表页数据
                                              var hh_index_list =$api.getStorage('hh_index_list');
                                              //会话头像
                                              var receive_img;
                                              for (var j = 0; j< hh_index_list.length; j++) {
                                                     if (hh_index_list[j].targetId == historyMessages.senderUserId){
                                                             receive_img =hh_index_list[j].avatar_url;
                                                     } else {
                                                             //                                                            receive_img = '../../image/person/demo_m.png';
                                                             receive_img = BASE_URL_ACTION +'/html/thumb/Material/0D/0D7B3741-0C3D-D93C-BA3D-74668271F934.jpg@50w_50h_100Q_1x.jpg';
                                                     }
                                              }
                                              if(historyMessages.conversationType == "GROUP") {
                                                     //获取群组人员姓名
                                                     var group_data = $api.getStorage('group_data');
                                                     var sender_name = group_data[historyMessages.senderUserId];
                                                     switch(type) {
                                                             case 'RC:TxtMsg':

                                                                    con += '<div class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-title"><em>'
+ sender_name + '</em></div><div
class="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
historyMessages.content.text +
'</span></div></div>';
                                                                    break;
                                                             case 'RC:VcMsg':

                                                                    con += '<div class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-title"><em>'
+ sender_name + '</em></div><div
class="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
historyMessages.content.duration + '\'\'<img id="voice_' +
historyMessages.messageId + '" alt="97"
src="../../image/chatBox/mrecelog.png" width="40px"height="30px"
onclick="playVoice(\'' + historyMessages.messageId + '\',\'' +
historyMessages.content.voicePath +
'\',1);"/></span></div></div>';
                                                                    break;
                                                             case 'RC:ImgMsg':

                                                                    con += '<div class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><div class="aui-chat-receiver-title"><em>'
+ sender_name + '</em></div><div
class="aui-chat-receiver-img"><div
class="aui-chat-left-triangle"></div><span><img
class="pic_thumb" src="' +
historyMessages.content.thumbPath +
'"></span></div></div>'
                                                                    break;

                                                             //渲染接收会话

                                                             //                                     $api.prepend($api.byId("message-content"), '<div
class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img
src="../../image/person/demo2.png"></div><div
class="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
historyMessages.content.text +
'</span></div></div>');
                                                     }
                                              } else {
                                                     switch(type) {
                                                             case 'RC:TxtMsg':

                                                                    con += '<div class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
historyMessages.content.text +
'</span></div></div>';
                                                                    break;
                                                             case 'RC:VcMsg':

                                                                    con += '<div class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
historyMessages.content.duration + '\'\'<img id="voice_' +
historyMessages.messageId + '" alt="97"
src="../../image/chatBox/mrecelog.png" width="40px"height="30px"
onclick="playVoice(\'' + historyMessages.messageId + '\',\'' +
historyMessages.content.voicePath +
'\',1);"/></span></div></div>';
                                                                    break;
                                                             case 'RC:ImgMsg':

                                                                    con += '<div class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img src="' + receive_img+
'"></div><divclass="aui-chat-receiver-img"><div
class="aui-chat-left-triangle"></div><span><img
class="pic_thumb" src="' +
historyMessages.content.thumbPath +
'"></span></div></div>'
                                                                    break;

                                                             //渲染接收会话

                                                             //                                     $api.prepend($api.byId("message-content"), '<div
class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img
src="../../image/person/demo2.png"></div><div
class="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
historyMessages.content.text +
'</span></div></div>');
                                                     }
                                              }

                                      }
                                      //获取刷新后最后一条ID
                                      if (i == historyMessages.length - 1) {
                                              old_msg_id =historyMessages.messageId;
                                      }
                               }
                               //                             $api.css($api.byId('hh_update_div'), 'display:none;');
                               //                              api.alert({
                               //                                     msg: con
                               //             },function(ret,err){
                               //                    //coding...
                               //             });
                               //加载历史聊天记录
                              $api.prepend($api.byId("message-content"), con);
                       }

                }
                //通知顶部下拉刷新数据加载完毕,组件会恢复到默认状态
               api.refreshHeaderLoadDone();
                //隐藏进度提示框
               api.hideProgress();
                if(old_msg_id == -1) {
                       goBottom();
                }
        });

        //       //监听发送新消息写入,这个事件主要来处理发送消息插入到会话窗口中
        //       api.addEventListener({
        //               name : 'insertSendMessage'
        //       }, function(ret) {
        //               if (ret && ret.value) {
        //                       varnewMessageData = ret.value;
        //                       //                      alert(JSON.stringify(newMessageData));
        //                       //页面写入发送消息

        //                      $api.append($api.byId("message-content"), '<div
class="aui-chat-sender"><div
class="aui-chat-sender-avatar"><img
src="../../image/person/demo2.png"></div><div
class="aui-chat-sender-cont"><div
class="aui-chat-right-triangle"></div><span>' +
newMessageData.data.message.content.text +
'</span></div></div>');
        //               }
        //       });
        //       //监听收到新消息写入
        //       api.addEventListener({
        //               name : 'getNewMessage'
        //       }, function(ret) {
        //               if (ret && ret.value) {
        //                       //监听成功
        //                       varnewMessageData = ret.value;
        //                       //根据targetId和当前会话用户id判断一下,如果相等则写入
        //                       if(newMessageData.data.targetId == targetId) {

        //                             $api.append($api.byId("message-content"), '<div
class="aui-chat-receiver"><div
class="aui-chat-receiver-avatar"><img
src="../../image/person/demo2.png"></div><div
class="aui-chat-receiver-cont"><div
class="aui-chat-left-triangle"></div><span>' +
newMessageData.data.content.text +
'</span></div></div>');
        //                       }
        //               }
        //       });
        //绑定发送多个图片的监听
        sendPic();
        //发送语音消息
        sendVoi();
        //从后台返回到前台
        reAppFromBack();
        //下拉刷新数据
        //        refreshHeaderInfo();
}
/**
*滚动页面底部
* 周枫
* 2015.08.11
*/
function goBottom() {
       document.getElementsByTagName('body')[0].scrollTop =document.getElementsByTagName('body')[0].scrollHeight;
}

/**
* 发送文本消息
* 周枫
* 2015.08.08
* @param {Object} sendMsg
*/
function sendText(sendMsg, conver_type) {
        //向会话列表页发送消息事件
        api.sendEvent({
                name :'sendMessage',
                extra : {
                       type : 'text',
                       targetId : '' + target_id + '',
                       content : sendMsg,
                       conversationType : conver_type,
                       extra : ''
                }
        })
}

/**
* 发送图片消息
* 周枫
* 2015.08.11
* @param {Object} img_url
*/
function sendPic() {
        api.addEventListener({
                name :'setPicurl'
        }, function(ret) {
                if (ret&& ret.value) {
                       var value = ret.value;
                       //                      alert(JSON.stringify(value));
                       switch(value.pic_source) {
                               case'camera':
                                      //向会话列表页发送消息事件
                                      api.sendEvent({
                                              name : 'sendMessage',
                                              extra : {
                                                     type : 'pic',
                                                     targetId : '' + target_id + '',
                                                     imgSrc : value.imgSrc,
                                                     conversationType : value.conver_type,
                                                     pic_source : value.pic_source,
                                                     extra : ''
                                              }
                                      })
                                      break;
                               case'album':
                                      //向会话列表页发送消息事件
                                      api.sendEvent({
                                              name : 'sendMessage',
                                              extra : {
                                                     type : 'pic',
                                                     targetId : '' + target_id + '',
                                                     img_list : value.image_list,
                                                     conversationType : value.conver_type,
                                                     pic_source : value.pic_source,
                                                     extra : ''
                                              }
                                      })
                                      break;
                       }

                }
        });

}

/**
* 发送语音消息
* 周枫
* 2015.08.12
*/
function sendVoi() {
        api.addEventListener({
                name :'setVoice'
        }, function(ret) {
                if (ret&& ret.value) {
                       var value = ret.value.voice_result;
                       //                                             alert(JSON.stringify(value));
                       //向会话列表页发送消息事件
                       api.sendEvent({
                               name :'sendMessage',
                               extra : {
                                      type : 'voi',
                                      targetId : '' + target_id + '',
                                      voicePath : value.path,
                                      duration : value.duration,
                                      conversationType : ret.value.conver_type,
                                      extra : ''
                               }
                       })
                }
        });
}

/**
* 展示图片
* 周枫
* 2015.08.12
* @param {Object} img_url
*/
function openImage(img_url) {
        var img_urls = new Array();
        img_urls[0] = img_url;
        var obj = api.require('imageBrowser');
        obj.openImages({
                imageUrls :img_urls,
                //是否以九宫格方式显示图片
                showList :false,
                activeIndex :0
        });
}

/**
* 播放语音
* 周枫
* 2015.08.12
*/
function playVoice(id, voicePath, whosend) {
        var objs =document.getElementsByTagName("img");
        for (var i = 0; i < objs.length; i++){
                if(objs.alt == '98') {
                       objs.src = '../../image/chatBox/msendlog.png';
                } else if(objs.alt == '97') {
                       objs.src ='../../image/chatBox/mrecelog.png';
                }
        }
        api.stopPlay();
        if (whosend == 0) {
                document.getElementById('voice_'+ id).src = '../../image/chatBox/msendgif.gif';
        } else {
               document.getElementById('voice_' + id).src ='../../image/chatBox/mrecegif.gif';
        }
        api.startPlay({
                path :voicePath
        }, function() {
                if (whosend== 0) {
                       document.getElementById('voice_' + id).src ='../../image/chatBox/msendlog.png';
                } else {
                       document.getElementById('voice_' + id).src ='../../image/chatBox/mrecelog.png';
                }
        });
        //       alert(duration+','+voicePath);
}

/**
* 获取历史聊天记录
* 周枫
* 2015.08.20
* @param {Object} target_id 会话人
* @param {Object} old_msg_id 最新会话id
* @param {Object} conver_type 会话类型
* @param {Object} msg_count 获取条数
*/
function initGetHistory(target_id, old_msg_id, conver_type, msg_count) {
        api.sendEvent({
                name :'getHistory',
                extra : {
                       type : conver_type,
                       old_msg_id : old_msg_id,
                       target_id : target_id,
                       msg_count : msg_count
                }
        });
}

/**
* 从后台返回
* 周枫
* 2015.09.02
*/
function reAppFromBack() {
        api.addEventListener({
                name :'resume'
        }, function(ret, err) {
                goBottom();
        });
}

//点击出现气泡按钮功能,暂未实现
//window.addEventListener("touchstart", showBubbleMenu);
//
//function showBubbleMenu(event) {
//        var touch = event.touches[0];
//        var centerX = touch.clientX;
//        var centerY = touch.clientY;
//        var bubbleMenu =api.require('bubbleMenu');
//        var btnArray = [{
//               "title" : "复制"
//        }, {
//               "title" : "删除"
//        }];
//
//        bubbleMenu.open({
//                centerX :centerX,
//                centerY :centerY,
//                btnArray :btnArray,
//                fixedOn :api.frameName
//        }, function(ret, err) {
//                var btn =btnArray[ret.index];
//                api.toast({
//                       msg : '您点击了:' +btn.title + '按钮',
//                       location : 'top'
//                });
//        });
//}
    5. 通讯录页面,包括txl_index_window.html和txl_content_window.html两部分,具体如下
txl_index_window.html
<!DOCTYPE html>
<html>
        <head>
                <metacharset="utf-8">
                <!-- html5:在创建html时为了防止页面缩放等不兼容效果,要创建个viewport  -->

                <metaname="viewport"
content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
                <!-- 在IOS设备上,有时会将数字转为手机号,这里也要禁止下 -->
                <metaname="format-detection" content="telephone=no"/>
                <title>通讯录列表</title>
                <linkrel="stylesheet" type="text/css"href="../../css/aui.css" />
                <style>
                       body {
                       }
               </style>
        </head>
        <body>
               
                <scripttype="text/javascript" src="../../script/api.js"></script>
                <scripttype="text/javascript"src="../../script/template.js"></script>
                <scripttype="text/javascript"src="../../script/base_config.js"></script>
                <scripttype="text/javascript" src="../../script/tongxunlu/txl_index_window.js"></script>
        </body>
</html>
txl_index_window.js
//顶部header高度
var header_h;

//var listContact;
//定义user_id
var person_id;
//定义身份
var person_identity;
var footer_h;

var old_msg_id = -1;
apiready = function() {
        //定位header位置,留出上面电池等空隙,苹果需要
        var $header = $api.dom('header');
        $api.fixIos7Bar($header);
        header_h = api.pageParam.header_h;
        footer_h = api.pageParam.footer_h;
        //加载 listContact 模块
        listContact = api.require('listContact');
        person_id = $api.getStorage('person_id');
        person_identity =$api.getStorage('identity');

        //监听来自通讯录页面获取最新会话id的事件
        api.addEventListener({
                name :'setOldMessageId'
        }, function(ret) {

                if (ret&& ret.value) {
                       var value = ret.value;
                       old_msg_id = value.old_msg_id;
                }
        });
};

/**
* 加载通讯录列表
* 周枫
* 2015.08.18
*/
function loadData() {
        //根据用户ID获取通讯录数据
        getTongXunluByUserId(person_id,person_identity, function(txl_data) {
                //打开list
               listContact.open({
                       y : header_h,
                       w : api.winWidth,
                       h : api.winHeight - header_h - footer_h,
                       cellBgColor : '#FFFFFF',
                       cellHeight : 60,
                       indicator : {       },
                       data : txl_data,
                       borderColor: '#DDDFE3'
                },function(ret, err) {
                       api.hideProgress();
                       //       index:             //点击某个cell所在区域内的cell的下标
                       //  section:           //被点击的cell所在的区域的下标
                       //  key:              //被点击的cell的区域的key
                       //  clickType:           //点击类型,0-cell;1-右边按钮;2-左边的按钮
                       //  btnIndex:          //点击按钮时返回其下标
                       //点击index值
                       var r_i = ret.index;
                       //                       api.alert({
                       //                      msg:'r_i:'+r_i+',key:'+ret.key+',txl_data:'
                       //         },function(ret,err){
                       //                 //coding...
                       //          });
                       //json串长度
                       //                       var l_d =getJsonObjLength(txl_data.common);
                       //安卓下只有common乱序
                       //                       if (ret.key =='common') {
                       //                              if (api.systemType == 'android') {
                       //                                      //算出正确的值,因为安卓有BUG倒叙
                       //                                      r_i = l_d - (r_i + 1);
                       //                              }
                       //                       }

                       //名字
                       var title = txl_data[ret.key][r_i].title;
                       //类型: 1:群组 2:学校 3:班级 4:好友
                       var t = txl_data[ret.key][r_i].t;
                       //登录名,target_id
                       var target_id =txl_data[ret.key][r_i].login_name;

                       //                       api.alert({

                       //                       msg:
'target_id:'+target_id+',id:'+id+',title:'+title+',t:'+t+',key:'+ret.key
+ ",index:" + ret.index+',section:'+ret.section
                       //                   });
                       if (t == 2 || t == 3) {
                               //                              hideMyself();
                               //班级、学校的ID
                               var id =txl_data[ret.key][r_i].id;
                              api.openWin({
                                      name : 'txl_content_window',
                                      url : 'txl_content_window.html',
                                      bounces : true,
                                      scrollToTop : true,
                                      animation : 'push',
                                      delay : 1,
                                      pageParam : {
                                              'header_h' :header_h,
                                              'id' : id,
                                              'title' : title,
                                              't' : t
                                      },
                                      rect : {
                                              x : 0,
                                              y : 'auto',
                                              w : 'auto',
                                              h : 'auto'
                                      }
                               });

                       } else if (t == 1) {
                               //初始化群组数据给融云服务器
                              initGroupInfoByUserId(function(init_group_result) {
                                      if (init_group_result.code == '200') {
                                              //群组
                                              var id =txl_data[ret.key][r_i].id;
                                              api.openWin({
                                                     name : 'txl_content_window',
                                                     url : 'txl_content_window.html',
                                                     bounces : true,
                                                     scrollToTop : true,
                                                     animation : 'push',
                                                     delay : 1,
                                                     pageParam : {
                                                             'header_h' : header_h,
                                                             'id' : id,
                                                             'title' : title,
                                                             't' : t
                                                     },
                                                     rect : {
                                                             x : 0,
                                                             y : 'auto',
                                                             w : 'auto',
                                                             h : 'auto'
                                                     }
                                              });
                                      }
                               });
                       } else if (t == 4) {
                               //发送target_id获取最新会话id
                              api.sendEvent({
                                      name : 'getOldMessageId',
                                      extra : {
                                              target_id :target_id,
                                              conver_type :'PRIVATE',
                                              count : 1
                                      }
                               });
                               //打开会话页面
                              setTimeout('execHhList("' + target_id + '","'+ title + '","RIVATE");', 500);
                       }
                       hideMyself();
                       closeMyself();
                });
        });

}

/**
* 根据用户ID获取通讯录数据
* 周枫
* 2015.08.21
*/
function getTongXunluByUserId(user_id, user_identity, callback) {
//api.alert({
//       msg:user_id+','+user_identity+','+BASE_APP_TYPE
//},function(ret,err){
//        //coding...
//});
        api.ajax({

                url :BASE_URL_ACTION + '/dsjxt/getAddressBookInfo?user_id=' + user_id
+ '&user_identity=' + user_identity + '&app_type=' +
BASE_APP_TYPE,
                method :'get',
                dataType :'text'
        }, function(ret, err) {
                var obj =eval('(' + ret + ')');
                if (obj) {
                       callback(obj);
                }
        });
}

/**
* 初始化群组数据给融云服务器
* 周枫
* 2015.09.10
*/
function initGroupInfoByUserId(callback) {
        var login_name =$api.getStorage('login_name');
        var person_id =$api.getStorage('person_id');
        var identity =$api.getStorage('identity');
        api.ajax({

                url :BASE_URL_ACTION + '/rongcloud/initGroupInfoByUserId?login_name='
+ login_name + '&identity=' + identity + '&person_id=' +
person_id + '&ip_addr=' + BASE_SERVER_IP + '&app_type=' +
BASE_APP_TYPE,
                method :'get',
                dataType :'json'
        }, function(ret, err) {
                if (ret.code!= '200') {
                       api.alert({
                               msg :"对不起,同步群组信息失败。"
                       });
                } else {
                       callback(ret);
                }
        });
}

/**
* 关闭列表
* 周枫
* 2015.08.18
*/
function closeMyself() {
        listContact.close();
        //       api.closeWin();
}

function hideMyself() {
        listContact.hide();
}

function showMyself() {
        listContact.show();
}

/**
* 延迟打开会话聊天界面
* 周枫
* 2015.08.24
* @param {Object} target_id
* @param {Object} title
* @param {Object} conver_type
* target_id, old_msg_id, person_name, conver_type
*/
function execHhList(target_id, title, conver_type) {
        api.execScript({
                name :'index',
                frameName :'hh_index',
                script :'openHhList("' + target_id + '",' + old_msg_id + ',"' + title +'","' + conver_type + '","txl_index");'
        });
}
通讯录内容页面txl_content_window.html
<!DOCTYPE html>
<html>
        <head>
                <meta charset="utf-8">
                <!-- html5:在创建html时为了防止页面缩放等不兼容效果,要创建个viewport  -->

                <metaname="viewport"
content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
                <!-- 在IOS设备上,有时会将数字转为手机号,这里也要禁止下 -->
                <metaname="format-detection" content="telephone=no"/>
                <title>会话列表</title>
                <linkrel="stylesheet" type="text/css"href="../../css/aui.css" />
                <style>
                .history-date{
                       font-size: 12px;
                }
               #message-content {
                       overflow-y: auto;
                }
                #wrap {
                       height: 100%;
                       display: -webkit-box;
                       display: -webkit-flex;
                       display: flex;
                       -webkit-box-orient: vertical;
                       -webkit-flex-flow: column;
                       flex-flow: column;
                }
                .topbar {
                       background: #1abc9c;
                       height: 50px;
                       /*border-bottom: 1px solid #DDDFE3;*/
                       line-height: 50px;
                       text-align: center;
                       display: none;
                       color: #ffffff;
                       font-size: 18px;
                }
                .activebar {
                       display: block;
                }
                .back {
                       position: absolute;
                       padding: 1px 10px 0px 10px;
                       height: 29px;
                       font-size: 15px;
                       /*color: #EFEDED;*/
                       /*z-index: 99999;*/
                }
        </style>
        </head>
        <body>
                <divid="wrap">
                       <header class="aui-bar aui-bar-navaui-bar-primary" id="aui-header">
                               <divid="cloud" class="topbar activebar">
                                      <div id="back" class="back"onclick="back()" tapmode="">
                                              <iclass="aui-iconfont aui-icon-left"></i>
                                      </div>
                                      <div class="mTitle"id="mTitle"></div>
                              </div>
                       </header>
                       <div class="aui-contentaui-content-padded" id="message-content">
                               <pclass="aui-text-center history-date"></p>
                       </div>
                </div>
        <scripttype="text/javascript"src="../../script/api.js"></script>
        <scripttype="text/javascript" src="../../script/base_config.js"></script>
        <scripttype="text/javascript"src="../../script/tongxunlu/txl_content_window.js"></script>
        </body>
        
</html>

txl_content_window.js
//顶部header高度
var header_h;
var id;
var title;
//类型: 1:群组 2:学校 3:班级 4:好友
var t;
apiready = function() {
        //定位header位置,留出上面电池等空隙,苹果需要
        var header = $api.byId('aui-header');
                       $api.fixStatusBar(header);

        header_h = api.pageParam.header_h;
        title = api.pageParam.title;
        $api.html($api.byId('mTitle'), title);
        id = api.pageParam.id;
        t = api.pageParam.t;

        //安卓关闭
        if (api.systemType == 'android') {
               backFromChatForAndroid();
        }

        //       api.execScript({
        //        name:'index',
        //                                             frameName : 'txl_index',
        //                                             script : 'closeMyself();'
        //                                      });

        //打开通讯录内容frame页面
        api.openFrame({
                name :'txl_content_frame',
                scrollToTop :true,
                url :'../../html/tongxunlu/txl_content_frame.html',
                pageParam : {
                       'id' : id,
                       't' : t,
                       'header_h' : header_h
                },
                rect : {
                       x : 0,
                       y : header_h,
                       w : api.winWidth,
                       h : api.winHeight - header_h,
                },
                //页面是否弹动为了下拉刷新使用
                bounces :true
        });
}
/**
*返回会话列表页面
* 周枫
* 2015.08.08
*/
function back() {
        api.execScript({
                name :'index',
                frameName :'txl_index',
                script :'showMyself();'
        });
        api.execScript({
                name :'index',
                frameName :'txl_index',
                script :'loadData();'
        });

        //关闭群组页面
        api.execScript({
                frameName :'txl_content_frame',
                script :'closeMyself();'
        });
        api.closeWin();
}

/**
* 安卓点击返回的时候
* 周枫
* 2015.08.31
*/
function backFromChatForAndroid() {
        api.addEventListener({
                name :"keyback"
        }, function(ret, err) {
                back();
        });
}

txl_content_frame.html
<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8">
                <!-- html5:在创建html时为了防止页面缩放等不兼容效果,要创建个viewport  -->

                <metaname="viewport"
content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
                <!-- 在IOS设备上,有时会将数字转为手机号,这里也要禁止下 -->
                <metaname="format-detection" content="telephone=no"/>
                <title>会话列表</title>
                <linkrel="stylesheet" type="text/css"href="../../css/aui.css" />
    <style>
            body{
                  
            }
    </style>
</head>
<body>
        <div id="txl_data"style="display:none; text-align: center";>暂无数据</div>
        
        <scripttype="text/javascript"src="../../script/api.js"></script>
        <scripttype="text/javascript"src="../../script/base_config.js"></script>
        <scripttype="text/javascript" src="../../script/tongxunlu/txl_content_frame.js"></script>
</body>

</html>
txl_content_frame.js
//var listContact;
var id;
var header_h;
var user_id, user_identity;
//类型: 1:群组 2:学校 3:班级 4:好友
var t;
var old_msg_id = -1;
apiready = function() {
        //加载 listContact 模块
        listContact = api.require('listContact');
        id = api.pageParam.id;
        t = api.pageParam.t;
        user_id = $api.getStorage('person_id');
        user_identity =$api.getStorage('identity');
        header_h = api.pageParam.header_h;
        loadData();

        //监听来自通讯录页面获取最新会话id的事件
        api.addEventListener({
                name :'setOldMessageId'
        }, function(ret) {

                if (ret&& ret.value) {
                       var value = ret.value;
                       old_msg_id = value.old_msg_id;
                }
        });
};

/**
* 加载通讯录列表
* 周枫
* 2015.08.18
*/
function loadData() {
        getGroupInfo(function(group_list) {
//        api.alert({
//               msg:JSON.stringify(group_list)
//  },function(ret,err){
//          //coding...
//  });

                //根据用户ID获取通讯录数据
                //       getTongXunluByUserId(person_id, person_identity,function(txl_data) {
                //打开list
               listContact.open({
                       y : header_h,
                       w : api.winWidth,
                       h : api.winHeight - header_h,
                       cellBgColor : '#FFFFFF',
                       cellHeight : 60,
                       borderColor: '#DDDFE3',
                       indicator : {        },
                       groupTitle:{
                               size : 12
                       },
                       data : group_list
                },function(ret, err) {
                       
                       //点击index值
                       var r_i = ret.index;
                       //聊天类型
                       var conver_type =group_list[ret.key][r_i].conver_type;
                       //名字
                       var title = group_list[ret.key][r_i].title;
                       var target_id;
                       //登录名,target_id
                       switch(conver_type) {
                               case"RIVATE":
                                      target_id = group_list[ret.key][r_i].login_name;
                                      break;
                               case"GROUP":
                                      target_id = group_list[ret.key][r_i].id;
                                      //根据id获取群组内人员信息
                                      getGroupInfoById(target_id);
                                      break;
                       }
//                       api.alert({
//                              msg:target_id
//          },function(ret,err){
//                 //coding...
//          });
                       //发送target_id获取最新会话id
                       api.sendEvent({
                               name :'getOldMessageId',
                               extra : {
                                      target_id : target_id,
                                      conver_type : conver_type,
                                      count : 1
                               }
                       });
                       //打开会话页面
                       setTimeout('execHhList("' + target_id +'","' + title + '","' + conver_type + '");', 500);
                });
                //       });
        });

}

/**
* 获取群组信息,包括学校教师,班级学生,群组列表
* 周枫
* 2015.08.25
*/
function getGroupInfo(callback) {
//        api.alert({
//                msg:'t:'+t+',id:'+id+',user_id:'+user_id+',user_identity:'+user_identity
//  },function(ret,err){
//          //coding...
//  });
        api.ajax({

                url :BASE_URL_ACTION + '/dsjxt/getGroupInfo?t=' + t + '&id=' + id
+ '&user_id=' + user_id + '&user_identity=' + user_identity
+'&app_type=' + BASE_APP_TYPE,
                method :'get',
                dataType :'text'
        }, function(ret, err) {
                var obj =eval('(' + ret + ')');
                if(getJsonObjLength(obj) == 0) {
                       $api.css($api.byId("txl_data"),"display:block;");
                } else {
                       if (obj) {
                              callback(obj);
                       }
                }
        });
}

/**
* 延迟打开会话聊天界面
* 周枫
* 2015.08.24
* @param {Object} target_id
* @param {Object} title
* @param {Object} conver_type
* target_id, old_msg_id, person_name, conver_type
*/
function execHhList(target_id, title, conver_type) {
        closeMyself();
        hideMyself();
        api.execScript({
                name :'index',
                frameName :'hh_index',
                script :'openHhList("' + target_id + '",' + old_msg_id + ',"' + title +'","' + conver_type + '","txl_content");'
        });
}



/**
* 关闭列表
* 周枫
* 2015.08.18
*/
//function closeMyself() {
////api.alert({
////msg:'123123'
////},function(ret,err){
////        //coding...
////});
//        listContact.close();
//        api.closeFrame();
//}

/**
* 关闭列表
* 周枫
* 2015.08.18
*/
function closeMyself() {
        listContact.close();
//        api.closeWin();
}

function hideMyself() {
        listContact.hide();
}

function showMyself() {
        listContact.show();
}
date.js
function getTimeTemplate() {
        
this.getTime = function(begin_l,  Interface) {
        var end = new Date();
        var begin = new Date(begin_l);

        var weekday = new Array(7);
        weekday[0] = "星期天";
        weekday[1] = "星期一";
        weekday[2] = "星期二";
        weekday[3] = "星期三";
        weekday[4] = "星期四";
        weekday[5] = "星期五";
        weekday[6] = "星期六";
        var time;
        var time2;
        if (begin.getFullYear() ==end.getFullYear()) {//如果年相等继续
                if(begin.getMonth() == end.getMonth()) {//如果月相等继续
                       if (begin.getDate() == end.getDate()) {//是不是今天
                               time =hour(begin) + minute(begin);
                               time2 =hour(begin) + minute(begin);
                               //是就显示时分
                       } else {//不是就判断是不是昨天
                              end.setHours(0);
                              end.setMinutes(0);
                              end.setSeconds(0);
                              end.setMilliseconds(0);
                               varDiffer = end - begin;
                               if(parseInt(Differ / 3600000) <= 24) {
                                      time = '昨天';
                                      time2 = '昨天  ' + hour(begin)+ minute(begin);
//                                      alert(time2+'是昨天');
                               } else{//不是昨天一周之内就显示星期几不然就具体时间
                                      if (parseInt(Differ / 3600000) <= 144) {
                                              time = day(weekday,begin);
                                              time2 =day(weekday,begin)+ ' ' + hour(begin) + minute(begin);
//                                              alert(time2+'是一周');
                                      } else {
                                              time = year(begin) +month(begin) + date(begin);
                                              time2 = year(begin) +month(begin) + date(begin);
//                                              alert(time2+'不是一周');
                                      }
                               }
                       }
                } else {//月不等,直接显示
                       time = year(begin) + month(begin) +date(begin);
                       time2 = year(begin) + month(begin) +date(begin);
//                       alert(time2+'time2月不等,直接显示');
                }
        } else {//年不等,直接显示
               
                time =year(begin) + month(begin) + date(begin);
                time2 =year(begin) + month(begin) + date(begin);
//               alert(time2+'time2年不等,直接显示');
        }
        
        if(Interface==0){
//               alert(time+'time');
                return time;
        }else{
//                alert(time2+'time2'+time+'time');
                return time2;
        }
        
}


        year = function(date) {               
//        alert( date.getFullYear() + '-'+'ffffffffffff,'+'date:'+date);
                returndate.getFullYear() + '-';
        }

        month = function(date) {
                var tt =date.getMonth() + 1;
                if (tt <10) {
                       tt = '0' + tt;
                }
                return tt +'-';
        }

        date = function(date) {
                var tt =date.getDate();
                if (tt <10) {
                       tt = '0' + tt;
                }
                return tt + '';
        }

        hour = function(date) {
                var tt =date.getHours();
                if (tt <10) {
                       tt = '0' + tt;
                }
                return tt +':';
        }

        minute = function(date) {
                var tt =date.getMinutes();
                if (tt <10) {
                       tt = '0' + tt;
                }
                return tt;
        }

        day = function(weekday, date) {
                returnweekday[date.getDay()];
        }
}


我会经常的访问论坛,我也刚使用不久,希望大家能够多给些建议,多交流,我们一起做得更好。





本帖子中包含更多资源    您需要 登录 才可以下载或查看,没有帐号?立即注册

3

查看全部评分

主题:
1
帖子:
14
云币:
67

APICloud粉丝

发表于 2015-9-16 16:54:01 |
markmarkmarkmarkmark

主题:
1102
帖子:
5131
云币:
2147214885

圣诞节捣蛋鬼APICloud大会专属勋章足球狗儿童节快乐

发表于 2015-9-16 16:49:19 |
感谢楼主分享自己的开发经历

新手上路

UID:136110

主题:
1
帖子:
7
云币:
19
发表于 2015-10-29 15:17:31 |
周枫 发表于 2015-10-29 13:54
已经添加到文章最后

多谢,辛苦了,向你致敬!

点评

:谢谢分享 
发表于 2015-12-25 14:07

实习司机

UID:148730

主题:
9
帖子:
101
云币:
327

APICloud粉丝

发表于 2015-10-14 21:44:01 |
就光这代码量,就要大大的顶起,赞!

实习司机

UID:139043

主题:
4
帖子:
128
云币:
1335

足球狗圣诞节SB侠

发表于 2015-9-16 16:50:18 |
这个逼装的我给100分   膜拜大神!!!

主题:
73
帖子:
4727
云币:
1469

足球狗狗年旺旺旺APICloud粉丝连续签到100天APICloud毕业勋章APICloud骨灰粉模块开发者签到党土豪志愿者一周年中秋节社会摇圣诞节老司机你吃屎!首长好!我还是个孩子!托马斯全旋女朋友不想上班!装逼侠单身狗超人SB侠

发表于 2015-9-16 16:50:38 |
66666666666666

主题:
0
帖子:
9
云币:
105
发表于 2015-9-16 16:50:47 |
这个不错,  有没有不用加好友直接聊天发消息的?

驾校小白

UID:113062

主题:
0
帖子:
4
云币:
22
发表于 2015-9-16 16:51:13 |

此贴必火!!

转正司机

UID:23432

主题:
123
帖子:
536
云币:
685

APICloud粉丝

发表于 2015-9-16 16:52:31 |
终于看到一个比较完整的例子了
晶睿互动app开发公司上海app开发公司,上海APICloud开发




       
       

主题:
21
帖子:
514
云币:
578

APICloud粉丝APICloud毕业勋章一周年圣诞节托马斯全旋女朋友

发表于 2015-9-16 16:53:12 |
做的很棒!不过你把你跟女盆友的真相都爆出来了

主题:
10
帖子:
30
云币:
231
发表于 2015-9-16 16:53:13 |
谢谢分享,正打算做
您需要登录后才可以回帖 登录 | 立即注册

快速回复 返回顶部 返回列表