Update app.py

app.py

@@ -282,7 +282,7 @@ def logout():
 @app.route('/')
 def feed():
     data = load_data()
-    posts = data.get('posts', [])
+    posts = sorted(data.get('posts', []), key=lambda x: datetime.strptime(x['upload_date'], '%Y-%m-%d %H:%M:%S'), reverse=True)
     is_authenticated = 'username' in session
     username = session.get('username', None)
     html = '''
@@ -312,6 +312,8 @@ def feed():
             .modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 2000; justify-content: center; align-items: center; }
             .modal img { max-width: 90%; max-height: 90%; object-fit: contain; transform: scale(1); transition: transform 0.2s ease; }
             .stats { font-size: 0.9em; color: #666; margin-top: 5px; }
+            .username-link { color: #3b82f6; text-decoration: none; font-weight: 600; }
+            .username-link:hover { text-decoration: underline; }
             @media (max-width: 768px) {
                 .sidebar { transform: translateX(-100%); width: 200px; }
                 .sidebar.active { transform: translateX(0); }
@@ -341,7 +343,7 @@ def feed():
                     {% endif %}
                     <h2>{{ post['title'] }}</h2>
                     <p>{{ post['description'] }}</p>
-                    <p>Загрузил: {{ post['uploader'] }} | {{ post['upload_date'] }}</p>
+                    <p>Загрузил: <a href="{{ url_for('user_profile', username=post['uploader']) }}" class="username-link">{{ post['uploader'] }}</a> | {{ post['upload_date'] }}</p>
                     <p class="stats">Просмотров: {{ post['views'] }} | Лайков: {{ post['likes']|length }}</p>
                 </a>
                 {% endfor %}
@@ -485,6 +487,8 @@ def post_page(post_id):
             .comment { border-top: 1px solid #e2e8f0; padding: 10px 0; }
             .modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 2000; justify-content: center; align-items: center; }
             .modal img { max-width: 90%; max-height: 90%; object-fit: contain; transform: scale(1); transition: transform 0.2s ease; }
+            .username-link { color: #3b82f6; text-decoration: none; font-weight: 600; }
+            .username-link:hover { text-decoration: underline; }
             @media (max-width: 768px) {
                 .sidebar { transform: translateX(-100%); width: 200px; }
                 .sidebar.active { transform: translateX(0); }
@@ -510,7 +514,7 @@ def post_page(post_id):
                 <img src="https://huggingface.co/datasets/{{ repo_id }}/resolve/main/{{ post['type'] }}s/{{ post['filename'] }}" alt="{{ post['title'] }}" onclick="openModal(this.src)">
             {% endif %}
             <p>{{ post['description'] }}</p>
-            <p>Загрузил: {{ post['uploader'] }} | {{ post['upload_date'] }}</p>
+            <p>Загрузил: <a href="{{ url_for('user_profile', username=post['uploader']) }}" class="username-link">{{ post['uploader'] }}</a> | {{ post['upload_date'] }}</p>
             <p>Просмотров: {{ post['views'] }} | Лайков: {{ post['likes']|length }}</p>
             {% if is_authenticated %}
                 <form method="POST" style="display: inline;">
@@ -526,7 +530,7 @@ def post_page(post_id):
             <h3>Комментарии</h3>
             {% for comment in post.get('comments', []) %}
                 <div class="comment">
-                    <p><strong>{{ comment['user'] }}</strong> ({{ comment['date'] }}): {{ comment['text'] }}</p>
+                    <p><strong><a href="{{ url_for('user_profile', username=comment['user']) }}" class="username-link">{{ comment['user'] }}</a></strong> ({{ comment['date'] }}): {{ comment['text'] }}</p>
                 </div>
             {% endfor %}
             <a href="{{ url_for('feed') }}" class="btn">Назад к ленте</a>
@@ -603,7 +607,7 @@ def post_page(post_id):
     '''
     return render_template_string(html, post=post, repo_id=REPO_ID, is_authenticated=is_authenticated, username=username)
 
-# Страница профиля
+# Страница профиля текущего пользователя
 @app.route('/profile', methods=['GET', 'POST'])
 def profile():
     if 'username' not in session:
@@ -612,7 +616,7 @@ def profile():
     
     data = load_data()
     username = session['username']
-    user_posts = [p for p in data['posts'] if p['uploader'] == username]
+    user_posts = sorted([p for p in data['posts'] if p['uploader'] == username], key=lambda x: datetime.strptime(x['upload_date'], '%Y-%m-%d %H:%M:%S'), reverse=True)
     is_authenticated = 'username' in session
 
     if request.method == 'POST':
