|
|
@@ -1,7 +1,6 @@
|
|
|
MWF.require("MWF.widget.UUID", null, false);
|
|
|
MWF.xDesktop.requireApp("Template", "MForm", null, false);
|
|
|
MWF.xDesktop.requireApp("Template", "MPopupForm", null, false);
|
|
|
-MWF.xApplication.IMV2.options.multitask = true;
|
|
|
MWF.xApplication.IMV2.Main = new Class({
|
|
|
Extends: MWF.xApplication.Common.Main,
|
|
|
Implements: [Options, Events],
|
|
|
@@ -15,42 +14,78 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
"height": "768",
|
|
|
"isResize": true,
|
|
|
"isMax": true,
|
|
|
- "title": MWF.xApplication.IMV2.LP.title
|
|
|
+ "title": MWF.xApplication.IMV2.LP.title,
|
|
|
+ "conversationId":""
|
|
|
},
|
|
|
onQueryLoad: function () {
|
|
|
this.lp = MWF.xApplication.IMV2.LP;
|
|
|
this.app = this;
|
|
|
- this.conversationList = [];
|
|
|
this.conversationNodeItemList = [];
|
|
|
- this.conversationId = "";
|
|
|
+ this.conversationId = this.options.conversationId || "";
|
|
|
+ this.messageList = [];
|
|
|
+ this.emojiList = [];
|
|
|
+ //添加87个表情
|
|
|
+ for (var i=1; i < 88; i++) {
|
|
|
+ var emoji = {
|
|
|
+ "key" : i > 9 ? "["+i+"]" : "[0"+i+"]",
|
|
|
+ "path" : i > 9 ? "/x_component_IMV2/$Main/emotions/im_emotion_"+i+".png" : "/x_component_IMV2/$Main/emotions/im_emotion_0"+i+".png",
|
|
|
+ };
|
|
|
+ this.emojiList.push(emoji);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onQueryClose: function(){
|
|
|
+ this.closeListening()
|
|
|
},
|
|
|
loadApplication: function (callback) {
|
|
|
var url = this.path + this.options.style + "/im.html";
|
|
|
this.content.loadHtml(url, { "bind": { "lp": this.lp, "data": {} }, "module": this }, function () {
|
|
|
+ //设置content
|
|
|
this.app.content = this.o2ImMainNode;
|
|
|
+ //启动监听
|
|
|
+ this.startListening();
|
|
|
//获取会话列表
|
|
|
this.conversationNodeItemList = [];
|
|
|
o2.Actions.load("x_message_assemble_communicate").ImAction.myConversationList(function (json) {
|
|
|
if (json.data && json.data instanceof Array) {
|
|
|
- this.conversationList = json.data;
|
|
|
this.loadConversationList(json.data);
|
|
|
}
|
|
|
}.bind(this));
|
|
|
|
|
|
}.bind(this));
|
|
|
},
|
|
|
+ startListening:function(){
|
|
|
+ this.messageNumber = layout.desktop.message.items.length;
|
|
|
+ //查询ws消息 如果增加
|
|
|
+ if (this.listener) {
|
|
|
+ clearInterval(this.listener);
|
|
|
+ }
|
|
|
+ this.listener = setInterval(function(){
|
|
|
+ var newNumber = layout.desktop.message.items.length;
|
|
|
+ //判断是否有新的ws消息
|
|
|
+ if(newNumber > this.messageNumber) {
|
|
|
+ //查询会话数据
|
|
|
+ this._checkConversationMessage();
|
|
|
+ //查询聊天数据
|
|
|
+ this._checkNewMessage();
|
|
|
+ this.messageNumber = newNumber;
|
|
|
+ }
|
|
|
+ }.bind(this), 1000);
|
|
|
+ },
|
|
|
+ closeListening: function() {
|
|
|
+ if (this.listener) {
|
|
|
+ clearInterval(this.listener);
|
|
|
+ }
|
|
|
+ },
|
|
|
//加载会话列表
|
|
|
loadConversationList: function (list) {
|
|
|
for (var i = 0; i < list.length; i++) {
|
|
|
var chat = list[i];
|
|
|
var itemNode = this._createConvItemNode(chat);
|
|
|
this.conversationNodeItemList.push(itemNode);
|
|
|
+ if(this.conversationId && this.conversationId == chat.id) {
|
|
|
+ this.tapConv(chat);
|
|
|
+ }
|
|
|
}
|
|
|
- if (list.length > 0) {
|
|
|
- this.tapConv(list[0]);
|
|
|
- }
|
|
|
-
|
|
|
- console.log("结束");
|
|
|
},
|
|
|
//分页获取会话的消息列表数据
|
|
|
loadMsgListByConvId: function (page, size, convId) {
|
|
|
@@ -58,16 +93,15 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
o2.Actions.load("x_message_assemble_communicate").ImAction.msgListByPaging(page, size, data, function (json) {
|
|
|
var list = json.data;
|
|
|
for (var i = 0; i < list.length; i++) {
|
|
|
- this._buildMsgNode(list[i]);
|
|
|
+ this.messageList.push(list[i]);
|
|
|
+ this._buildMsgNode(list[i], true);
|
|
|
}
|
|
|
- console.log("聊天信息添加结束！");
|
|
|
}.bind(this), function (error) {
|
|
|
console.log(error);
|
|
|
}.bind(this), false);
|
|
|
},
|
|
|
- //点击
|
|
|
+ //点击会话
|
|
|
tapConv: function (conv) {
|
|
|
- console.log("clickConversationvvvvvv");
|
|
|
this._setCheckNode(conv);
|
|
|
var url = this.path + this.options.style + "/chat.html";
|
|
|
var data = { "convName": conv.title };
|
|
|
@@ -75,33 +109,58 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
this.chatNode.empty();
|
|
|
this.chatNode.loadHtml(url, { "bind": data, "module": this }, function () {
|
|
|
//获取聊天信息
|
|
|
+ this.messageList = [];
|
|
|
this.loadMsgListByConvId(1, 20, conv.id);
|
|
|
- console.log("开始滚动！！！");
|
|
|
var scrollFx = new Fx.Scroll(this.chatContentNode);
|
|
|
scrollFx.toBottom();
|
|
|
}.bind(this));
|
|
|
},
|
|
|
//点击发送消息
|
|
|
sendMsg: function () {
|
|
|
- console.log("click send Msg btn................");
|
|
|
var text = this.chatBottomAreaTextareaNode.value;
|
|
|
- console.log(text);
|
|
|
if (text) {
|
|
|
+ console.log("发送文本消息");
|
|
|
this.chatBottomAreaTextareaNode.value = "";
|
|
|
- this._newAndSendTextMsg(text);
|
|
|
- var scrollFx = new Fx.Scroll(this.chatContentNode);
|
|
|
- scrollFx.toBottom();
|
|
|
+ this._newAndSendTextMsg(text, "text");
|
|
|
} else {
|
|
|
console.log("没有消息内容！");
|
|
|
}
|
|
|
},
|
|
|
+ //点击表情按钮
|
|
|
+ showEmojiBox: function() {
|
|
|
+ if(!this.emojiBoxNode) {
|
|
|
+ this.emojiBoxNode = new Element("div", { "class": "chat-emoji-box" }).inject(this.chatNode);
|
|
|
+ var _self = this;
|
|
|
+ for(var i=0; i<this.emojiList.length; i++) {
|
|
|
+ var emoji = this.emojiList[i];
|
|
|
+ var emojiNode = new Element("img", {"src": emoji.path, "class": "chat-emoji-img"}).inject(this.emojiBoxNode);
|
|
|
+ emojiNode.addEvents({
|
|
|
+ "mousedown": function (ev) {
|
|
|
+ _self.sendEmojiMsg(this.emoji);
|
|
|
+ _self.hideEmojiBox();
|
|
|
+ }.bind({emoji: emoji})
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.emojiBoxNode.setStyle("display", "block");
|
|
|
+ this.hideFun = this.hideEmojiBox.bind(this);
|
|
|
+ document.body.addEvent("mousedown", this.hideFun);
|
|
|
+ },
|
|
|
+ hideEmojiBox: function() {
|
|
|
+ //关闭emojiBoxNode
|
|
|
+ this.emojiBoxNode.setStyle("display", "none");
|
|
|
+ document.body.removeEvent("mousedown", this.hideFun);
|
|
|
+ },
|
|
|
+ //发送表情消息
|
|
|
+ sendEmojiMsg: function(emoji) {
|
|
|
+ console.log("发送表情消息");
|
|
|
+ this._newAndSendTextMsg(emoji.key, "emoji");
|
|
|
+ },
|
|
|
+ //点击创建单聊按钮
|
|
|
tapCreateSingleConv: function () {
|
|
|
- console.log("click tapCreateSingleConv................");
|
|
|
var form = new MWF.xApplication.IMV2.SingleForm(this, {}, {}, { app: this.app });
|
|
|
form.create()
|
|
|
},
|
|
|
-
|
|
|
-
|
|
|
/**
|
|
|
* 创建会话
|
|
|
* @param {*} persons 人员列表
|
|
|
@@ -115,11 +174,10 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
var _self = this;
|
|
|
o2.Actions.load("x_message_assemble_communicate").ImAction.create(conv, function (json) {
|
|
|
var newConv = json.data;
|
|
|
- console.log(newConv);
|
|
|
var isOld = false;
|
|
|
for (var i = 0; i < _self.conversationNodeItemList.length; i++) {
|
|
|
var c = _self.conversationNodeItemList[i];
|
|
|
- if (newConv.id == c.id) {
|
|
|
+ if (newConv.id == c.data.id) {
|
|
|
isOld = true;
|
|
|
_self.tapConv(c);
|
|
|
}
|
|
|
@@ -129,14 +187,15 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
_self.conversationNodeItemList.push(itemNode);
|
|
|
_self.tapConv(newConv);
|
|
|
}
|
|
|
- console.log("创建会话 结束。。。。。");
|
|
|
}.bind(this), function (error) {
|
|
|
console.log(error);
|
|
|
}.bind(this))
|
|
|
},
|
|
|
+ //创建会话ItemNode
|
|
|
_createConvItemNode: function (conv) {
|
|
|
return new MWF.xApplication.IMV2.ConversationItem(conv, this);
|
|
|
},
|
|
|
+ //会话ItemNode 点击背景色
|
|
|
_setCheckNode: function (conv) {
|
|
|
for (var i = 0; i < this.conversationNodeItemList.length; i++) {
|
|
|
var item = this.conversationNodeItemList[i];
|
|
|
@@ -148,10 +207,10 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
}
|
|
|
},
|
|
|
//创建文本消息 并发送
|
|
|
- _newAndSendTextMsg: function (text) {
|
|
|
+ _newAndSendTextMsg: function (text, type) {
|
|
|
var distinguishedName = layout.session.user.distinguishedName;
|
|
|
var time = this._currentTime();
|
|
|
- var body = { "body": text };
|
|
|
+ var body = { "body": text, "type": type };
|
|
|
var bodyJson = JSON.stringify(body);
|
|
|
var uuid = (new MWF.widget.UUID).toString();
|
|
|
var textMessage = {
|
|
|
@@ -170,24 +229,87 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
function (error) {
|
|
|
console.log(error);
|
|
|
}.bind(this));
|
|
|
+ this.messageList.push(textMessage);
|
|
|
this._buildSender(body, distinguishedName, false);
|
|
|
+ this._refreshConvMessage(textMessage);
|
|
|
+ },
|
|
|
+ //刷新会话Item里面的最后消息内容
|
|
|
+ _refreshConvMessage: function(msg) {
|
|
|
for (var i = 0; i < this.conversationNodeItemList.length; i++) {
|
|
|
var node = this.conversationNodeItemList[i];
|
|
|
if (node.data.id == this.conversationId) {
|
|
|
- node.refreshLastMsg(textMessage);
|
|
|
+ node.refreshLastMsg(msg);
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
+ //检查会话列表是否有更新
|
|
|
+ _checkConversationMessage: function() {
|
|
|
+ o2.Actions.load("x_message_assemble_communicate").ImAction.myConversationList(function (json) {
|
|
|
+ if (json.data && json.data instanceof Array) {
|
|
|
+ var newConList = json.data;
|
|
|
+ for (var j = 0; j < newConList.length; j++) {
|
|
|
+ var nCv = newConList[j];
|
|
|
+ var isNew = true;
|
|
|
+ for (var i = 0; i < this.conversationNodeItemList.length; i++) {
|
|
|
+ var cv = this.conversationNodeItemList[i];
|
|
|
+ if (cv.data.id == nCv.id) {
|
|
|
+ isNew = false;
|
|
|
+ //刷新
|
|
|
+ cv.refreshLastMsg(nCv.lastMessage);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //新会话 创建
|
|
|
+ if(isNew) {
|
|
|
+ var itemNode = this._createConvItemNode(nCv);
|
|
|
+ this.conversationNodeItemList.push(itemNode);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //this.loadConversationList(json.data);
|
|
|
+ }
|
|
|
+ }.bind(this));
|
|
|
+ },
|
|
|
+ //检查是否有新消息
|
|
|
+ _checkNewMessage: function() {
|
|
|
+ if (this.conversationId && this.conversationId != "") {//是否有会话窗口
|
|
|
+ var data = { "conversationId": this.conversationId };
|
|
|
+ o2.Actions.load("x_message_assemble_communicate").ImAction.msgListByPaging(1, 10, data, function (json) {
|
|
|
+ var list = json.data;
|
|
|
+ if(list && list.length > 0) {
|
|
|
+ var msg = list[0];
|
|
|
+ //检查聊天框是否有变化
|
|
|
+ if (this.conversationId == msg.conversationId) {
|
|
|
+ for (var i = 0; i < list.length; i++) {
|
|
|
+ var isnew = true;
|
|
|
+ var m = list[i];
|
|
|
+ for (var j = 0; j < this.messageList.length; j++) {
|
|
|
+ if(this.messageList[j].id == m.id) {
|
|
|
+ isnew = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(isnew) {
|
|
|
+ this.messageList.push(m);
|
|
|
+ this._buildMsgNode(m, false);
|
|
|
+ // this._refreshConvMessage(m);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }.bind(this), function (error) {
|
|
|
+ console.log(error);
|
|
|
+ }.bind(this), false);
|
|
|
+ }
|
|
|
+ },
|
|
|
//创建消息html节点
|
|
|
- _buildMsgNode: function (msg) {
|
|
|
+ _buildMsgNode: function (msg, isTop) {
|
|
|
var createPerson = msg.createPerson;
|
|
|
var jsonbody = msg.body;
|
|
|
var body = JSON.parse(jsonbody);//todo 目前只有一种text类型
|
|
|
var distinguishedName = layout.session.user.distinguishedName;
|
|
|
if (createPerson != distinguishedName) {
|
|
|
- this._buildReceiver(body, createPerson, true);
|
|
|
+ this._buildReceiver(body, createPerson, isTop);
|
|
|
} else {
|
|
|
- this._buildSender(body, createPerson, true);
|
|
|
+ this._buildSender(body, createPerson, isTop);
|
|
|
}
|
|
|
},
|
|
|
/**
|
|
|
@@ -209,7 +331,22 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
var lastNode = new Element("div").inject(receiverBodyNode);
|
|
|
var lastFirstNode = new Element("div", { "class": "chat-left_triangle" }).inject(lastNode);
|
|
|
//text
|
|
|
- var lastSecNode = new Element("span", { "text": msgBody.body }).inject(lastNode);
|
|
|
+ if (msgBody.type == "emoji") { // 表情
|
|
|
+ var img = "";
|
|
|
+ for (var i=0; i< this.emojiList.length; i++) {
|
|
|
+ if (msgBody.body == this.emojiList[i].key) {
|
|
|
+ img = this.emojiList[i].path;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ new Element("img", {"src": img, "class": "chat-content-emoji"}).inject(lastNode);
|
|
|
+ }else {//text
|
|
|
+ new Element("span", { "text": msgBody.body }).inject(lastNode);
|
|
|
+ }
|
|
|
+
|
|
|
+ if(!isTop) {
|
|
|
+ var scrollFx = new Fx.Scroll(this.chatContentNode);
|
|
|
+ scrollFx.toBottom();
|
|
|
+ }
|
|
|
},
|
|
|
/**
|
|
|
* 消息接收体
|
|
|
@@ -229,8 +366,23 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
var nameNode = new Element("div", { "text": name }).inject(receiverBodyNode);
|
|
|
var lastNode = new Element("div").inject(receiverBodyNode);
|
|
|
var lastFirstNode = new Element("div", { "class": "chat-right_triangle" }).inject(lastNode);
|
|
|
- //text
|
|
|
- var lastSecNode = new Element("span", { "text": msgBody.body }).inject(lastNode);
|
|
|
+
|
|
|
+ if (msgBody.type == "emoji") { // 表情
|
|
|
+ var img = "";
|
|
|
+ for (var i=0; i< this.emojiList.length; i++) {
|
|
|
+ if (msgBody.body == this.emojiList[i].key) {
|
|
|
+ img = this.emojiList[i].path;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ new Element("img", {"src": img, "class": "chat-content-emoji"}).inject(lastNode);
|
|
|
+ }else {//text
|
|
|
+ new Element("span", { "text": msgBody.body }).inject(lastNode);
|
|
|
+ }
|
|
|
+
|
|
|
+ if(!isTop) {
|
|
|
+ var scrollFx = new Fx.Scroll(this.chatContentNode);
|
|
|
+ scrollFx.toBottom();
|
|
|
+ }
|
|
|
},
|
|
|
//用户头像
|
|
|
_getIcon: function (id) {
|
|
|
@@ -297,6 +449,7 @@ MWF.xApplication.IMV2.Main = new Class({
|
|
|
day = (day.toString().length == 1) ? ("0" + day) : day;
|
|
|
return date.getFullYear() + '-' + month + '-' + day;
|
|
|
},
|
|
|
+ //当前时间 yyyy-MM-dd HH:mm:ss
|
|
|
_currentTime: function () {
|
|
|
var today = new Date();
|
|
|
var year = today.getFullYear(); //得到年份
|
|
|
@@ -333,7 +486,8 @@ MWF.xApplication.IMV2.ConversationItem = new Class({
|
|
|
"avatarUrl": avatarDefault,
|
|
|
"title": this.data.title,
|
|
|
"time": "",
|
|
|
- "lastMessage": ""
|
|
|
+ "lastMessage": "",
|
|
|
+ "lastMessageType": "text"
|
|
|
};
|
|
|
var distinguishedName = layout.session.user.distinguishedName;
|
|
|
if (this.data.type && this.data.type === "single") {
|
|
|
@@ -361,6 +515,9 @@ MWF.xApplication.IMV2.ConversationItem = new Class({
|
|
|
var time = this.main._friendlyTime(o2.common.toDate(this.data.lastMessage.createTime));
|
|
|
convData.time = time;
|
|
|
}
|
|
|
+ if (mBody.type) {
|
|
|
+ convData.lastMessageType = mBody.type;
|
|
|
+ }
|
|
|
}
|
|
|
this.node = new Element("div", { "class": "item" }).inject(this.container);
|
|
|
this.nodeBaseItem = new Element("div", { "class": "base" }).inject(this.node);
|
|
|
@@ -370,7 +527,20 @@ MWF.xApplication.IMV2.ConversationItem = new Class({
|
|
|
var bodyUpNode = new Element("div", { "class": "body_up" }).inject(bodyNode);
|
|
|
new Element("div", { "class": "body_title", "text": convData.title }).inject(bodyUpNode);
|
|
|
this.messageTimeNode = new Element("div", { "class": "body_time", "text": convData.time }).inject(bodyUpNode);
|
|
|
- this.lastMessageNode = new Element("div", { "class": "body_down", "text": convData.lastMessage }).inject(bodyNode);
|
|
|
+ if (convData.lastMessageType == "emoji") {
|
|
|
+ this.lastMessageNode = new Element("div", { "class": "body_down"}).inject(bodyNode);
|
|
|
+ var imgPath = "";
|
|
|
+ for(var i = 0; i < this.main.emojiList.length ; i++) {
|
|
|
+ var emoji = this.main.emojiList[i];
|
|
|
+ if (emoji.key == convData.lastMessage) {
|
|
|
+ imgPath = emoji.path;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ new Element("img", {"src": imgPath, "style":"width: 16px;height: 16px;"}).inject(this.lastMessageNode);
|
|
|
+ }else {
|
|
|
+ this.lastMessageNode = new Element("div", { "class": "body_down", "text": convData.lastMessage }).inject(bodyNode);
|
|
|
+ }
|
|
|
+
|
|
|
var _self = this;
|
|
|
this.node.addEvents({
|
|
|
"click": function () {
|
|
|
@@ -393,9 +563,23 @@ MWF.xApplication.IMV2.ConversationItem = new Class({
|
|
|
refreshLastMsg: function(lastMessage) {
|
|
|
//目前是text 类型的消息
|
|
|
var jsonbody = lastMessage.body;
|
|
|
- var body = JSON.parse(jsonbody);//todo 目前只有一种text类型
|
|
|
+ var body = JSON.parse(jsonbody);
|
|
|
+
|
|
|
if(this.lastMessageNode) {
|
|
|
- this.lastMessageNode.set('text', body.body);
|
|
|
+ if (body.type == "emoji") { //表情 消息
|
|
|
+ var imgPath = "";
|
|
|
+ for(var i = 0; i < this.main.emojiList.length ; i++) {
|
|
|
+ var emoji = this.main.emojiList[i];
|
|
|
+ if (emoji.key == body.body) {
|
|
|
+ imgPath = emoji.path;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.lastMessageNode.empty();
|
|
|
+ new Element("img", {"src": imgPath, "style":"width: 16px;height: 16px;"}).inject(this.lastMessageNode);
|
|
|
+ }else { //文本消息
|
|
|
+ this.lastMessageNode.empty();
|
|
|
+ this.lastMessageNode.set('text', body.body);
|
|
|
+ }
|
|
|
}
|
|
|
var time = this.main._friendlyTime(o2.common.toDate(lastMessage.createTime));
|
|
|
if(this.messageTimeNode) {
|
|
|
@@ -477,7 +661,6 @@ MWF.xApplication.IMV2.SingleForm = new Class({
|
|
|
save: function () {
|
|
|
var data = this.form.getResult(true, null, true, false, true);
|
|
|
if (data) {
|
|
|
- console.log(data);
|
|
|
this.app.newConversation(data.person, "single");
|
|
|
this.close();
|
|
|
}
|
楼国栋
