Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

消息捕获-左侧窗口消息添加用户id和消息发送时间 #146

Closed
wants to merge 8 commits into from
Closed

消息捕获-左侧窗口消息添加用户id和消息发送时间 #146

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
1253b2c
用户消息捕获
zsh4869 May 8, 2024
550007c
Merge pull request #145 from zsh4869/APTX4869
adlered May 8, 2024
fe5df30
:art: #145 build
adlered May 8, 2024
547dabf
:wrench: #145 修复捕获按钮bug
adlered May 8, 2024
367a505
:wrench: #145 捕获按钮不检查屏幕尺寸
adlered May 8, 2024
9532677
:wrench: #145 修复红包不显示的问题
adlered May 8, 2024
3d3d558
消息捕获添加用户id和时间
zsh4869 May 8, 2024
a2be998
删除测试的日志输出
zsh4869 May 9, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/main/resources/css/base.css
View file
Open in desktop

Large diffs are not rendered by default.

104 changes: 60 additions & 44 deletions src/main/resources/js/channel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -472,53 +472,69 @@ var ChatRoomChannel = {
$('#barragerUnit').text(data.unit);
break;
case 'msg':
// Chatroom
if ($("#chatRoomIndex").length === 0 && $("#chatroom" + data.oId).length <= 0) {
ChatRoom.renderMsg(data);
ChatRoom.resetMoreBtnListen();
}

// index
if ($("#chatRoomIndex").has("#emptyChatRoom").length !== 0) {
$("#emptyChatRoom").remove();
}
let userNickname = data.userNickname;
let userName = data.userName;
if (userNickname !== undefined && userNickname !== "") {
userNickname = userNickname + " ( " + userName + " )"
} else {
userNickname = userName;
}
let newContent = data.content;
if (newContent.indexOf("\"msgType\":\"redPacket\"") !== -1) {
newContent = "[收到红包，请在完整版聊天室查看]";
}
$("#chatRoomIndex").prepend("" +
"<li class=\"fn-flex\" id=\"chatindex" + data.oId + "\" style='display: none; border-bottom: 1px solid #eee;'>\n" +
" <a rel=\"nofollow\" href=\"/member/" + data.userName + "\">\n" +
" <div class=\"avatar tooltipped tooltipped-n\"\n" +
" aria-label=\"" + data.userName + "\"\n" +
" style=\"background-image:url('" + data.userAvatarURL48 + "')\"></div>\n" +
" </a>\n" +
" <div class=\"fn-flex-1\">\n" +
" <div class=\"ft-smaller\">\n" +
" <a rel=\"nofollow\" href=\"/member/" + data.userName + "\">\n" +
" <span class=\"ft-gray\">" + userNickname + "</span>\n" +
" </a>\n" +
" </div>\n" +
" <div class=\"vditor-reset comment " + Label.chatRoomPictureStatus + "\">\n" +
" " + newContent + "\n" +
" </div>\n" +
" </div>\n" +
"</li>");
if ($("#chatRoomIndex li.fn-flex").length === 11) {
$("#chatRoomIndex li.fn-flex:last").fadeOut(199, function () {
$("#chatRoomIndex li.fn-flex:last").remove();
});
let newMd = data.md;
let robotAvatar = data.userAvatarURL;
// 判断为捕获用户，且不是红包消息的情况
if (ChatRoom.catchUsers.includes(userName) && newContent.indexOf("\"msgType\":\"redPacket\"") == -1) {
let robotDom = '<div class="robot-msg-item"><div class="avatar" style="background-image: url(' + robotAvatar + ')"></div><div class="robot-msg-content"><div class="robot-username"><p>'+userName+'</p></div> ' + newContent + ' <div class="fn__right" style="margin-top: 5px; font-size: 10px;">'+data.time+'</div></div></div>';
ChatRoom.addRobotMsg(robotDom);
} else {
// Chatroom
// 判断指令消息
if ($('#catch-word').prop('checked') && newContent.indexOf("\"msgType\":\"redPacket\"") == -1 && (newMd.startsWith("鸽 ") || newMd.startsWith("小冰 ") || newMd.startsWith("凌 ") || newMd.startsWith("ida "))) {
let robotDom = '<div class="robot-msg-item"><div class="avatar" style="background-image: url(' + robotAvatar + ')"></div><div class="robot-msg-content"><div class="robot-username"><p>'+userName+'</p></div> ' + newContent + ' <div class="fn__right" style="margin-top: 5px; font-size: 10px;">'+data.time+'</div></div></div>';
ChatRoom.addRobotMsg(robotDom);
} else {
if ($("#chatRoomIndex").length === 0 && $("#chatroom" + data.oId).length <= 0) {
ChatRoom.renderMsg(data);
ChatRoom.resetMoreBtnListen();
}

// index
if ($("#chatRoomIndex").has("#emptyChatRoom").length !== 0) {
$("#emptyChatRoom").remove();
}
let userNickname = data.userNickname;

if (userNickname !== undefined && userNickname !== "") {
userNickname = userNickname + " ( " + userName + " )"
} else {
userNickname = userName;
}

if (newContent.indexOf("\"msgType\":\"redPacket\"") !== -1) {
newContent = "[收到红包，请在完整版聊天室查看]";
}
$("#chatRoomIndex").prepend("" +
"<li class=\"fn-flex\" id=\"chatindex" + data.oId + "\" style='display: none; border-bottom: 1px solid #eee;'>\n" +
" <a rel=\"nofollow\" href=\"/member/" + data.userName + "\">\n" +
" <div class=\"avatar tooltipped tooltipped-n\"\n" +
" aria-label=\"" + data.userName + "\"\n" +
" style=\"background-image:url('" + data.userAvatarURL48 + "')\"></div>\n" +
" </a>\n" +
" <div class=\"fn-flex-1\">\n" +
" <div class=\"ft-smaller\">\n" +
" <a rel=\"nofollow\" href=\"/member/" + data.userName + "\">\n" +
" <span class=\"ft-gray\">" + userNickname + "</span>\n" +
" </a>\n" +
" </div>\n" +
" <div class=\"vditor-reset comment " + Label.chatRoomPictureStatus + "\">\n" +
" " + newContent + "\n" +
" </div>\n" +
" </div>\n" +
"</li>");
if ($("#chatRoomIndex li.fn-flex").length === 11) {
$("#chatRoomIndex li.fn-flex:last").fadeOut(199, function () {
$("#chatRoomIndex li.fn-flex:last").remove();
});
}
$("#chatRoomIndex li:first").slideDown(200);
Util.listenUserCard();
typeof ChatRoom==="object"&&ChatRoom.imageViewer()
}
}
$("#chatRoomIndex li:first").slideDown(200);
Util.listenUserCard();
typeof ChatRoom==="object"&&ChatRoom.imageViewer()
break;
}
}
Expand Down
2 changes: 1 addition & 1 deletion src/main/resources/js/channel.min.js
View file
Open in desktop

