From 03dee6b1f06fc4b15f00a96ec91f58dd61c5d61f Mon Sep 17 00:00:00 2001
From: veselcraft <veselcraft@icloud.com>
Date: Sun, 28 Nov 2021 14:39:42 +0300
Subject: [PATCH] Wall: Last comments on the post

---
 Web/Models/Entities/Postable.php              |  6 ++--
 Web/Models/Repositories/Comments.php          | 13 ++++++++
 Web/Presenters/templates/Wall/Wall.xml        |  2 +-
 .../templates/components/comment.xml          | 16 +++++-----
 Web/Presenters/templates/components/post.xml  |  2 +-
 .../components/post/microblogpost.xml         | 28 ++++++++++-------
 .../templates/components/textArea.xml         |  8 +++--
 Web/Presenters/templates/components/wall.xml  |  2 +-
 Web/static/css/microblog.css                  | 30 +++++++++++++++++++
 Web/static/js/openvk.cls.js                   | 13 +++++---
 10 files changed, 87 insertions(+), 33 deletions(-)

diff --git a/Web/Models/Entities/Postable.php b/Web/Models/Entities/Postable.php
index b5749819..c3585dc3 100644
--- a/Web/Models/Entities/Postable.php
+++ b/Web/Models/Entities/Postable.php
@@ -73,10 +73,10 @@ abstract class Postable extends Attachable
     {
         return (new Comments)->getCommentsCountByTarget($this);
     }
-	
-	function getLastComments()
+
+    function getLastComments(int $count): \Traversable
     {
-        return (new Comments)->getLastCommentsByTarget($this);
+        return (new Comments)->getLastCommentsByTarget($this, $count);
     }
     
     function getLikesCount(): int
diff --git a/Web/Models/Repositories/Comments.php b/Web/Models/Repositories/Comments.php
index ea956a6f..6c922511 100644
--- a/Web/Models/Repositories/Comments.php
+++ b/Web/Models/Repositories/Comments.php
@@ -37,6 +37,19 @@ class Comments
         foreach($comments as $comment)
             yield $this->toComment($comment);
     }
