Updates.

Browse Source
This commit is contained in:
retoor 2025-04-02 14:55:18 +02:00
parent b365afc910
commit 99b2beeab0
9 changed files with 70 additions and 15 deletions

4
src/snek/app.py
View File

@ -2,7 +2,7 @@ import asyncio
import logging import logging
import pathlib import pathlib
import time import time
import uuid
from snek.view.threads import ThreadsView from snek.view.threads import ThreadsView
logging.basicConfig(level=logging.DEBUG) logging.basicConfig(level=logging.DEBUG)
@ -189,6 +189,8 @@ class Application(BaseApplication):
channels = [] channels = []
if not context: if not context:
context = {} context = {}
context['rid'] = str(uuid.uuid4())
if request.session.get("uid"): if request.session.get("uid"):
async for subscribed_channel in self.services.channel_member.find( async for subscribed_channel in self.services.channel_member.find(
user_uid=request.session.get("uid"), deleted_at=None, is_banned=False user_uid=request.session.get("uid"), deleted_at=None, is_banned=False

40
src/snek/static/base.css
View File

@ -42,6 +42,7 @@ header {
padding-top: 10px; padding-top: 10px;
padding-left: 20px; padding-left: 20px;
padding-right: 20px; padding-right: 20px;
padding-bottom: 10px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
@ -79,6 +80,17 @@ a {
margin-bottom: 3px; margin-bottom: 3px;
} }
h1 {
font-size: 2em;
color: #f05a28;
}
h2 {
font-size: 1.4em;
color: #f05a28;
}
.chat-area { .chat-area {
flex: 1; flex: 1;
display: flex; display: flex;
@ -354,7 +366,31 @@ a {
color: #fff; color: #fff;
} }
@media only screen and (max-width: 600px) { @media only screen and (max-width: 768px) {
header{
position:fixed;
top: 0;
left: 0;
text-overflow: ellipsis;
*{
font-size: 12px !important;
}
.logo {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
h2 {
font-size: 12px;
}
}
}
/*
body {
justify-content: flex-start;
}
header{ header{
position: sticky; position: sticky;
display: block; display: block;
@ -364,5 +400,5 @@ a {
} }
.chat-input { .chat-input {
position:sticky; position:sticky;
} }*/
} }

2
src/snek/static/generic-form.css
View File

@ -34,11 +34,11 @@ generic-form {
text-align: center; text-align: center;
} }
.generic-form-container h1 { .generic-form-container h1 {
font-size: 2em; font-size: 2em;
color: #f05a28; color: #f05a28;
margin-bottom: 20px; margin-bottom: 20px;
} }
input { input {

2
src/snek/static/generic-form.js
View File

@ -266,9 +266,9 @@ class GenericForm extends HTMLElement {
} }
div { div {
min-width:350px;
border-radius: 10px; border-radius: 10px;
padding: 30px; padding: 30px;
width: 400px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
text-align: center; text-align: center;
} }

6
src/snek/static/style.css
View File

@ -56,3 +56,9 @@ div {
text-align: left; text-align: left;
} }
@media screen and (max-width: 500px) {
body {
justify-content: flex-start;
}

10
src/snek/templates/app.html
View File

@ -21,11 +21,12 @@
<script defer src="https://umami.molodetz.nl/script.js" data-website-id="d127c3e4-dc70-4041-a1c8-bcc32c2492ea"></script> <script defer src="https://umami.molodetz.nl/script.js" data-website-id="d127c3e4-dc70-4041-a1c8-bcc32c2492ea"></script>
</head> </head>
<body> <body>
<header> <header>
<div class="no-select logo" style="display:none">Snek</div> <div class="logo no-select">{% block header_text %}{% endblock %}</div>
<nav class="no-select" style="float:right;overflow:hidden;scroll-behavior:smooth">
<div class="logo">{% block header_text %}{% endblock %}</div>
<nav class="no-select">
<a class="no-select" href="/web.html">🏠</a> <a class="no-select" href="/web.html">🏠</a>
<a class="no-select" href="/search-user.html">🔍</a> <a class="no-select" href="/search-user.html">🔍</a>
<a class="no-select" style="display:none" id="install-button" href="#">📥</a> <a class="no-select" style="display:none" id="install-button" href="#">📥</a>
@ -39,6 +40,7 @@
{% block sidebar %} {% block sidebar %}
{% include "sidebar_channels.html" %} {% include "sidebar_channels.html" %}
{% endblock %} {% endblock %}
{% block main %} {% block main %}
<chat-window class="chat-area"></chat-window> <chat-window class="chat-area"></chat-window>
{% endblock %} {% endblock %}

4
src/snek/templates/base.html
View File

@ -16,10 +16,10 @@
<script src="/app.js" type="module"></script> <script src="/app.js" type="module"></script>
<script src="/message-list.js" type="module"></script> <script src="/message-list.js" type="module"></script>
<style>{{ highlight_styles }}</style> <style>{{ highlight_styles }}</style>
<link rel="stylesheet" href="/style.css"> <link rel="stylesheet" href="/style.css?rid={{ rid }}">
<script src="/fancy-button.js" type="module"></script> <script src="/fancy-button.js" type="module"></script>
<script src="/html-frame.js" type="module"></script> <script src="/html-frame.js" type="module"></script>
<script src="/generic-form.js" type="module"></script> <script src="/generic-form.js?rid={{ rid }}" type="module"></script>
<link rel="stylesheet" href="/html-frame.css"> <link rel="stylesheet" href="/html-frame.css">
<script defer src="https://umami.molodetz.nl/script.js" data-website-id="d127c3e4-dc70-4041-a1c8-bcc32c2492ea"></script> <script defer src="https://umami.molodetz.nl/script.js" data-website-id="d127c3e4-dc70-4041-a1c8-bcc32c2492ea"></script>
{% block head %} {% block head %}

2
src/snek/templates/sidebar_channels.html
View File

@ -4,10 +4,12 @@
} }
</style> </style>
<aside class="sidebar" id="channelSidebar"> <aside class="sidebar" id="channelSidebar">
{#
<h2 class="no-select">Terminals</h2> <h2 class="no-select">Terminals</h2>
<ul> <ul>
<li><a class="no-select" href="/terminal.html">Ubuntu</a></li> <li><a class="no-select" href="/terminal.html">Ubuntu</a></li>
</ul> </ul>
#}
{% if channels %} {% if channels %}
<h2 class="no-select">Channels</h2> <h2 class="no-select">Channels</h2>
<ul> <ul>

15
src/snek/templates/web.html
View File

@ -1,9 +1,14 @@
{% extends "app.html" %} {% extends "app.html" %}
{% block header_text %}<h2>{{ name }}</h2>{% endblock %} {% block header_text %}<h2 style="color:#fff">{{ name }}</h2>{% endblock %}
{% block main %} {% block main %}
<section class="chat-area" id="chat">
<section class="chat-area">
<div class="chat-messages"> <div class="chat-messages">
{% for message in messages %} {% for message in messages %}
{% autoescape false %} {% autoescape false %}
@ -11,10 +16,10 @@
{% endautoescape %} {% endautoescape %}
{% endfor %} {% endfor %}
</div> </div>
<footer class="chat-input"> <div class="chat-input">
<textarea placeholder="Type a message..." rows="2"></textarea> <textarea placeholder="Type a message..." rows="2"></textarea>
<upload-button channel="{{ channel.uid.value }}"></upload-button> <upload-button channel="{{ channel.uid.value }}"></upload-button>
</footer> </div>
</section> </section>
<script type="module"> <script type="module">
@ -137,6 +142,8 @@
lastMessage = messagesContainer.querySelector(".message:last-child"); lastMessage = messagesContainer.querySelector(".message:last-child");
if (doScrollDown) { if (doScrollDown) {
lastMessage?.scrollIntoView({ block: "end", inline: "nearest" }); lastMessage?.scrollIntoView({ block: "end", inline: "nearest" });
const inputBox = document.querySelector(".chat-input");
inputBox.scrollIntoView({ block: "end", inline: "nearest" });
} }
} }