Commit 0a15377b by 施宇

111

parent 251b7c46
Showing with 143 additions and 275 deletions
......@@ -36,6 +36,7 @@ function addMember(id) {
App({
globalData: {
unReadMessageNum: 0,
isIPX: false //是否为iphone X
},
conn: {
closed: false,
......@@ -101,7 +102,6 @@ App({
if (message) {
if (onMessageError(message)) {
msgStorage.saveReceiveMsg(message, msgType.TEXT);
console.log('hahaha')
}
calcUnReadSpot(message);
}
......@@ -115,6 +115,18 @@ App({
onError(error) {
console.log(error)
},
});
this.checkIsIPhoneX();
},
checkIsIPhoneX: function () {
const me = this
wx.getSystemInfo({
success: function (res) {
// 根据 model 进行判断
if (res.model.search('iPhone X') != -1) {
me.globalData.isIPX = true
}
}
})
},
......
......@@ -15,15 +15,10 @@ Component({
data: {
__comps__: {
msglist: null,
inputbar: null,
audio: null,
inputbar: null
},
},
methods: {
toggleRecordModal(){
this.data.__comps__.audio.toggleRecordModal();
},
normalScroll(){
this.data.__comps__.msglist.normalScroll();
this.data.__comps__.inputbar.cancelEmoji();
......@@ -36,11 +31,7 @@ Component({
saveSendMsg(evt){
msgStorage.saveMsg(evt.detail.msg, evt.detail.type);
this.data.__comps__.inputbar.cancelEmoji();
},
getMore(){
this.selectComponent('#chat-msglist').getHistoryMsg()
},
}
},
// lifetimes
......@@ -49,7 +40,6 @@ Component({
ready(){
this.data.__comps__.inputbar = this.selectComponent("#chat-inputbar");
this.data.__comps__.msglist = this.selectComponent("#chat-msglist");
this.data.__comps__.audio = this.selectComponent("#chat-suit-audio");
},
moved(){},
detached(){
......
......@@ -22,25 +22,6 @@ Component({
},
methods: {
// 事件有长度限制:仅限 26 字符
toggleRecordModal(){
this.triggerEvent(
"tapSendAudio",
null,
{
bubbles: true,
composed: true
}
);
},
// sendVideo(){
// this.data.__comps__.video.sendVideo();
// },
openCamera(){
this.data.__comps__.image.openCamera();
},
openEmoji(){
this.data.__comps__.emoji.openEmoji();
},
......@@ -64,7 +45,7 @@ Component({
attached(){},
moved(){},
detached(){},
ready(){
ready() {
this.setData({
isIPX: getApp().globalData.isIPX
})
......
<view class="room_bar">
<chat-suit-emoji id="chat-suit-emoji" bind:newEmojiStr="emojiAction"></chat-suit-emoji>
<chat-suit-main id="chat-suit-main" username="{{ username }}" chatType="{{ chatType }}" bind:inputFocused="cancelEmoji"></chat-suit-main>
<chat-suit-image id="chat-suit-image" username="{{ username }}" chatType="{{ chatType }}"></chat-suit-image>
<view class="other_func {{isIPX? 'other_func_X': ''}}">
<chat-suit-main id="chat-suit-main" username="{{ username }}" chatType="{{ chatType }}" bind:inputFocused="cancelEmoji">
<view class="open_emoji" bind:tap="openEmoji">
<image src="../../../images/Emoji.png"/>
<image src="../../../images/Emoji.png" />
</view>
<view class="send_image" bind:tap="sendImage">
<image src="../../../images/pic.png" style="height:20px; width: 20px"/>
<image src="../../../images/pic.png"/>
</view>
</chat-suit-main>
<chat-suit-image id="chat-suit-image" username="{{ username }}" chatType="{{ chatType }}"></chat-suit-image>
<view class="other_func {{isIPX? 'other_func_X': ''}}">
</view>
</view>
\ No newline at end of file
.room_bar {
width: 100%;
height: auto;
border-top: 1px solid #CFCFCF;
border-top: 1px solid #f5f9fc;
position: fixed;
bottom: 0;
right: 0;
......@@ -12,40 +12,21 @@
.other_func {
width: 100%;
height: 60rpx;
display: flex;
height:10rpx;
}
.other_func_X{
height: 128rpx;
height:50rpx;
}
.other_func image {
width: 42rpx;
height: 40rpx;
.open_emoji image,.send_image image{
width: 100%;
height: 100%;
}
.open_emoji,
.send_image,
.open_camera,
.v-record {
width: 48rpx;
height: 48rpx;
display: flex;
align-items: center;
justify-content: center;
margin-left: 48rpx;
}
.v-record .icon-record {
width: 18rpx;
.send_image{
height: 40rpx;
flex:0 0 40rpx;
margin-left: 24rpx;
}
.v-record{
margin-left: 48rpx;
}
.open_camera, .send_image{
margin-left: 64rpx;
}
......@@ -50,14 +50,6 @@
bind:tap="sendEmoji"
data-emoji="{{ index }}" />
</view>
<view class="emoji_item">
<image
wx:for="{{ emojiObj.map6 }}"
src="{{ emojiObj.path + item }}"
wx:key=""
bind:tap="sendEmoji"
data-emoji="{{ index }}" />
</view>
</swiper-item>
</block>
</swiper>
.emoji_list {
margin-top: 30px;
border-top: 1px solid #f5f9fc;
width: 100%;
height: 145px;
background-color: #dddddd;
background-color: #fff;
padding-top: 10px;
padding-left: 3%;
display: none;
}
.showEmoji {
margin-top: 30px;
border-top: 1px solid #f5f9fc;
width: 100%;
height: 145px;
background-color: #dddddd;
background-color: #fff;
padding-top: 10px;
padding-left: 3%;
display: block;
......
<!-- <chat-suit-emoji id="chat-suit-emoji" bind:newEmojiStr="emojiAction"></chat-suit-emoji> -->
<form class="text-input">
<view class="f-row">
<slot></slot>
<input
class="f news"
type="text"
......@@ -16,7 +17,7 @@
placeholder-style="color:#CFCFCF; padding-left:5px;"
/>
<button class="send_btn" bind:tap="sendMessage">发送</button>
<view class="send_btn" bind:tap="sendMessage">发送</view>
</view>
</form>
......@@ -4,31 +4,32 @@
height: 100rpx;
padding: 0;
display: block;
}
.news {
width: 100%;
height: 62rpx;
font-size: 14px;
font-size: 28rpx;
padding: 0 32rpx;
display: inline-block;
margin-top: 10rpx;
margin-left:24rpx;
line-height: 48rpx;
position:relative;
top: 0;
background-color: #E6ECF2;
border-radius: 8rpx;
box-sizing: border-box;
}
.send_btn {
width: 80rpx;
height: 60rpx;
line-height: 60rpx;
font-size: 17px;
color: #000;
flex: 0 0 120rpx;
font-size: 28rpx;
color:#0D84D1;
padding: 0;
display: inline-block;
float: right;
margin: 8rpx 16rpx auto auto;
background-color: #fff;
height:62rpx;
text-align: center;
line-height: 62rpx;
}
.f-row{
......
......@@ -5,8 +5,6 @@ let LIST_STATUS = {
NORMAL: "scroll_view"
};
let page = 0;
let Index = 0;
let curMsgMid = ''
let isFail = false
Component({
......@@ -46,28 +44,6 @@ Component({
});
},
getHistoryMsg(){
let me = this
let username = this.data.username;
let myUsername = wx.getStorageSync("myUsername");
let sessionKey = username.groupId ? username.groupId + myUsername : username.your + myUsername;
let historyChatMsgs = wx.getStorageSync("rendered_" + sessionKey) || [];
if (Index < historyChatMsgs.length) {
let timesMsgList = historyChatMsgs.slice(-Index-10, -Index)
this.setData({
chatMsg: timesMsgList.concat(me.data.chatMsg),
toView: timesMsgList[timesMsgList.length - 1].mid,
});
Index += timesMsgList.length;
if (timesMsgList.length == 10) {
page ++
}
wx.stopPullDownRefresh()
}
},
renderMsg(renderableMsg, type, curChatMsg, sessionKey, isnew){
let me = this
if (curChatMsg.length > 1) {
......@@ -80,21 +56,8 @@ Component({
})
})
}
var historyChatMsgs = wx.getStorageSync("rendered_" + sessionKey) || [];
// if (curChatMsg.length) {
// console.log(curMsgMid.substring(curMsgMid.length - 10) , curChatMsg[0].mid.substring(curChatMsg[0].mid.length - 10))
// }
// if(curChatMsg.length && curMsgMid.substring(curMsgMid.length - 10) == curChatMsg[curChatMsg.length - 1].mid.substring(curChatMsg[0].mid.length - 10)){
// //curChatMsg[curChatMsg.length - 1].msg.data[0].isSuc = true
// curChatMsg[curChatMsg.length - 1].isSuc = true
// }
historyChatMsgs = historyChatMsgs.concat(curChatMsg);
//console.log('当前历史',renderableMsg)
//console.log('历史消息', historyChatMsgs)
if(!historyChatMsgs.length) return;
if (isnew == 'newMsg') {
this.setData({
......@@ -104,7 +67,7 @@ Component({
});
}else{
this.setData({
chatMsg: historyChatMsgs.slice(-10),
chatMsg: historyChatMsgs,
// 跳到最后一条
toView: historyChatMsgs[historyChatMsgs.length - 1].mid,
});
......@@ -123,7 +86,6 @@ Component({
wx.setStorageSync(sessionKey, chatMsg);
Index = historyChatMsgs.slice(-10).length;
wx.pageScrollTo({
scrollTop: 9999,
})
......@@ -159,8 +121,6 @@ Component({
},
attached(){
this.__visibility__ = true;
page = 0;
Index = 0;
},
moved(){},
detached(){
......@@ -184,32 +144,6 @@ Component({
this.renderMsg(null, null, chatMsg, sessionKey);
wx.setStorageSync(sessionKey, null);
// disp.on("em.chat.sendSuccess", function(mid){
// curMsgMid = mid
// console.log('发送过去了', mid)
// let msgList = me.data.chatMsg
// msgList.map((item) =>{
// if (item.mid.substring(item.mid.length - 10) == mid.substring(mid.length - 10)) {
// console.log(111111, item)
// item.msg.data[0].isSuc = true
// item.isSuc = true
// me.setData({
// chatMsg: msgList
// })
// }
// })
// if (me.curChatMsg[0].mid == curMsgMid) {
// me.curChatMsg[0].msg.data[0].isShow = true
// me.curChatMsg[0].isShow = true
// }
// wx.setStorageSync("rendered_" + sessionKey, msgList);
// console.log('msgList', msgList)
// })
disp.on('em.xmpp.error.sendMsgErr', function(err) {
curMsgMid = err.data.mid
isFail = true
......
{
"component": true,
"usingComponents": {}
"usingComponents": {},
"enablePullDownRefresh":false
}
\ No newline at end of file
......@@ -2,66 +2,38 @@
<text class="msg-text" style="float:left;">{{ item.data }}</text>
</template>
<template name="emoji">
<image
class="avatar"
src="{{ '../../../images/faces/' + item.data }}"
style="width:25px; height:25px; margin:0 0 2px 0; float:left;" />
<image class="avatar" src="{{ '../../../images/faces/' + item.data }}" style="width:25px; height:25px; margin:0 0 2px 0; float:left;" />
</template>
<template name="img">
<image
class="avatar"
src="{{ item.msg.data }}"
style="width:90px; height:120px; margin:2px auto;"
mode="aspectFit"
bind:tap="previewImage"
data-url="{{ item.msg.data }}" />
</template>
<template name="video">
<video src="{{ item.msg.data }}" controls autoplay />
</template>
<template name="audio">
<audio src="{{ item.msg.url }}" controls autoplay />
<image class="avatar" src="{{ item.msg.data }}" style="width:90px; height:120px; margin:2px auto;" mode="aspectFit" bind:tap="previewImage" data-url="{{ item.msg.data }}" />
</template>
<!-- view 换成 scroll-view效果更好 用view是为了要stopPullDownRefresh -->
<view
scroll-y="true"
class="{{ view }} wrap {{isIPX?'scroll_view_X': ''}}"
bind:tap="onTap"
bindscroll="scrollmore"
bindscrolltoupper="refresh"
upper-threshold='-50'
scroll-into-view="{{ toView }}">
<view scroll-y="true" class="{{ view }} wrap {{isIPX?'scroll_view_X': ''}}" bind:tap="onTap" scroll-into-view="{{ toView }}">
<view class="message" wx:for="{{ chatMsg }}" wx:key="{{ item.mid }}" id="{{ item.mid }}">
<!-- <view class="time">
<text class="time-text">{{ item.time }}</text>
</view> -->
<view class="main" class="{{ item.style }}">
<view class="user">
<!-- yourname:就是消息的 from -->
<view class="{{ item.style }}">
<!-- <view class="user">
<text class="user-text">{{ item.yourname + ' ' + item.time}}</text>
</view>
<image class="avatar" src="../../../images/theme@2x.png"/>
</view> -->
<image class="avatar" src="../../../images/theme@2x.png" />
<view class="msg">
<image
class="err {{(item.style == 'self' && item.isFail) ? 'show' : 'hide'}}"
src="../../../images/msgerr.png"/>
<image class="err {{(item.style == 'self' && item.isFail) ? 'show' : 'hide'}}" src="../../../images/msgerr.png" />
<image wx:if="{{item.style == 'self'}}" src="../../../images/poprightarrow@2x.png" class="msg_poprightarrow"/>
<image wx:if="{{item.style == ''}}" src="../../../images/popleftarrow@2x.png" class="msg_popleftarrow"/>
<view wx:if="{{ item.msg.type == 'img' || item.msg.type == 'video' }}">
<template is="{{ item.msg.type }}" data="{{ item }}"/>
<!-- <image wx:if="{{item.style == 'self'}}" src="../../../images/poprightarrow@2x.png" class="msg_poprightarrow" /> -->
<!-- <image wx:if="{{item.style == ''}}" src="../../../images/popleftarrow@2x.png" class="msg_popleftarrow" /> -->
<view wx:if="{{ item.msg.type == 'img'}}">
<template is="{{ item.msg.type }}" data="{{ item }}" />
</view>
<audio-msg
wx:if="{{ item.msg.type == 'audio' }}"
msg="{{ item }}"></audio-msg>
<view wx:elif="{{ item.msg.type == 'txt' || item.msg.type == 'emoji' }}">
<view class="template" wx:for="{{ item.msg.data }}" wx:key="">
<template is="{{ item.type }}" data="{{ item }}"/>
<template is="{{ item.type }}" data="{{ item }}" />
</view>
</view>
</view>
<view class="time">
<text class="time-text">{{ item.time }}</text>
</view>
</view>
</view>
</view>
......
......@@ -14,7 +14,7 @@
right: 0;
bottom: 150rpx;*/
margin-bottom: 174rpx;
background-color: #FAFAFA;
background-color: #fff;
}
.scroll_view_X,
......@@ -28,26 +28,22 @@
}
.message {
width: 92%;
height: auto;
padding: 0 30rpx;
margin: 0 24rpx 30rpx;
position: relative;
}
.time {
margin: 14rpx 0;
text-align: center;
margin:0rpx 0 0 92rpx
}
.self .time{
margin:0rpx 92rpx 0 0 ;
}
.time .time-text {
display: inline-block;
padding: 6rpx 20rpx 0 20rpx;
font-size: 24rpx;
color: #fff;
line-height: 28rpx;
border-radius: 4rpx;
background-color: #dcdcdc;
font-size: 22rpx;
color:#ADB6BF;
}
.user .user-text {
......@@ -58,26 +54,27 @@
}
.avatar {
width: 72rpx;
height: 72rpx;
margin: 0 20rpx 0 0;
border-radius: 6rpx;
width: 68rpx;
height: 68rpx;
/* margin-left:24rpx; */
border-radius: 8rpx;
float: left;
margin: 0 24rpx 0 0;
}
.msg {
display: inline-block;
padding: 20rpx;
padding: 14rpx 24rpx;
max-width: calc(85% - 80rpx);
min-height: 40rpx;
/* min-height: 40rpx; */
font-size: 24rpx;
/*overflow: hidden;*/
text-align: left;
word-break: break-all;
background-color: #fff;
border-radius: 26rpx;
background-color: #DFECFC;
border-radius:8rpx;
position: relative;
margin-top: 24rpx;
color: #515559;
}
.msg .msg_poprightarrow {
......@@ -98,7 +95,7 @@
.msg .msg-text {
line-height: 40rpx;
font-size: 32rpx;
font-size: 26rpx;
margin: 0;
}
......@@ -117,7 +114,7 @@
.self .avatar {
float: right;
margin: 0 0 0 20rpx;
margin: 0 0 0 24rpx;
}
.user {
......@@ -126,8 +123,7 @@
}
.self .msg {
background-color: #0873DE;
color: #fff;
background-color: #FCF2DF;
}
.self .msg:before {
......
images/pic.png

927 Bytes

......@@ -19,14 +19,6 @@ Page({
onUnload() {
disp.fire("em.chatroom.leave");
},
onPullDownRefresh: function () {
wx.showNavigationBarLoading();
this.selectComponent('#chat').getMore()
// 停止下拉动作
wx.hideNavigationBarLoading();
wx.stopPullDownRefresh();
},
}
});
{
"navigationBarTitleText": "chatting",
"backgroundTextStyle": "dark",
"enablePullDownRefresh": true,
"enablePullDownRefresh": false,
"usingComponents": {
"chat": "../../components/chat/chat"
"chat": "../../../components/chat/chat"
}
}
\ No newline at end of file
/* pages/detail/chat/index.wxss */
page{
background-color: #fff;
}
\ No newline at end of file
......@@ -13,7 +13,7 @@
<text class="icon iconfont iconiconxiantiaoshouji13 close-icon"></text>
</view>
<view class="message-list">
<view class="message-item px-hr-bottom row verCenter bothSide nowrap" wx:for="{{ arr }}" wx:key="index" catchtap="into_chatRoom">
<view class="message-item px-hr-bottom row verCenter bothSide nowrap" wx:for="{{ arr }}" wx:key="index" catchtap="into_chatRoom" data-item="{{ item }}">
<view class="message-l row verCenter ellipsis">
<cover-image src="/res/images/imgs/iclogo.png" class="message-avar"></cover-image>
<view class="message-l-view ellipsis">
......@@ -23,7 +23,7 @@
</view>
<view class="message-r">
<view class="message-r-t">{{item.time}}</view>
<view class="message-r-n">{{ item.unReadCount }}</view>
<view class="message-r-n" wx:if="{{ item.unReadCount > 0 || item.unReadCount == '99+' }}">{{ item.unReadCount }}</view>
</view>
</view>
</view>
......
......@@ -39,13 +39,24 @@
"current": -1,
"list": []
},
"plugin": {
"current": -1,
"list": []
},
"game": {
"currentL": -1,
"list": []
},
"miniprogram": {
"current": -1,
"list": []
"current": 0,
"list": [
{
"id": -1,
"name": "pages/detail/chat/index",
"pathName": "pages/detail/chat/index",
"scene": null
}
]
}
}
}
\ No newline at end of file
......@@ -12,14 +12,14 @@ window.WebIM.config = config;
//var DOMParser = window.DOMParser = xmldom.DOMParser;
//let document = window.document = new DOMParser().parseFromString("<?xml version='1.0'?>\n", "text/xml");
WebIM.isDebug = function(option){
WebIM.isDebug = function (option) {
if (option) {
WebIM.config.isDebug = option.isDebug
openDebug(WebIM.config.isDebug)
}
function openDebug(value){
function ts(){
function openDebug(value) {
function ts() {
var d = new Date();
var Hours = d.getHours(); // 获取当前小时数(0-23)
var Minutes = d.getMinutes(); // 获取当前分钟数(0-59)
......@@ -27,23 +27,23 @@ WebIM.isDebug = function(option){
return (Hours < 10 ? "0" + Hours : Hours) + ":" + (Minutes < 10 ? "0" + Minutes : Minutes) + ":" + (Seconds < 10 ? "0" + Seconds : Seconds) + " ";
}
Strophe.Strophe.log = function(level, msg){
Strophe.Strophe.log = function (level, msg) {
// console.log(ts(), level, msg);
};
if (value) {
Strophe.Strophe.Connection.prototype.rawOutput = function(data){
try{
Strophe.Strophe.Connection.prototype.rawOutput = function (data) {
try {
console.group("%csend # " + ts(), "color: blue; font-size: large");
console.log("%c" + data, "color: blue");
console.groupEnd();
}
catch(e){
catch (e) {
console.log(e);
}
};
}else{
Strophe.Strophe.Connection.prototype.rawOutput = function(){};
} else {
Strophe.Strophe.Connection.prototype.rawOutput = function () { };
}
}
......@@ -54,7 +54,7 @@ WebIM.isDebug = function(option){
* You can auto signed in each time when you refresh the page in dev model.
*/
WebIM.config.autoSignIn = false;
if(WebIM.config.autoSignIn){
if (WebIM.config.autoSignIn) {
WebIM.config.autoSignInName = "lwz2";
WebIM.config.autoSignInPwd = "1";
}
......@@ -71,36 +71,36 @@ if(WebIM.config.autoSignIn){
// function() {
// console.log(arguments, 'ggogogo');
// }, stropheConn.wait, stropheConn.hold);
WebIM.parseEmoji = function(msg){
if(typeof WebIM.Emoji === "undefined" || typeof WebIM.Emoji.map === "undefined"){
WebIM.parseEmoji = function (msg) {
if (typeof WebIM.Emoji === "undefined" || typeof WebIM.Emoji.map === "undefined") {
return msg;
}
var emoji = WebIM.Emoji,
reg = null;
var msgList = [];
var objList = [];
for(var face in emoji.map){
if(emoji.map.hasOwnProperty(face)){
while(msg.indexOf(face) > -1){
for (var face in emoji.map) {
if (emoji.map.hasOwnProperty(face)) {
while (msg.indexOf(face) > -1) {
msg = msg.replace(face, "^" + emoji.map[face] + "^");
}
}
}
var ary = msg.split("^");
var reg = /^e.*g$/;
for(var i = 0; i < ary.length; i++){
if(ary[i] != ""){
for (var i = 0; i < ary.length; i++) {
if (ary[i] != "") {
msgList.push(ary[i]);
}
}
for(var i = 0; i < msgList.length; i++){
if(reg.test(msgList[i])){
for (var i = 0; i < msgList.length; i++) {
if (reg.test(msgList[i])) {
var obj = {};
obj.data = msgList[i];
obj.type = "emoji";
objList.push(obj);
}
else{
else {
var obj = {};
obj.data = msgList[i];
obj.type = "txt";
......@@ -110,7 +110,7 @@ WebIM.parseEmoji = function(msg){
return objList;
};
WebIM.time = function(){
WebIM.time = function () {
var date = new Date();
var Hours = date.getHours();
var Minutes = date.getMinutes();
......@@ -146,7 +146,6 @@ WebIM.Emoji = {
"[^o)]": "ee_21.png",
"[:-*]": "ee_22.png",
"[8-)]": "ee_23.png",
"[del]": "btn_del.png",
"[(|)]": "ee_24.png",
"[(u)]": "ee_25.png",
"[(S)]": "ee_26.png",
......@@ -190,19 +189,18 @@ WebIM.EmojiObj = {
"[:|]": "ee_18.png",
"[*-)]": "ee_19.png",
"[:-#]": "ee_20.png",
"[del]": "del.png"
"[^o)]": "ee_21.png",
},
map4: {
"[^o)]": "ee_21.png",
"[:-*]": "ee_22.png",
"[8-)]": "ee_23.png",
"[(|)]": "ee_24.png",
"[(u)]": "ee_25.png",
"[(S)]": "ee_26.png",
"[(*)]": "ee_27.png"
"[(*)]": "ee_27.png",
"[(#)]": "ee_28.png"
},
map5: {
"[(#)]": "ee_28.png",
"[(R)]": "ee_29.png",
"[({)]": "ee_30.png",
"[(})]": "ee_31.png",
......@@ -210,9 +208,6 @@ WebIM.EmojiObj = {
"[(F)]": "ee_33.png",
"[(W)]": "ee_34.png",
"[(D)]": "ee_35.png"
},
map6: {
"[del]": "del.png"
}
};
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment