forked from MarseyWorld/MarseyWorld
fart
parent
0293f60453
commit
e0cb92d654
|
|
@ -0,0 +1,343 @@
|
|||
{% extends "default.html" %}
|
||||
|
||||
{% block PseudoSubmitForm %}{% endblock %}
|
||||
{% block sidebar %}{% endblock %}
|
||||
{% block navbar %}{% endblock %}
|
||||
{% block sortnav %}{% endblock %}
|
||||
{% block viewfilters %}{% endblock %}
|
||||
{% block mobilenavbar %}{% endblock %}
|
||||
{% block mobile_description %}{% endblock %}
|
||||
|
||||
{% block title %}
|
||||
<title>Chat</title>
|
||||
<meta name="description" content="Chat">
|
||||
{% endblock %}
|
||||
|
||||
{% block desktopbanner %}
|
||||
{% endblock %}
|
||||
|
||||
{% block infobar %}
|
||||
<div class="border-right py-3 px-3">
|
||||
<span data-toggle="tooltip" data-placement="bottom" title="people online right now" class="text-muted">
|
||||
<i class="far fa-user fa-sm mr-1"></i><span class="board-chat-count"></span>
|
||||
</span>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<div class="container p-md-0 chat-container">
|
||||
|
||||
<div id="chat-window">
|
||||
<div id="chat-text" {% if request.path.endswith('/chat') %}class="fullchat"{% else %}class="sidebarchat"{% endif %}>
|
||||
</div>
|
||||
<div id="system-template">
|
||||
<div class="system-line">
|
||||
<p class="message text-muted"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% if request.path.endswith('/chat') %}
|
||||
<div class="position-relative form-group d-flex pb-3">
|
||||
<div class="position-absolute text-muted text-small" style="bottom: -1.5rem; line-height: 1;">
|
||||
<span id="typing-indicator"></span>
|
||||
<span id="loading-indicator" class="d-none"></span>
|
||||
</div>
|
||||
<input id="input-text" type="text" class="form-control" placeholder="Message #, or type /help" autocomplete="off" autofocus />
|
||||
{% if v.has_premium %}
|
||||
<label class="btn btn-secondary ml-3 mb-0" for="chat-image-upload">
|
||||
<div id="filename-show"><i class="fad fa-image"></i></div>
|
||||
<input id="chat-image-upload" type="file" name="image" accept="image/*" onchange="upload_chat_image()" hidden>
|
||||
</label>
|
||||
{% endif %}
|
||||
<button id="chatsend" class="btn btn-primary ml-3" type="submit">Send</button>
|
||||
</div>
|
||||
<input id="autojoin" type="hidden" value="True">
|
||||
{% else %}
|
||||
<div class="position-relative form-group pb-3">
|
||||
<div class="position-absolute text-muted text-small" style="bottom: -.5rem; line-height: 1;">
|
||||
<span id="typing-indicator"></span>
|
||||
<span id="loading-indicator" class="d-none"></span>
|
||||
</div>
|
||||
<input id="input-text" type="text" class="form-control" placeholder="Message or type /help" autocomplete="off">
|
||||
<div class="d-flex mt-3">
|
||||
{% if v.has_premium %}
|
||||
<label class="btn btn-secondary w-20 mr-3 mb-0 ml-auto" for="chat-image-upload">
|
||||
<div id="filename-show"><i class="fad fa-image"></i></div>
|
||||
<input id="chat-image-upload" type="file" name="image" accept="image/*" onchange="upload_chat_image()" hidden>
|
||||
</label>
|
||||
{% endif %}
|
||||
<button id="chatsend" class="btn btn-primary w-100 ml-auto" type="submit">Send</button>
|
||||
</div>
|
||||
</div>
|
||||
<input id="autojoin" type="hidden" value="{{ v.auto_join_chat }}">
|
||||
{% endif %}
|
||||
<input id="guildname" type="hidden" value="general">
|
||||
<input id="username" type="hidden" value="{{ v.username }}">
|
||||
|
||||
<div id="chat-line-template" class="d-none">
|
||||
<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">
|
||||
</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">
|
||||
<a href="" class="font-weight-bold text-black userlink" target="_blank">@<span class="username"></span></a>
|
||||
<div style="overflow:hidden" class="pl-4 pl-md-0 ml-4 ml-md-0">
|
||||
<span class="chat-message text-black text-break"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="msg-in-template" class="d-none">
|
||||
<div class="chat-line my-2 chat-mention">
|
||||
<div class="d-flex align-items-center">
|
||||
<span class="rounded mb-auto d-none d-md-block chat-profile" data-toggle="tooltip" data-placement="right">
|
||||
<img class="desktop-avatar rounded-circle w-100">
|
||||
</span>
|
||||
<div class="pl-md-3 text-muted">
|
||||
<div>
|
||||
<img class="mobile-avatar profile-pic-30 mr-2 d-inline-block d-md-none" >
|
||||
from <a href="" class="font-weight-bold text-black userlink" target="_blank">@<span class="username"></span></a> to <b>me</b>.<i class="fad fa-eye-slash ml-1"></i>
|
||||
<div style="overflow:hidden" class="pl-4 pl-md-0 ml-4 ml-md-0">
|
||||
<span class="chat-message text-black"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="msg-out-template" class="d-none">
|
||||
<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" data-toggle="tooltip" data-placement="right">
|
||||
</span>
|
||||
<div class="pl-md-3 text-muted">
|
||||
<div>
|
||||
<img class="mobile-avatar profile-pic-30 mr-2 d-inline-block d-md-none" >
|
||||
from <b>me</b> to <a href="" class="font-weight-bold text-black userlink" target="_blank">@<span class="username"></span></a>.<i class="fad fa-eye-slash ml-1"></i>
|
||||
<div style="overflow:hidden" class="pl-4 pl-md-0 ml-4 ml-md-0">
|
||||
<span class="chat-message text-black"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="bot-template" class="d-none">
|
||||
<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" data-toggle="tooltip" data-placement="right">
|
||||
</span>
|
||||
<div class="pl-md-3 text-muted">
|
||||
<div>
|
||||
<img class="mobile-avatar profile-pic-30 mr-2 d-inline-block d-md-none" >
|
||||
<a href="" class="font-weight-bold text-black userlink" target="_blank">@<span class="username"></span></a><i class="fad fa-robot text-info ml-1"></i>
|
||||
<div style="overflow:hidden" class="pl-4 pl-md-0 ml-4 ml-md-0">
|
||||
<span class="chat-message text-black"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="help-template" class="d-none">
|
||||
<div class="system-line">
|
||||
<p class="message text-muted"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="me-template" class="d-none">
|
||||
<div class="system-line">
|
||||
<p><i class="message text-muted"></i></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="system-info" class="d-none">
|
||||
<div class="system-line">
|
||||
<p class="message text-primary"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="system-warning" class="d-none">
|
||||
<div class="system-line">
|
||||
<p class="message text-danger"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="gm-template" class="d-none">
|
||||
<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">
|
||||
</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">
|
||||
<a href="" class="font-weight-bold text-warning userlink" target="_blank">@<span class="username"></span></a><i class="fad fa-crown text-warning ml-1"></i>
|
||||
<div style="overflow:hidden" class="pl-4 pl-md-0 ml-4 ml-md-0">
|
||||
<span class="chat-message text-black"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="motd-template" class="d-none">
|
||||
<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" data-toggle="tooltip" data-placement="right">
|
||||
<img class="desktop-avatar rounded-circle w-100">
|
||||
</span>
|
||||
<div class="pl-md-3 text-muted">
|
||||
<div>
|
||||
<img class="mobile-avatar profile-pic-30 mr-2 d-inline-block d-md-none" >
|
||||
<a href="" class="font-weight-bold text-primary userlink" target="_blank">+<span class="username"></span></a><i class="fad fa-chess-rook text-primary ml-1"></i>
|
||||
<div style="overflow:hidden" class="pl-4 pl-md-0 ml-4 ml-md-0">
|
||||
<span class="chat-message text-black"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="admin-template" class="d-none">
|
||||
<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" data-toggle="tooltip" data-placement="right">
|
||||
<img class="desktop-avatar rounded-circle w-100">
|
||||
</span>
|
||||
<div class="pl-md-3 text-muted">
|
||||
<div>
|
||||
<img class="mobile-avatar profile-pic-30 mr-2 d-inline-block d-md-none" >
|
||||
<a href="" class="font-weight-bold text-danger userlink" target="_blank">@<span class="username"></span></a><i class="fad fa-shield text-danger ml-1"></i>
|
||||
<div style="overflow:hidden" class="pl-4 pl-md-0 ml-4 ml-md-0">
|
||||
<span class="chat-message text-black"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="wallop-template" class="d-none">
|
||||
<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">
|
||||
</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">
|
||||
<a href="" class="font-weight-bold text-danger userlink" target="_blank">@<span class="username"></span></a><i class="fad fa-shield text-danger ml-1"></i><i class="fad fa-bullhorn text-danger ml-1"></i>
|
||||
<div style="overflow:hidden" class="pl-4 pl-md-0 ml-4 ml-md-0">
|
||||
<span class="chat-message font-weight-bold text-black"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/jquery-2.0.3.min.js"></script>
|
||||
<script src="/assets/js/socketio.js"></script>
|
||||
|
||||
<script src="/assets/js/chat.js?v=2.38.0a"></script>
|
||||
|
||||
<style>
|
||||
|
||||
/*
|
||||
.sidebar-chat:focus-within #chat-text {
|
||||
overflow-y:scroll;
|
||||
animation: chatexpand ease-out 500ms;
|
||||
max-height:calc(100vh - 300px);
|
||||
}
|
||||
|
||||
.sidebar-chat:not(:focus-within) #chat-text {
|
||||
overflow-y:scroll;
|
||||
max-height: 200px;
|
||||
}
|
||||
|
||||
@keyframes chatexpand {
|
||||
from {max-height: 200px;}
|
||||
to {max-height:calc(100vh - 300px);}
|
||||
}
|
||||
@-webkit-keyframes chatexpand {
|
||||
from {max-height: 200px;}
|
||||
to {max-height:calc(100vh - 300px);}
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
#chat-window {
|
||||
max-height:calc(100vh - 300px);
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
#loading-indicator:after {
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
vertical-align: bottom;
|
||||
-webkit-animation: ellipsis steps(4,end) 900ms infinite;
|
||||
animation: ellipsis steps(4,end) 900ms infinite;
|
||||
content: "\2026"; /* ascii code for the ellipsis character */
|
||||
width: 0px;
|
||||
}
|
||||
|
||||
@keyframes ellipsis {
|
||||
to {
|
||||
width: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes ellipsis {
|
||||
to {
|
||||
width: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.chat-mention {
|
||||
background-color: rgba(128, 90, 213, 0.3);
|
||||
}
|
||||
|
||||
|
||||
/* Hide scrollbar for Chrome, Safari and Opera */
|
||||
#chat-window::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Hide scrollbar for IE, Edge and Firefox */
|
||||
#chat-window {
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
|
||||
.fullchat .chat-profile {
|
||||
min-width: 42px;
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
}
|
||||
|
||||
.sidebarchat .chat-profile {
|
||||
min-width: 30px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
</style>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
gunicorn ruqqus.__main__:app load_chat -k eventlet -w 1 --worker-connections 1000 --max-requests 1000000 --preload --bind 127.0.0.1:5001 -D
|
||||
Loading…
Reference in New Issue