Оптимизация минимальной версии

app.py

@@ -1,6 +1,5 @@
 import uuid
-
-from flask import Flask, render_template, request
+from flask import Flask, render_template
 from flask_socketio import SocketIO, join_room
 
 app = Flask(__name__)
@@ -18,47 +17,18 @@ def chat(chat_id):
     return render_template("chat.html", chat_id=chat_id)
 
 
-@socketio.on("join_chat")
-def on_join(data):
-    chat_id = data["chat_id"]
-    join_room(chat_id)
-    socketio.emit(
-        "receive_message",
-        {"text": "Пользователь подключился!", "sender_id": data["sender_id"]},
-        to=chat_id,
-    )
-
-
 @socketio.on("update_message")
 def handle_message(data):
+    chat_id = data.get("chat_id")
+    if chat_id:
+        join_room(chat_id)
+
     socketio.emit(
         "receive_message",
-        {"text": data["text"], "sender_id": data["sender_id"]},
-        to=data["chat_id"],
+        {"text": data.get("text"), "sender_id": data.get("sender_id")},
+        to=chat_id,
     )
 
 
-@socketio.on("call:request")
-def handle_call_request(data):
-    chat_id = data["chatId"]
-    socketio.emit("call:incoming", data, to=chat_id, skip_sid=request.sid)  # pyright: ignore[reportAttributeAccessIssue]
-
-
-@socketio.on("call:response")
-def handle_call_response(data):
-    chat_id = data["chatId"]
-    if data["accepted"]:
-        socketio.emit("call:accepted", data, to=chat_id, skip_sid=request.sid)  # pyright: ignore[reportAttributeAccessIssue]
-    else:
-        socketio.emit("call:rejected", data, to=chat_id, skip_sid=request.sid)  # pyright: ignore[reportAttributeAccessIssue]
-
-
-# WebRTC сигнализация
-@socketio.on("webrtc:ice-candidate")
-def handle_ice_candidate(data):
-    chat_id = data["chatId"]
-    socketio.emit("webrtc:ice-candidate", data, to=chat_id, skip_sid=request.sid)  # pyright: ignore[reportAttributeAccessIssue]
-
-
 if __name__ == "__main__":
     socketio.run(app, host="0.0.0.0", port=80, debug=True)

static/css/animation.css

@@ -5,52 +5,25 @@ button,
         box-shadow 300ms ease;
 }
 
-button,
+button:hover,
 .button:hover {
     transform: scale(1.01);
     box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);
 }
 
-button,
+button:active,
 .button:active {
     transform: scale(0.98);
     box-shadow: 0px 4px 8px rgba(0, 0, 0, 0);
 }
 
-.call::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    border-radius: 12px;
-    padding: 2px; /* толщина обводки */
-    background: linear-gradient(45deg, #ff8a00, #e52e71, #22c1c3);
-    -webkit-mask:
-        linear-gradient(#fff 0 0) content-box,
-        linear-gradient(#fff 0 0);
-    mask:
-        linear-gradient(#fff 0 0) content-box,
-        linear-gradient(#fff 0 0);
-    -webkit-mask-composite: destination-out;
-    mask-composite: exclude;
-    opacity: 1;
-    transition: opacity 0.3s ease;
-    pointer-events: none;
-}
-
 /* Опционально: анимация вращения градиента */
 @keyframes rotate-border {
     0% {
         background: linear-gradient(0deg, #ff8a00, #e52e71, #22c1c3);
     }
+
     100% {
         background: linear-gradient(360deg, #ff8a00, #e52e71, #22c1c3);
     }
-}
-
-.call.animated-border::before {
-    animation: rotate-border 2s linear infinite;
-    opacity: 1;
-}
+}

static/css/main.css

@@ -16,6 +16,7 @@ body {
     padding: 0;
     background-color: var(--backgrond);
 }
+
 main {
     height: var(--vh);
     box-sizing: border-box;
@@ -31,9 +32,11 @@ a {
 h1 {
     font-size: 4rem;
 }
+
 h2 {
     font-size: 2rem;
 }
+
 h3 {
     font-size: 1.5rem;
 }
@@ -42,9 +45,11 @@ h3 {
     h1 {
         font-size: clamp(2rem, 6vw, 3rem);
     }
+
     h2 {
         font-size: clamp(1.125rem, 4vw, 1.125rem);
     }
+
     h3 {
         font-size: clamp(1.125rem, 4.5vw, 1.25rem);
     }
@@ -84,8 +89,8 @@ button,
     cursor: pointer;
 }
 
-button > i,
-.button > i {
+button>i,
+.button>i {
     font-size: 1.2rem;
 }
 
@@ -95,7 +100,6 @@ button > i,
     inset: 20px auto auto 50%;
     transform: translateX(-50%);
     background-color: var(--button);
-    color: var(--adptive-text);
     padding: 10px 20px;
     border-radius: 12px;
     z-index: 9999;
@@ -119,6 +123,7 @@ button > i,
     padding: 20px 0;
     box-sizing: border-box;
 }
+
 .hero::before {
     content: "";
     flex: 0 0 auto;
@@ -163,7 +168,7 @@ nav {
     flex-direction: row-reverse;
 }
 
-nav > .buttons {
+nav>.buttons {
     display: flex;
     align-items: center;
     justify-content: space-between;
@@ -211,6 +216,7 @@ textarea {
     resize: none;
     overflow-y: auto;
 }
+
 textarea:focus {
     outline: none;
 }
@@ -221,9 +227,11 @@ textarea:focus {
         bottom: 20px;
         font-size: 1.4rem;
     }
+
     nav {
         bottom: 100px !important;
     }
+
     textarea {
         font-size: 1.2rem;
     }
@@ -242,13 +250,4 @@ code {
     width: 100%;
     padding: 2px 6px;
     box-sizing: border-box;
-}
-
-.accept {
-    background: var(--green);
-    color: var(--text-color);
-}
-.decline {
-    background: var(--red);
-    color: var(--text-color);
-}
+}

static/css/variables.css

@@ -13,7 +13,6 @@
 
 @media (prefers-color-scheme: light) {
     :root {
-        --bg-color: var(--black);
         --text-color: var(--black);
         --button: var(--ligth2);
         --backgrond: var(--ligth);
@@ -24,7 +23,6 @@
 @media (prefers-color-scheme: dark) {
     :root {
         --text-color: var(--white);
-        --bg-color: var(--white);
         --button: var(--dark2);
         --backgrond: var(--dark);
         --input: var(--black);
@@ -45,20 +43,8 @@
     opacity: 0;
     pointer-events: none !important;
 }
-.hidden * {
-    visibility: hidden !important;
-    width: 0;
-    height: 0;
-}
-
-#videoCallButton {
-    display: none;
-}
-#videoContainer {
-    display: none;
-}
 
 .show {
     visibility: visible !important;
     opacity: 1 !important;
-}
+}