+
+    function getLastCommentsByTarget(Postable $target, ?int $count = NULL): \Traversable
+    {
+        $comments = $this->comments->where([
+            "model"   => get_class($target),
+            "target"  => $target->getId(),
+            "deleted" => false,
+        ])->page(1, $count ?? OPENVK_DEFAULT_PER_PAGE)->order("created DESC");
+        
+        $comments = array_reverse(iterator_to_array($comments));
+        foreach($comments as $comment)
+            yield $this->toComment($comment);
+    }
     
     function getCommentsCountByTarget(Postable $target): int
     {
diff --git a/Web/Presenters/templates/Wall/Wall.xml b/Web/Presenters/templates/Wall/Wall.xml
index 69de494e..7e1969e8 100644
--- a/Web/Presenters/templates/Wall/Wall.xml
+++ b/Web/Presenters/templates/Wall/Wall.xml
@@ -24,7 +24,7 @@
                 {foreach $posts as $post}
                     <a name="postGarter={$post->getId()}"></a>
                     
-                    {include "../components/post.xml", post => $post}
+                    {include "../components/post.xml", post => $post, commentSection => true}
                 {/foreach}
                 {include "../components/paginator.xml", conf => $paginatorConf}
             {else}
diff --git a/Web/Presenters/templates/components/comment.xml b/Web/Presenters/templates/components/comment.xml
index 608fc9ca..cc3f9c8d 100644
--- a/Web/Presenters/templates/components/comment.xml
+++ b/Web/Presenters/templates/components/comment.xml
@@ -1,20 +1,19 @@
 {var author = $comment->getOwner()}
 
 <a name="cid={$comment->getId()}"></a>
-<table border="0" style="font-size: 11px;" class="post" id="_comment{$comment->getId()}" data-comment-id="{$comment->getId()}" data-owner-id="{$author->getId()}">
+<table border="0" style="font-size: 11px;" class="post comment" id="_comment{$comment->getId()}" data-comment-id="{$comment->getId()}" data-owner-id="{$author->getId()}">
     <tbody>
         <tr>
-            <td width="54" valign="top">
+            <td width="30" valign="top">
                 <img
                     src="{$author->getAvatarURL()}"
-                    width="50" />
+                    width="30" />
             </td>
             <td width="345" valign="top">
                 <div class="post-author">
                     <a href="{$author->getURL()}"><b>
                         {$author->getCanonicalName()}
-                    </b></a> {$author->isFemale() ? tr("post_writes_f") : tr("post_writes_m")}<br/>
-                    <a href="#_comment{$comment->getId()}" class="date">{$comment->getPublicationTime()}</a>
+                    </b></a><br/>
                 </div>
                 <div class="post-content" id="{$comment->getId()}">
                     <div class="text" id="text{$comment->getId()}">
@@ -27,16 +26,15 @@
                         </div>
                     </div>
                     <div n:if="isset($thisUser) &&! ($compact ?? false)" class="post-menu">
+                        <a href="#_comment{$comment->getId()}" class="date">{$comment->getPublicationTime()}</a>&nbsp;|
                         {var canDelete = $comment->getOwner()->getId() == $thisUser->getId()}
                         {var canDelete = $canDelete || $comment->getTarget()->getOwner()->getId() == $thisUser->getId()}
                         {if $canDelete}
-                            <a href="/comment{$comment->getId()}/delete">{_"delete"}</a>&nbsp;|&nbsp;
+                            <a href="/comment{$comment->getId()}/delete">{_"delete"}</a>&nbsp;|
                         {/if}
-                        
                         <a class="comment-reply">Ответить</a>
-                        
                         <div style="float: right; font-size: .7rem;">
-                            <a href="/comment{$comment->getId()}/like?hash={rawurlencode($csrfToken)}">
+                            <a class="post-like-button" href="/comment{$comment->getId()}/like?hash={rawurlencode($csrfToken)}">
                                 <div class="heart" style="{if $comment->hasLikeFrom($thisUser)}opacity: 1;{else}opacity: 0.4;{/if}"></div>
                                 <span class="likeCnt">{$comment->getLikesCount()}</span>
                             </a>
diff --git a/Web/Presenters/templates/components/post.xml b/Web/Presenters/templates/components/post.xml
index ffe32716..5c1bebe0 100644
--- a/Web/Presenters/templates/components/post.xml
+++ b/Web/Presenters/templates/components/post.xml
@@ -6,7 +6,7 @@
 {/if}
 
 {if $microblogEnabled}
-    {include "post/microblogpost.xml", post => $post, diff => $diff}
+    {include "post/microblogpost.xml", post => $post, diff => $diff, commentSection => $commentSection}
 {else}
     {include "post/oldpost.xml", post => $post, diff => $diff}
 {/if}
diff --git a/Web/Presenters/templates/components/post/microblogpost.xml b/Web/Presenters/templates/components/post/microblogpost.xml
index bee6e706..9a06dd0c 100644
--- a/Web/Presenters/templates/components/post/microblogpost.xml
+++ b/Web/Presenters/templates/components/post/microblogpost.xml
@@ -1,4 +1,8 @@
 {var author = $post->getOwner()}
+{var comments = $post->getLastComments(3)}
+{var commentsCount = $post->getCommentsCount()}
+
+{var commentTextAreaId = $post === null ? rand(1,300) : $post->getId()}
 
 <table border="0" style="font-size: 11px;" n:class="post, !$compact ? post-divider, $post->isExplicit() ? post-nsfw">
     <tbody>
@@ -72,18 +76,11 @@
                         &nbsp;
                         
                         {if !($forceNoCommentsLink ?? false)}
-                            <a href="/wall{$post->getPrettyId()}#comments">
-                                {if $post->getCommentsCount() > 0}
-                                    {_"comments"} (<b>{$post->getCommentsCount()}</b>)
-                                {else}
-                                    {_"comments"}
-                                {/if}
+                            <a n:if="$commentsCount == 0" href="javascript:expand_comment_textarea({$commentTextAreaId})">
+                                {_"comment"}
                             </a>
                         {/if}
                         
-                        
-                        
-
                         <div class="like_wrap">
                             <a class="post-share-button" href="javascript:repostPost('{$post->getPrettyId()}', '{rawurlencode($csrfToken)}')">
                                 <div class="repost-icon" style="opacity: 0.4;"></div>
@@ -101,8 +98,17 @@
                         </div>
                     {/if}
                 </div>
-                <div n:if="isset($thisUser) &&! ($compact ?? false)" class="post-menu-s">
-                    <!-- kosfurler -->
+                <div n:if="$commentSection == true && $compact == false" class="post-menu-s">
+                    {if $commentsCount > 3}
+                        <a href="/wall{$post->getPrettyId()}" class="expand_button">Посмотреть остальные комментарии</a>
+                    {/if}
+                    {foreach $comments as $comment}
+                        {include "../comment.xml", comment => $comment, $compact => true}
+                    {/foreach}
+                    <div n:ifset="$thisUser" id="commentTextArea{$commentTextAreaId}" n:attr="style => ($commentsCount == 0 ? 'display: none;')" class="commentsTextFieldWrap">
+                        {var commentsURL = "/al_comments.pl/create/posts/" . $post->getId()}
+                        {include "../textArea.xml", route => $commentsURL, postOpts => false, graffiti => (bool) ovkGetQuirk("comments.allow-graffiti"), post => $post}
+                    </div>
                 </div>
             </td>
         </tr>
diff --git a/Web/Presenters/templates/components/textArea.xml b/Web/Presenters/templates/components/textArea.xml
index 2033d393..3faab719 100644
--- a/Web/Presenters/templates/components/textArea.xml
+++ b/Web/Presenters/templates/components/textArea.xml
@@ -1,10 +1,12 @@
-<div id="write" style="padding: 5px 0;" onfocusin="expand_wall_textarea();">
+{var textAreaId = $post === null ? rand(1,300) : $post->getId()}
+
+<div id="write" style="padding: 5px 0;" onfocusin="expand_wall_textarea({$textAreaId});">
     <form action="{$route}" method="post" enctype="multipart/form-data" style="margin:0;">
-        <textarea id="wall-post-input" placeholder="{_write}" name="text" style="width: 100%;resize: none;" class="small-textarea"></textarea>
+        <textarea id="wall-post-input{$textAreaId}" placeholder="{_write}" name="text" style="width: 100%;resize: none;" class="small-textarea"></textarea>
         <div>
             <!-- padding to fix <br/> bug -->
         </div>
-        <div id="post-buttons" style="display: none;">
+        <div id="post-buttons{$textAreaId}" style="display: none;">
             <div class="post-upload">
                 Вложение: <span>(unknown)</span>
             </div>
diff --git a/Web/Presenters/templates/components/wall.xml b/Web/Presenters/templates/components/wall.xml
index bda474fa..f353f573 100644
--- a/Web/Presenters/templates/components/wall.xml
+++ b/Web/Presenters/templates/components/wall.xml
@@ -16,7 +16,7 @@
                 {foreach $posts as $post}
                     <a name="postGarter={$post->getId()}"></a>
                     
-                    {include "../components/post.xml", post => $post}
+                    {include "../components/post.xml", post => $post, commentSection => true}
                 {/foreach}
                 {include "../components/paginator.xml", conf => $paginatorConf}
             {else}
diff --git a/Web/static/css/microblog.css b/Web/static/css/microblog.css
index 7a091c10..ef9734a1 100644
--- a/Web/static/css/microblog.css
+++ b/Web/static/css/microblog.css
@@ -36,6 +36,11 @@
     color: grey;
 }
 
