lkva/NDOJ
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add time format for chat box

Browse source
This commit is contained in:
cuom1999 2020-03-20 15:34:33 -06:00
parent 112f2b57c3
commit dd34f474a5
4 changed files with 45 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

40
templates/chat/chat.html
View file

@ -1,7 +1,5 @@
{% extends "base.html" %}
{% block js_media %}
<script src="{{ static('libs/jquery.waypoints.min.js')}}"></script>
<script src="{{ static('libs/infinite.min.js') }}"></script>
<script type="text/javascript">
var chatSocket = new WebSocket(
'ws://' + window.location.host +
@ -9,6 +7,8 @@
</script>
<script type="text/javascript">
$(function() {
$('#loader').hide();
chatSocket.onmessage = function(e) {
let data = JSON.parse(e.data)
data = data['message']
@ -36,25 +36,31 @@
</li>`
ul = $('#chat-log')
ul.append(li)
$('#chat-log').scrollTop($('#chat-log')[0].scrollHeight);
$('#chat-box').scrollTop($('#chat-box')[0].scrollHeight);
}
(function init_chatlog() {
ul = $('#chat-log')
{% for msg in message|reverse %}
loadMessage('{{msg.body}}', '{{msg.author}}', '12:00:00', '{{gravatar(msg.author, 32)}}')
loadMessage('{{msg.body}}', '{{msg.author}}', '{{msg.time}}', '{{gravatar(msg.author, 32)}}')
{% endfor %}
})()
var infinite = new Waypoint.Infinite({
element: $('.infinite-container')[0],
onBeforePageLoad: function () {
$('.loading').show();
},
onAfterPageLoad: function ($items) {
$('.loading').hide();
$('#chat-box').scroll(function() {
if ($('#chat-box').scrollTop() == 0) {
console.log('Hi')
$('#loader').show()
}
});
})
// var infinite = new Waypoint.Infinite({
// element: $('.infinite-container')[0],
// onBeforePageLoad: function () {
// $('.loading').show();
// },
// onAfterPageLoad: function ($items) {
// $('.loading').hide();
// }
// });
$("#chat-submit").click(function() {
if ($("#chat-input").val().trim()) {
@ -118,14 +124,14 @@
{% block body %}
<div id="chat-area">
<ul id="chat-log" class="infinite-container">
</ul>
<div id="chat-box">
<img src="http://opengraphicdesign.com/wp-content/uploads/2009/01/loader64.gif" id="loader">
<ul id="chat-log" class="infinite-container waypoint">
</ul>
</div>
{{_('Your message')}}
<textarea rows="6" id="chat-input"></textarea>
</div>
<button id="chat-submit"> Send </button>
{% if page_obj.has_next %}
<a href="{{ request.path }}?page={{ message.next_page_number }}">next</a>
{% endif %}
{% endblock body %}