forked from MarseyWorld/MarseyWorld
chat improvements
parent
432f1a69c6
commit
04b5749aad
|
|
@ -13,16 +13,18 @@ if SITE in ('pcmemes.net', 'localhost'):
|
|||
socketio = SocketIO(app, async_mode='gevent')
|
||||
typing = []
|
||||
online = []
|
||||
messages = []
|
||||
|
||||
@app.get("/chat")
|
||||
@auth_required
|
||||
def chat( v):
|
||||
return render_template("chat.html", v=v)
|
||||
return render_template("chat.html", v=v, messages=messages)
|
||||
|
||||
@socketio.on('speak')
|
||||
@limiter.limit("5/second;30/minute")
|
||||
@auth_required
|
||||
def speak(data, v):
|
||||
global messages
|
||||
data = data[:1000].strip()
|
||||
if not data: abort(403)
|
||||
|
||||
|
|
@ -34,6 +36,8 @@ if SITE in ('pcmemes.net', 'localhost'):
|
|||
"time": time.strftime("%d %b %Y at %H:%M:%S", time.gmtime(int(time.time())))
|
||||
}
|
||||
|
||||
messages.append(data)
|
||||
messages = messages[:20]
|
||||
emit('speak', data, broadcast=True)
|
||||
return '', 204
|
||||
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
</span>
|
||||
<div class="pl-md-3 text-muted">
|
||||
<div>
|
||||
<img class="mobile-avatar profile-pic-30 mr-2 d-inline-block d-md-none" data-toggle="tooltip" data-placement="right">
|
||||
<img class="mobile-avatar profile-pic-30 mr-1 d-inline-block d-md-none" data-toggle="tooltip" data-placement="right">
|
||||
<a href="" class="font-weight-bold text-black userlink" target="_blank"></a>
|
||||
<div style="overflow:hidden">
|
||||
<span class="chat-message text-black text-break"></span>
|
||||
|
|
@ -33,9 +33,27 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container p-md-0 chat-container">
|
||||
<div class="container py-0 chat-container">
|
||||
<div id="chat-window">
|
||||
<div id="chat-text" class="fullchat">
|
||||
{% for m in messages %}
|
||||
<div class="chat-line my-2">
|
||||
<div class="d-flex align-items-center">
|
||||
<span class="rounded mb-auto d-none d-md-block chat-profile">
|
||||
<img class="desktop-avatar rounded-circle w-100" src="{{m['avatar']}}">
|
||||
</span>
|
||||
<div class="pl-md-3 text-muted">
|
||||
<div>
|
||||
<img src="{{m['avatar']}}" class="mobile-avatar profile-pic-30 mr-1 d-inline-block d-md-none" data-toggle="tooltip" data-placement="right">
|
||||
<a class="font-weight-bold text-black userlink" style="color:#{{m['namecolor']}}" target="_blank" href="/@{{m['username']}}">{{m['username']}}</a>
|
||||
<div style="overflow:hidden">
|
||||
<span class="chat-message text-black text-break">{{m['text'] | safe}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div id="system-template">
|
||||
<div class="system-line">
|
||||
|
|
@ -81,6 +99,14 @@
|
|||
background-color: var(--primary55);
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.profile-pic-30 {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
object-fit: cover;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
|
|
@ -95,6 +121,8 @@
|
|||
let is_typing = false;
|
||||
let alert=true;
|
||||
|
||||
box.scrollTo(0, box.scrollHeight)
|
||||
|
||||
function flash(){
|
||||
let title = document.getElementsByTagName('title')[0]
|
||||
if (notifs >= 1 && !focused){
|
||||
|
|
@ -134,6 +162,7 @@
|
|||
|
||||
scrolled_down = (box.scrollHeight - box.scrollTop <= window.innerHeight-109)
|
||||
document.getElementsByClassName('desktop-avatar')[0].src = json['avatar']
|
||||
document.getElementsByClassName('mobile-avatar')[0].src = json['avatar']
|
||||
document.getElementsByClassName('userlink')[0].href = '/@' + json['username']
|
||||
document.getElementsByClassName('userlink')[0].innerHTML = json['username']
|
||||
document.getElementsByClassName('userlink')[0].style.color = '#' + json['namecolor']
|
||||
|
|
@ -149,6 +178,7 @@
|
|||
{
|
||||
socket.emit('speak', text);
|
||||
textbox.value = ''
|
||||
textbox.style.height = '40px'
|
||||
is_typing = false
|
||||
socket.emit('typing', false);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -234,6 +234,7 @@
|
|||
{% if '@' not in request.path %}
|
||||
{% if v %}
|
||||
|
||||
{% if request.path != '/chat' %}
|
||||
{% if sub %}
|
||||
<img alt="/h/{{sub.name}} banner" role="button" data-bs-toggle="modal" data-bs-target="#expandImageModal" onclick="expandDesktopImage('{{sub.banner_url}}')" loading="lazy" src="{{sub.banner_url}}" width=100% style="object-fit:cover;max-height:25vw">
|
||||
{% elif SITE_NAME == 'Drama' %}
|
||||
|
|
@ -243,11 +244,12 @@
|
|||
<a href="https://secure.transequality.org/site/Donation2?df_id=1480">
|
||||
<img alt="site banner" src="{{image}}" width="100%">
|
||||
</a>
|
||||
{% elif request.path != '/chat' %}
|
||||
{% else %}
|
||||
<a href="/">
|
||||
<img alt="site banner" src="/static/assets/images/{{SITE_NAME}}/banner.webp?v=1042" width="100%">
|
||||
</a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% else %}
|
||||
<a href="/login">
|
||||
|
|
@ -268,7 +270,7 @@
|
|||
{% block postNav %}
|
||||
{% endblock %}
|
||||
|
||||
<div class="container{% if request.path=='/' or '/post/' in request.path or '/comment/' in request.path %} transparent{% endif %}">
|
||||
<div class="container {% if request.path=='/' or '/post/' in request.path or '/comment/' in request.path %}transparent{% elif request.path == '/chat' %}pb-0{% endif %}">
|
||||
<div class="row justify-content-around" id="main-content-row">
|
||||
|
||||
<div class="col h-100 {% block customPadding %}{% if request.path.startswith('/@') %}user-gutters{% else %}custom-gutters{% endif %}{% endblock %}" id="main-content-col">
|
||||
|
|
|
|||
Loading…
Reference in New Issue