Try to ensure websocket is closed when forgetting about it

Might not be necessary, but if it is then it prevents a sitation where a
websocket is still open but we've forgotten about it, so we will never
broadcast any new messages to it and the client will be practically frozen in
time until they disconnect and open a new websocket.

Also update the user's last_seen when the websocket is closed. This prevents a
user with js enabled who's actually idle being considered absent and being
rotated when their websocket accidentally closes for a few seconds.

CHANGELOG.md

@@ -0,0 +1,15 @@
+### 1.0.0
+
+* Reimplemented the project from scratch. The original implementation
+  is on the [`historical`][historical] branch.
+
+##### 1.0.1
+
+* Added `overflow: hidden;` css to chat messages. This prevents
+  messages with weird unicode characters from overlapping other
+  messages.
+* Fixed users' colours in nojs chat.
+* Added `white-space: pre-wrap;` css to chat messages, so
+  multi-line messages actually appear on multiple lines.
+
+[historical]: https://git.076.ne.jp/ninya9k/anonstream/src/branch/historical

anonstream/routes/websocket.py

@@ -5,6 +5,7 @@ import asyncio
 
 from quart import current_app, websocket
 
+from anonstream.user import see
 from anonstream.websocket import websocket_outbound, websocket_inbound
 from anonstream.routes.wrappers import with_user_from
 
@@ -19,4 +20,9 @@ async def live(user):
     try:
         await asyncio.gather(producer, consumer)
     finally:
+        see(user)
         user['websockets'].remove(queue)
+        try:
+            await websocket.close(1000)
+        except RuntimeError:
+            pass

anonstream/static/style.css

@@ -214,6 +214,7 @@ noscript {
   vertical-align: top;
 }
 .chat-message__markup {
+  white-space: pre-wrap;
   overflow-wrap: anywhere;
   line-height: 1.3125;
 }

anonstream/templates/home.html

@@ -41,7 +41,7 @@
     <a href="#chat">chat</a>
     <a href="#both">both</a>
   </nav>
-  <footer>anonstream 1.0.0 &mdash; <a href="https://git.076.ne.jp/ninya9k/anonstream" target="_blank">source</a></footer>
+  <footer>anonstream 1.0.1 &mdash; <a href="https://git.076.ne.jp/ninya9k/anonstream" target="_blank">source</a></footer>
   <script src="{{ url_for('static', filename='anonstream.js') }}" type="text/javascript"></script>
 </body>
 </html>

anonstream/templates/nojs_chat_messages.html

@@ -124,6 +124,7 @@
       vertical-align: top;
     }
     .chat-message__markup {
+      white-space: pre-wrap;
       overflow-wrap: anywhere;
       line-height: 1.3125;
     }
@@ -136,14 +137,14 @@
     }
 
     {% for token in messages | map(attribute='token') | list | unique %}
-      {% with user = users_by_token[token] %}
-        [data-token-hash="{{ user.token_hash }}"] > .chat-message__name {
-          color: {{ user.color }};
+      {% with this_user = users_by_token[token] %}
+        [data-token-hash="{{ this_user.token_hash }}"] > .chat-message__name {
+          color: {{ this_user.color }};
         }
-        {% if user.tripcode %}
-          [data-token-hash="{{ user.token_hash }}"] > .tripcode {
-            background-color: {{ user.tripcode.background_color }};
-            color: {{ user.tripcode.foreground_color }};
+        {% if this_user.tripcode %}
+          [data-token-hash="{{ this_user.token_hash }}"] > .tripcode {
+            background-color: {{ this_user.tripcode.background_color }};
+            color: {{ this_user.tripcode.foreground_color }};
           }
         {% endif %}
       {% endwith %}
@@ -161,15 +162,15 @@
   </aside>
   <ol id="chat-messages">
     {% for message in messages | reverse %}
-      <li class="chat-message" data-seq="{{ message.seq }}" data-token-hash="{{ user.token_hash }}">
-        {% with user = users_by_token[message.token] %}
+      {% with this_user = users_by_token[message.token] %}
+        <li class="chat-message" data-seq="{{ message.seq }}" data-token-hash="{{ this_user.token_hash }}">
           <time class="chat-message__time" datetime="{{ message.date }}T{{ message.time_seconds }}Z" title="{{ message.date }} {{ message.time_seconds }}">{{ message.time_minutes }}</time>
           {{- '&nbsp;' | safe -}}
-          {{ appearance(user, insignia_class='chat-message__insignia', name_class='chat-message__name', tag_class='chat-message__name__tag') }}
+          {{ appearance(this_user, insignia_class='chat-message__insignia', name_class='chat-message__name', tag_class='chat-message__name__tag') }}
           {{- ': ' -}}
           <span class="chat-message__markup">{{ message.markup }}</span>
-        {% endwith %}
-      </li>
+        </li>
+      {% endwith %}
     {% endfor %}
   </ol>
   <aside id="timeout-dismiss">

anonstream/templates/nojs_chat_users.html

@@ -86,14 +86,14 @@
       cursor: default;
     }
 
-    {% for user in users_watching + users_notwatching %}
-      [data-token-hash="{{ user.token_hash }}"] > .user__name {
-        color: {{ user.color }};
+    {% for this_user in users_watching + users_notwatching %}
+      [data-token-hash="{{ this_user.token_hash }}"] > .user__name {
+        color: {{ this_user.color }};
       }
-      {% if user.tripcode %}
-        [data-token-hash="{{ user.token_hash }}"] > .tripcode {
-          background-color: {{ user.tripcode.background_color }};
-          color: {{ user.tripcode.foreground_color }};
+      {% if this_user.tripcode %}
+        [data-token-hash="{{ this_user.token_hash }}"] > .tripcode {
+          background-color: {{ this_user.tripcode.background_color }};
+          color: {{ this_user.tripcode.foreground_color }};
         }
       {% endif %}
     {% endfor %}