提交 60b1ba49 编写于 作者: 楼国栋

Merge branch 'feature/im2_ws' into 'develop'

im聊天消息模块,表情聊天功能

See merge request o2oa/o2oa!529
......@@ -63,7 +63,7 @@ public class ActionMsgCreate extends BaseAction {
logger.error(e);
}
logger.info("发送im消息, person: " + persons.get(i));
MessageConnector.send(MessageConnector.TYPE_IM_CREATE, "来自 "+ name + "的IM消息", persons.get(i), msg);
MessageConnector.send(MessageConnector.TYPE_IM_CREATE, "来自 "+ name + "消息", persons.get(i), msg);
}
ActionResult<Wo> result = new ActionResult<>();
......
......@@ -160,6 +160,9 @@ MWF.xDesktop.WebSocket = new Class({
break;
case "custom_create":
this.receiveCustomMessage(data);
case "im_create":
console.log("im 消息来了!!!");
this.receiveIMMessage(data);
break;
default:
}
......@@ -292,7 +295,7 @@ MWF.xDesktop.WebSocket = new Class({
}.bind(this));
},
receiveCustomMessage: function(data){
var content = "<font style='color: #333; font-weight: bold'>"+MWF.LP.desktop.messsage.customMessage+"</font>"+data.body;
var content = "<font style='color: #333; font-weight: bold'>"+MWF.LP.desktop.messsage.customMessage+"</font>"+data.body;
var msg = {
"subject": MWF.LP.desktop.messsage.customMessageTitle,
"content": content
......@@ -300,6 +303,37 @@ MWF.xDesktop.WebSocket = new Class({
var messageItem = layout.desktop.message.addMessage(msg);
var tooltipItem = layout.desktop.message.addTooltip(msg);
},
receiveIMMessage: function(data){
var imBody = data.body;
var jsonBody = imBody.body;
var conversationId = imBody.conversationId;
var body = JSON.parse(jsonBody);
var msgBody = body.body; //默认text 文本消息
if (body.type && body.type == "emoji") { //表情 消息
msgBody = "[表情]";
}
var content = "<font style='color: #333; font-weight: bold'>"+data.title+"</font>"+msgBody;
var msg = {
"subject": MWF.LP.desktop.messsage.customMessageTitle,
"content": content
};
var messageItem = layout.desktop.message.addMessage(msg);
var options = {"conversationId": conversationId};
messageItem.contentNode.addEvent("click", function(e){
layout.desktop.message.addUnread(-1);
layout.desktop.message.hide();
layout.desktop.openApplication(e, "IMV2", options);
}.bind(this));
var tooltipItem = layout.desktop.message.addTooltip(msg);
tooltipItem.contentNode.addEvent("click", function(e){
layout.desktop.message.hide();
layout.desktop.openApplication(e, "IMV2", options);
}.bind(this));
},
......
......@@ -8,7 +8,7 @@
<!-- 聊天操作 -->
<div class="chat-bottom-area" data-o2-element="chatBottomAreaNode">
<div class="chat-bottom-area-tool" data-o2-element="chatBottomAreaToolNode">
<img src="/x_component_IMV2/$Main/default/icons/icon-emoji.png" data-o2-element="chatBottomAreaToolEmojiNode" />
<img src="/x_component_IMV2/$Main/default/icons/icon-emoji.png" data-o2-element="chatBottomAreaToolEmojiNode" data-o2-events="click:showEmojiBox"/>
</div>
<div class="chat-bottom-area-textarea">
<textarea data-o2-element="chatBottomAreaTextareaNode" placeholder="输入消息内容"></textarea>
......
......@@ -46,7 +46,6 @@
bottom: 0px;
background: #ffffff;
width: 100%;
z-index: 100;
}
.chat-bottom-area-tool {
......@@ -325,6 +324,7 @@
<div class="chat-bottom-area-tool">
<img src="./icons/icon-emoji.png" />
</div>
<div class="chat-bottom-area-textarea"><textarea></textarea></div>
<div class="chat-bottom-area-send-space">
<div class="chat-bottom-area-send">
......@@ -332,6 +332,92 @@
</div>
</div>
</div>
<div style="position: absolute;width:630px;height: 260px;left: 5px;bottom: 155px;background-color: #ffffff;border: 1px solid #F1F1F1; padding-top: 8px;border-radius: 8px; box-shadow: 5px 5px #1d1d1d10;z-index: 100;">
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left; margin: 5px;" />
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
<img src="./icons/icon-emoji.png" style="width: 32px;height: 32px; float: left;margin: 5px;"/>
</div>
</body>
</html>
\ No newline at end of file
......@@ -2,13 +2,15 @@
<div class="o2_im_chat_list">
<!--top-->
<div class="o2_im_chat_list_top">
<div class="add" data-o2-element="o2ImConvCreateNode" data-o2-events="click:tapCreateSingleConv"></div>
<div class="search_out">
<div class="add" data-o2-element="o2ImConvCreateNode" data-o2-events="click:tapCreateSingleConv">
创建单聊
</div>
<!-- <div class="search_out">
<div title="搜索" class="search_icon"></div>
<div class="search_input_out">
<input type="text" x-webkit-speech="x-webkit-speech" placeholder="请输入搜索" class="search_input">
</div>
</div>
</div> -->
</div>
<!-- chat list -->
......
......@@ -18,11 +18,13 @@
border-bottom: 1px solid rgb(204, 204, 204);
}
.o2_im_chat_list_top .add {
background: url(/x_component_IMV2/$Main/default/icons/add.png) center center no-repeat;
width: 40px;
height: 40px;
cursor: pointer;
float: right;
background: url(/x_component_IMV2/$Main/default/icons/add.png) left center no-repeat;
height: 40px;
cursor: pointer;
margin-left: 14px;
text-align: center;
line-height: 40px;
color: #848484;
}
.o2_im_chat_list_top .search_out {
margin-right: 40px;
......@@ -161,7 +163,25 @@
/* 聊天界面 */
.chat-emoji-box {
position: absolute;
width:630px;
height: 260px;
left: 5px;
bottom: 155px;
background-color: #ffffff;
border: 1px solid #F1F1F1;
padding-top: 8px;
border-radius: 8px;
box-shadow: 5px 5px #1d1d1d10;
z-index: 100;
}
.chat-emoji-img {
width: 32px;
height: 32px;
float: left;
margin: 5px;
}
.chat-title {
height: 30px;
text-align: center;
......@@ -326,7 +346,11 @@
right: -22px;
top: 3px;
}
.chat-content-emoji {
width: 32px;
height: 32px;
margin: 5px;
}
.chat-notice {
clear: both;
font-size: 70%;
......
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();
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册