Large diffs are not rendered by default.

105 changes: 105 additions & 0 deletions src/main/resources/js/chat-room.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -464,6 +464,8 @@ var ChatRoom = {
ChatRoom.loadAvatarPendant();
// 加载小冰游戏
ChatRoom.loadXiaoIceGame();
// 初始化用户捕获
ChatRoom.initCatchUser();
// 加载画图
ChatRoom.charInit('paintCanvas');
// 监听弹幕
Expand Down Expand Up @@ -1311,6 +1313,10 @@ border-bottom: none;
* @param userName
*/
shileds: ',',
/**
* 捕获聊天室 某人 消息
*/
catchUsers: '',
shiled: function (uName) {
if (confirm("友好的交流是沟通的基础, 确定要屏蔽 Ta 吗？\n本次屏蔽仅针对当前页面有效, 刷新后需重新屏蔽！")) {
ChatRoom.shileds += uName +",";
Expand Down Expand Up @@ -2168,6 +2174,105 @@ ${result.info.msg}
}));
},

initCatchUser: function () {
// 判断页面是否满足用户开启捕获功能
var sideDom = document.getElementsByClassName('side')[0];
var chatDom = document.getElementsByClassName('chat-room')[0];
var needWidth = sideDom.offsetWidth + chatDom.offsetWidth + 300; // 最小宽度为300px
if (needWidth > window.innerWidth) {
// 删除用户捕获相关的组件和按钮
//$("#robotBtn").remove();
//$("#robotBox").remove();
} else {
// 自动调整css样式
var chatDomHeight = window.innerHeight - document.getElementsByClassName('nav')[0].offsetHeight;
$("#robotMsgList").attr("style", "height:" + (chatDomHeight - 55) + "px");
// $(".robot-active").eq(0).attr("style", "height:" + (chatDomHeight - 25) + "px");
// $("#robotBox").attr("style", "height:" + (chatDomHeight - 25) + "px");
}
// 点击事件
$("#robotBtn").click(function () {
$("#robotBox").show(200),
$("#robotBtn").hide(200),
setTimeout(() => {
$("#robotBox").addClass("robot-active");
var chatDomHeight = window.innerHeight - document.getElementsByClassName('nav')[0].offsetHeight;
$("#robotBox").attr("style", "height:" + (chatDomHeight - 25) + "px");
}
, 220)
})
$("#robotClose").click(function () {
var e = $("#robotBox");
setTimeout(() => {
$(".robot-chat-input").val(""),
$("#robotBox").hide(200),
$("#robotBtn").show(200)
}
, e.hasClass("robot-active") ? 420 : 1),
e.removeClass("robot-active")
e.css("height", "");
})
$("#robotMinimize").click(function () {
$("#robotBox").toggleClass("robot-active")
})
$("#clearRobotMsg").click(function () {
$(".robot-msg-item").remove();
})
$("#catch-word").click(function () {
window.localStorage['catch-word-flag'] = $('#catch-word').prop('checked');
})
$("#changeCatchUsers").click(function () {
Util.alert("" +
"<div class=\"form fn__flex-column\">\n" +
"<label>\n" +
" <div class=\"ft__smaller\" style=\"float: left\">将捕获的用户id填写到下方输入框；<br>多个用户id的情况用英文逗号隔开。</div>\n" +
" <div class=\"fn-hr5 fn__5\"></div>\n" +
" <input type=\"text\" id=\"robot-catch-user\">\n" +
"</label>\n" +
"<div class=\"fn-hr5\"></div>\n" +
"<div class=\"fn__flex\" style=\"margin-top: 15px; justify-content: flex-end;\">\n" +
" <button class=\"btn btn--confirm\" onclick='ChatRoom.changeCatchUser($(\"#robot-catch-user\").val());Util.closeAlert();'>确认</button>\n" +
"</div>\n" +
"</div>" +
"", "编辑捕获用户列表");
$("#robot-catch-user").val(window.localStorage['robot_list'] ? window.localStorage['robot_list'] : '');
})

// 读取浏览器缓存，获取捕获的用户 和是否捕获关键字
var robotList = window.localStorage['robot_list'] ? window.localStorage['robot_list'] : '';
ChatRoom.changeCatchUser(robotList);
let status = false;
if (window.localStorage['catch-word-flag'] === 'true') {
status = true;
}
$('#catch-word').prop('checked', status);
},

changeCatchUser: function (robotList) {
if (robotList && robotList.length > 0) {
let changeCatch = '<div class="robot-msg-item">' +
'<div class="robot-msg-content">当前捕获用户:' + robotList + '</div>' +
'</div></div>';
$("#robotMsgList").prepend(changeCatch);
} else {
let changeCatch = '<div class="robot-msg-item">' +
'<div class="robot-msg-content">当前不存在需要捕获的用户</div>' +
'</div></div>';
$("#robotMsgList").prepend(changeCatch);
}
window.localStorage['robot_list'] = robotList;
ChatRoom.catchUsers = robotList.split(",");
},

addRobotMsg: function (t) {
$("#robotMsgList").prepend(t);
// 当dom元素数量达到一定程度时，只保留最近的n条数据
const n = 50;
if ($(".robot-msg-item") && $(".robot-msg-item").length > n) {
$('.robot-msg-item:gt(n-1)').remove();
}
},

/**
* 按时间加载头像挂件
* */
Expand Down
Loading
Loading