+.comment {
+    padding: 5px 0 0 0;
+    border-top: 1px #ddd solid;
+}
+
 .like_wrap {
     display: flex;
 }
@@ -56,6 +61,10 @@
     opacity: 0.4;
 }
 
+.likeCnt {
+    float: none;
+}
+
 #liked {
     opacity: 1 !important;
 }
@@ -104,3 +113,24 @@
 .post-author .pin:hover {
     opacity: 0.4;
 }
+
+.expand_button {
+    background-color: #eee;
+    width: 100%;
+    display: inline-block;;
+    height: 30px;
+    line-height: 28px;
+    text-align: center;
+}
+
+.expand_button:hover {
+    background-color: #e5e5e5;
+}
+
+.commentsTextFieldWrap {
+    padding: 0 7px;
+    background-color: #eee;
+    border: 1px solid #ccc;
+    border-left: 0;
+    border-right: 0;
+}
diff --git a/Web/static/js/openvk.cls.js b/Web/static/js/openvk.cls.js
index 3ad0bab6..297e0442 100644
--- a/Web/static/js/openvk.cls.js
+++ b/Web/static/js/openvk.cls.js
@@ -1,10 +1,15 @@
-function expand_wall_textarea() {
-    var el = document.getElementById('post-buttons');
-    var wi = document.getElementById('wall-post-input');
+function expand_wall_textarea(id) {
+    var el = document.getElementById('post-buttons'+id);
+    var wi = document.getElementById('wall-post-input'+id);
     el.style.display = "block";
     wi.className = "expanded-textarea";
+}
 
-
+function expand_comment_textarea(id) {
+    var el = document.getElementById('commentTextArea'+id);
+    var wi = document.getElementById('wall-post-input'+id);
+    el.style.display = "block";
+    wi.focus();
 }
 
 function edit_post(id, wid) {