@@ -711,7 +715,7 @@ def profile():
             }
 
             function openModal(src, event) {
-                if (event) event.preventDefault();
+                event.preventDefault();
                 const modal = document.getElementById('imageModal');
                 const modalImg = document.getElementById('modalImage');
                 modal.style.display = 'flex';
@@ -783,6 +787,172 @@ def profile():
     '''
     return render_template_string(html, username=username, user_posts=user_posts, repo_id=REPO_ID, is_authenticated=is_authenticated)
 
+# Страница профиля другого пользователя
+@app.route('/profile/<username>')
+def user_profile(username):
+    data = load_data()
+    if username not in data['users']:
+        return "Пользователь не найден", 404
+    
+    user_posts = sorted([p for p in data['posts'] if p['uploader'] == username], key=lambda x: datetime.strptime(x['upload_date'], '%Y-%m-%d %H:%M:%S'), reverse=True)
+    is_authenticated = 'username' in session
+    current_user = session.get('username', None)
+
+    html = '''
+    <!DOCTYPE html>
+    <html lang="ru">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Профиль - {{ username }}</title>
+        <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
+        <style>
+            body { font-family: 'Poppins', sans-serif; background: linear-gradient(135deg, #e0e7ff, #f3f4f6); margin: 0; padding: 0; min-height: 100vh; }
+            .sidebar { position: fixed; left: 0; top: 0; width: 250px; height: 100%; background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); padding: 20px; box-shadow: 2px 0 15px rgba(0,0,0,0.1); transition: transform 0.3s ease; z-index: 1000; }
+            .sidebar-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
+            .nav-brand { font-size: 1.5em; font-weight: 600; color: #3b82f6; }
+            .nav-links { display: flex; flex-direction: column; gap: 10px; }
+            .nav-link { display: flex; align-items: center; gap: 10px; padding: 12px 15px; background: rgba(59, 130, 246, 0.1); color: #3b82f6; text-decoration: none; border-radius: 8px; transition: all 0.3s ease; }
+            .nav-link:hover { background: rgba(59, 130, 246, 0.3); color: #2563eb; transform: translateX(5px); }
+            .logout-btn { background: rgba(239, 68, 68, 0.1); color: #ef4444; }
+            .logout-btn:hover { background: rgba(239, 68, 68, 0.3); color: #dc2626; }
+            .menu-btn { display: none; font-size: 28px; background: rgba(255, 255, 255, 0.9); border: none; color: #3b82f6; cursor: pointer; position: fixed; top: 15px; left: 15px; z-index: 1001; padding: 5px 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
+            .container { max-width: 800px; margin: 20px auto 20px 270px; padding: 20px; transition: margin-left 0.3s ease; }
+            .post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
+            .post-item { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(5px); padding: 15px; border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.1); transition: transform 0.3s ease; }
+            .post-item:hover { transform: scale(1.02); }
+            .post-preview { width: 100%; border-radius: 8px; height: 200px; object-fit: cover; cursor: pointer; }
+            .btn { display: block; margin: 10px 0; padding: 12px 20px; background: rgba(59, 130, 246, 0.9); color: white; text-decoration: none; border-radius: 8px; border: none; cursor: pointer; transition: all 0.3s ease; }
+            .btn:hover { background: rgba(59, 130, 246, 1); transform: scale(1.05); }
+            .stats { font-size: 0.9em; color: #666; margin-top: 5px; }
+            .modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 2000; justify-content: center; align-items: center; }
+            .modal img { max-width: 90%; max-height: 90%; object-fit: contain; transform: scale(1); transition: transform 0.2s ease; }
+            .username-link { color: #3b82f6; text-decoration: none; font-weight: 600; }
+            .username-link:hover { text-decoration: underline; }
+            @media (max-width: 768px) {
+                .sidebar { transform: translateX(-100%); width: 200px; }
+                .sidebar.active { transform: translateX(0); }
+                .menu-btn { display: block; }
+                .container { margin: 60px 10px 20px 10px; max-width: calc(100% - 20px); }
+                .post-grid { grid-template-columns: 1fr; gap: 15px; }
+                .post-item { padding: 10px; }
+                .post-preview { height: 150px; }
+                .btn { font-size: 14px; padding: 10px; }
+                h1, h2 { font-size: 1.5em; }
+            }
+        </style>
+    </head>
+    <body>
+        <button class="menu-btn" onclick="toggleSidebar()">☰</button>
+        ''' + NAV_HTML + '''
+        <div class="container">
+            <h1>Профиль: {{ username }}</h1>
+            <h2>Публикации</h2>
+            <div class="post-grid">
+                {% if user_posts %}
+                    {% for post in user_posts %}
+                    <div class="post-item">
+                        <a href="{{ url_for('post_page', post_id=post['id']) }}">
+                            {% if post['type'] == 'video' %}
+                                <video class="post-preview" preload="metadata" muted>
+                                    <source src="https://huggingface.co/datasets/{{ repo_id }}/resolve/main/{{ post['type'] }}s/{{ post['filename'] }}" type="video/mp4">
+                                </video>
+                            {% else %}
+                                <img class="post-preview" src="https://huggingface.co/datasets/{{ repo_id }}/resolve/main/{{ post['type'] }}s/{{ post['filename'] }}" alt="{{ post['title'] }}" onclick="openModal(this.src, event)">
+                            {% endif %}
+                            <h3>{{ post['title'] }}</h3>
+                        </a>
+                        <p>{{ post['description'] }}</p>
+                        <p>{{ post['upload_date'] }}</p>
+                        <p class="stats">Просмотров: {{ post['views'] }} | Лайков: {{ post['likes']|length }}</p>
+                    </div>
+                    {% endfor %}
+                {% else %}
+                    <p>Этот пользователь пока не загрузил ни одной публикации.</p>
+                {% endif %}
+            </div>
+        </div>
+        <div class="modal" id="imageModal" onclick="closeModal(event)">
+            <img id="modalImage" src="">
+        </div>
+        <script>
+            function toggleSidebar() {
+                document.getElementById('sidebar').classList.toggle('active');
+            }
+
+            function openModal(src, event) {
+                event.preventDefault();
+                const modal = document.getElementById('imageModal');
+                const modalImg = document.getElementById('modalImage');
+                modal.style.display = 'flex';
+                modalImg.src = src;
+                modalImg.style.transform = 'scale(1)';
+            }
+
+            function closeModal(event) {
+                if (event.target.tagName !== 'IMG') {
+                    const modal = document.getElementById('imageModal');
+                    modal.style.display = 'none';
+                }
+            }
+
+            document.addEventListener('DOMContentLoaded', function() {
+                const videos = document.querySelectorAll('.post-preview');
+                videos.forEach(video => {
+                    if (video.tagName === 'VIDEO') {
+                        video.addEventListener('loadedmetadata', function() {
+                            const duration = video.duration;
+                            const randomTime = Math.random() * duration;
+                            video.currentTime = randomTime;
+                        });
+                    }
+                });
+
+                const modalImg = document.getElementById('modalImage');
+                let scale = 1;
+                let startDistance = 0;
+                let lastTap = 0;
+
+                modalImg.addEventListener('dblclick', function() {
+                    scale = scale === 1 ? 2 : 1;
+                    modalImg.style.transform = `scale(${scale})`;
+                });
+
+                modalImg.addEventListener('touchstart', function(e) {
+                    if (e.touches.length === 2) {
+                        startDistance = getDistance(e.touches[0], e.touches[1]);
+                    } else if (e.touches.length === 1) {
+                        const now = new Date().getTime();
+                        if (now - lastTap < 300) {
+                            scale = scale === 1 ? 2 : 1;
+                            modalImg.style.transform = `scale(${scale})`;
+                        }
+                        lastTap = now;
+                    }
+                });
+
+                modalImg.addEventListener('touchmove', function(e) {
+                    if (e.touches.length === 2) {
+                        e.preventDefault();
+                        const currentDistance = getDistance(e.touches[0], e.touches[1]);
+                        scale = Math.max(1, Math.min(3, scale * (currentDistance / startDistance)));
+                        modalImg.style.transform = `scale(${scale})`;
+                        startDistance = currentDistance;
+                    }
+                });
+
+                function getDistance(touch1, touch2) {
+                    const dx = touch1.pageX - touch2.pageX;
+                    const dy = touch1.pageY - touch2.pageY;
+                    return Math.sqrt(dx * dx + dy * dy);
+                }
+            });
+        </script>
+    </body>
+    </html>
+    '''
+    return render_template_string(html, username=username, user_posts=user_posts, repo_id=REPO_ID, is_authenticated=is_authenticated, current_user=current_user)
+
 # Страница загрузки контента
 @app.route('/upload', methods=['GET', 'POST'])
 def upload():