feat(user_msg): auto fetch new messages

This commit is contained in:
Baoshuo Ren 2023-01-16 16:44:12 +08:00
parent 7184774cff
commit 99e9a839af
Signed by: baoshuo
GPG Key ID: 00CB9680AB29F51A

View File

@ -188,11 +188,16 @@ if (isset($_POST['user_msg'])) {
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var REFRESH_INTERVAL = 30 * 1000;
$(document).ready(function() { $(document).ready(function() {
$.ajaxSetup({ $.ajaxSetup({
async: false async: false
}); });
refreshConversations(); refreshConversations();
setInterval(refreshConversations, REFRESH_INTERVAL);
<?php if (isset($_GET['enter'])) : ?> <?php if (isset($_GET['enter'])) : ?>
enterConversation(<?= json_encode($_GET['enter']) ?>); enterConversation(<?= json_encode($_GET['enter']) ?>);
<?php endif ?> <?php endif ?>
@ -264,7 +269,7 @@ if (isset($_POST['user_msg'])) {
function addBubble(content, send_time, read_time, msgId, conversation, page, type) { function addBubble(content, send_time, read_time, msgId, conversation, page, type) {
$("#history-list").append( $("#history-list").append(
'<div class="d-flex align-items-end mt-3" style="' + (type ? 'margin-left:20%;' : 'margin-right:20%;') + '">' + '<div class="d-flex align-items-end mt-3" style="' + (type ? 'margin-left:20%;' : 'margin-right:20%;') + '">' +
(type ? '' : '<img class="flex-shrink-0 me-2 rounded" width="32" height="32" src="' + conversations[conversation][1] + '" />') + (type ? '' : '<img class="flex-shrink-0 me-2 rounded" width="32" height="32" src="' + conversations[conversation][1] + '" style="user-select: none;" />') +
'<div class="card flex-grow-1">' + '<div class="card flex-grow-1">' +
'<div class="card-body px-3 py-2" style="white-space:pre-wrap">' + '<div class="card-body px-3 py-2" style="white-space:pre-wrap">' +
htmlspecialchars(content) + htmlspecialchars(content) +
@ -275,10 +280,10 @@ if (isset($_POST['user_msg'])) {
'</span>' + '</span>' +
(read_time == null ? (read_time == null ?
'<span class="float-end" data-bs-toggle="tooltip" data-bs-title="未读"><i class="bi bi-check2"></i></span>' : '<span class="float-end" data-bs-toggle="tooltip" data-bs-title="未读"><i class="bi bi-check2"></i></span>' :
'<span class="float-end" data-bs-toggle="tooltip" data-bs-title="查看时间: ' + read_time + '"><i class="bi bi-check2-all"></i></span>') + '<span class="float-end" data-bs-toggle="tooltip" data-bs-title="' + read_time + '"><i class="bi bi-check2-all"></i></span>') +
'</div>' + '</div>' +
'</div>' + '</div>' +
(type ? '<img class="flex-shrink-0 ms-2 rounded" width="32" height="32" src="' + user_avatar + '" />' : '') + (type ? '<img class="flex-shrink-0 ms-2 rounded" width="32" height="32" src="' + user_avatar + '" style="user-select: none;" />' : '') +
'</div>' '</div>'
); );
} }
@ -328,10 +333,14 @@ if (isset($_POST['user_msg'])) {
break; break;
} }
} }
if (result.length == 11) { if (result.length == 11) {
ret = true; ret = true;
} }
bootstrap.Tooltip.jQueryInterface.call($('#history-list [data-bs-toggle="tooltip"]'));
bootstrap.Tooltip.jQueryInterface.call($('#history-list [data-bs-toggle="tooltip"]'), {
container: $('#history-list'),
});
}); });
return ret; return ret;
} }
@ -362,6 +371,9 @@ if (isset($_POST['user_msg'])) {
var slideTime = 300; var slideTime = 300;
var page = 1; var page = 1;
var changeAble = refreshHistory(conversationName, page); var changeAble = refreshHistory(conversationName, page);
intervalId = setInterval(function() {
changeAble = refreshHistory(conversationName, page);
}, REFRESH_INTERVAL);
$('#history').show(); $('#history').show();
$('#conversations').addClass('d-none d-md-block') $('#conversations').addClass('d-none d-md-block')
$('#input-message').unbind('keydown').keydown(function(e) { $('#input-message').unbind('keydown').keydown(function(e) {
@ -377,18 +389,25 @@ if (isset($_POST['user_msg'])) {
return false; return false;
}); });
$('#goBack').unbind("click").click(function() { $('#goBack').unbind("click").click(function() {
clearInterval(intervalId);
refreshConversations(); refreshConversations();
$("#history").hide(); $("#history").hide();
$("#conversations").removeClass('d-none d-md-block'); $("#conversations").removeClass('d-none d-md-block');
return; return;
}); });
$('#pageLeft').unbind("click").click(function() { $('#pageLeft').unbind("click").click(function() {
if (changeAble) page++; if (changeAble) {
page++;
clearInterval(intervalId);
}
changeAble = refreshHistory(conversationName, page); changeAble = refreshHistory(conversationName, page);
return false; return false;
}); });
$('#pageRight').unbind("click").click(function() { $('#pageRight').unbind("click").click(function() {
if (page > 1) page--; if (page > 1) {
page--;
clearInterval(intervalId);
}
changeAble = refreshHistory(conversationName, page); changeAble = refreshHistory(conversationName, page);
return false; return false;
}); });