master
Aevann1 2022-03-23 18:15:59 +02:00
parent 07c414c612
commit 1dc0c3417a
2 changed files with 6 additions and 154 deletions

View File

@ -1,6 +1,7 @@
import sys
if "load_chat" in sys.argv:
from files.helpers.const import SITE_FULL
from files.helpers.const import SITE, SITE_FULL
if "load_chat" in sys.argv or SITE == 'localhost':
import time
from files.helpers.wrappers import auth_required
from files.helpers.sanitize import sanitize

View File

@ -76,159 +76,10 @@
</div>
</div>
<script data-cfasync="false" src="/assets/js/socketio.js?v=1"></script>
<script data-cfasync="false">
let socket=io()
let chatline = document.getElementsByClassName('chat-line')[0]
let box = document.getElementById('chat-window')
let textbox = document.getElementById('input-text')
let icon = document.getElementById('favicon')
let notifs = 0;
let scrolled_down = true;
let focused = true;
let is_typing = false;
let alert=true;
box.scrollTo(0, box.scrollHeight)
function flash(){
let title = document.getElementsByTagName('title')[0]
if (notifs >= 1 && !focused){
title.innerHTML = `[+${notifs}] Chat`;
if (alert) {
icon.href = '/static/assets/images/{{SITE_NAME}}/alert.webp?v=1'
alert=false;
}
else {
icon.href = '/static/assets/images/{{SITE_NAME}}/icon.webp?v=1012'
alert=true;
}
setTimeout(flash, 500)
}
else {
icon.href = '/static/assets/images/{{SITE_NAME}}/icon.webp?v=1012'
notifs = 0
title.innerHTML = 'Chat';
}
}
socket.on('speak', function(json) {
let text = json['text']
let text_html = json['text_html']
if (text_html.includes('<a href="/id/{{v.id}}">')){
chatline.classList.add('chat-mention');
}
else {
chatline.classList.remove('chat-mention');
};
notifs = notifs + 1;
if (notifs == 1) {
setTimeout(flash, 500);
}
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']
document.getElementsByClassName('text')[0].innerHTML = text
document.getElementsByClassName('chat-message')[0].innerHTML = text_html
document.getElementById('chat-text').append(document.getElementsByClassName('chat-line')[0].cloneNode(true))
if (scrolled_down) box.scrollTo(0, box.scrollHeight)
})
function send() {
text = textbox.value.trim()
if (text)
{
socket.emit('speak', text);
textbox.value = ''
textbox.style.height = '40px'
is_typing = false
socket.emit('typing', false);
}
}
function quote(text) {
textbox.style.height = '80px'
textbox.value = '> ' + text + '\n\n'
textbox.focus()
}
function quote2() {
textbox.style.height = '80px'
text = document.getElementsByClassName('text')[0].innerHTML
textbox.value = '> ' + text + '\n\n'
textbox.focus()
}
textbox.addEventListener("keyup", function(e) {
if (!e.shiftKey && e.key === 'Enter') {
e.preventDefault();
send()
}
})
socket.on('online', function(data){
document.getElementsByClassName('board-chat-count')[0].innerHTML = data.length
let online = ''
for (const u of data)
online += `<li><a href="/@${u}" class="text-lg">${u}</a></li>`
document.getElementById('online').innerHTML = online
})
window.addEventListener('blur', function(){
focused=false
})
window.addEventListener('focus', function(){
focused=true
})
textbox.addEventListener("input", function() {
text = textbox.value
if (!text && is_typing==true){
is_typing=false;
socket.emit('typing', false);
}
else if (text && is_typing==false) {
is_typing=true;
socket.emit('typing', true);
}
})
socket.on('typing', function (users){
if (users.length==0){
document.getElementById('typing-indicator').innerHTML = '';
document.getElementById('loading-indicator').classList.add('d-none');
}
else if (users.length==1){
document.getElementById('typing-indicator').innerHTML = '<b>'+users[0]+"</b> is typing...";
document.getElementById('loading-indicator').classList.remove('d-none');
}
else if (users.length==2){
document.getElementById('typing-indicator').innerHTML = '<b>'+users[0]+"</b> and <b>"+users[1]+"</b> are typing...";
document.getElementById('loading-indicator').classList.remove('d-none');
}
else if (users.length==3){
document.getElementById('typing-indicator').innerHTML = '<b>'+users[0]+"</b>, <b>"+users[1]+"</b>, and <b>"+users[2]+"</b> are typing...";
document.getElementById('loading-indicator').classList.remove('d-none');
}
else if (users.length>=4){
more=users.length-3
document.getElementById('typing-indicator').innerHTML = '<b>'+users[0]+"</b>, <b>"+users[1]+"</b>, <b>"+users[2]+"</b> and "+more.toString()+" more are typing...";
document.getElementById('loading-indicator').classList.remove('d-none');
}
})
</script>
<input id="vid" type="hidden" value="{{v.id}}">
<input id="site_name" type="hidden" value="{{SITE_NAME}}">
<script data-cfasync="false" src="/assets/js/chat.js?v=20"></script>
<style>
#chat-window {